@progress/kendo-react-grid 16.2.0-develop.5 → 16.2.0-develop.7

package/GridComponent.mjs

@@ -6,7 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as l from "react";
-import { uGrid as ua, hasValidLicense as ma, getLicenseMessage as ca, validatePackage as fa, getter as we, classNames as b, WatermarkOverlay as gt } from "@progress/kendo-react-common";
+import { uGrid as ua, hasValidLicense as ma, getLicenseMessage as ca, validatePackage as fa, getter as Ce, classNames as b, WatermarkOverlay as gt } from "@progress/kendo-react-common";
 import { getDetailExpandableOptions as ga, getGroupExpandableOptions as ba, getSelectionOptions as ha, tableKeyboardNavigationTools as de, Pager as Ca, tableKeyboardNavigationBodyAttributes as wa, tableKeyboardNavigationScopeAttributes as bt } from "@progress/kendo-react-data-tools";
 import { GridHierarchyCell as ya } from "./cells/hierarchycell/GridHierarchyCell.mjs";
 import { Header as Ra } from "./header/Header.mjs";
@@ -14,56 +14,57 @@ import { HeaderRow as Ea } from "./header/HeaderRow.mjs";
 import { FilterRow as Ga } from "./header/FilterRow.mjs";
 import { GroupPanel as va } from "./header/GroupPanel.mjs";
 import { Footer as Sa } from "./footer/Footer.mjs";
-import { isRowReorderEnabled as ka, getRowSpanOptions as ht, mapColumns as Ct, getColumnWidth as ye, isSorted as xa, flatData as Ia, autoGenerateColumns as Ha, clientColumn as Na, getColSpan as Ma, readColumns as Ta, getFlatColumnsState as Pa, getColumnState as Re } from "./utils/index.mjs";
-import { normalizeAutoProcessData as Da, processData as Wa } from "./utils/dataProcessing.mjs";
+import { isRowReorderEnabled as ka, getRowSpanOptions as ht, mapColumns as Ct, getColumnWidth as we, isSorted as xa, flatData as Ia, autoGenerateColumns as Ha, clientColumn as Na, getColSpan as Ma, readColumns as Ta, getFlatColumnsState as Pa, getColumnState as ye } from "./utils/index.mjs";
+import { getScrollableOverlaySettings as Da } from "./utils/proxiedScrollOverlay.mjs";
+import { normalizeAutoProcessData as Ba, processData as Wa } from "./utils/dataProcessing.mjs";
 import { orderBy as wt } from "@progress/kendo-data-query";
-import { GridGroupCell as Ba } from "./cells/groupcell/GridGroupCell.mjs";
+import { GridGroupCell as La } from "./cells/groupcell/GridGroupCell.mjs";
 import { GridHeaderGroupSpacerCell as yt } from "./header/GridHeaderGroupSpacerCell.mjs";
-import { GridHeaderSelectionCell as La } from "./header/GridHeaderSelectionCell.mjs";
+import { GridHeaderSelectionCell as za } from "./header/GridHeaderSelectionCell.mjs";
 import { GridNoRecords as Rt } from "./components/noRecords/GridNoRecords.mjs";
 import { operators as Et } from "./filterCommon.mjs";
-import { FooterRow as za } from "./footer/FooterRow.mjs";
-import { normalize as Fa } from "./paging/GridPagerSettings.mjs";
-import { packageMetadata as Ee } from "./package-metadata.mjs";
-import { GridDetailCell as Ka } from "./cells/detailcell/GridDetailCell.mjs";
+import { FooterRow as Fa } from "./footer/FooterRow.mjs";
+import { normalize as Ka } from "./paging/GridPagerSettings.mjs";
+import { packageMetadata as Re } from "./package-metadata.mjs";
+import { GridDetailCell as Aa } from "./cells/detailcell/GridDetailCell.mjs";
 import { GridNoRecordsContainer as Gt } from "./components/noRecords/GridNoRecordsContainer.mjs";
 import { GridClientWrapper as vt } from "./GridClientWrapper.mjs";
-import { GridColGroup as Aa } from "./components/colGroup/GridColGroup.mjs";
-import { GridTable as Oa } from "./components/table/GridTable.mjs";
+import { GridColGroup as Oa } from "./components/colGroup/GridColGroup.mjs";
+import { GridTable as ja } from "./components/table/GridTable.mjs";
 import { GridDropClue as St } from "./components/GridDropClue.mjs";
 import { GridDragClue as kt } from "./components/GridDragClue.mjs";
 import { GridTableBody as xt } from "./components/table/GridTableBody.mjs";
-import { PagerContainer as ja } from "./components/PagerContainer.mjs";
-import { GridTableScrollable as Va } from "./components/table/GridTableScrollable.mjs";
+import { PagerContainer as Va } from "./components/PagerContainer.mjs";
+import { GridTableScrollable as _a } from "./components/table/GridTableScrollable.mjs";
 import { GridElementContainer as It } from "./components/GridElementContainer.mjs";
-import { GridContainerElementContainer as _a } from "./components/GridContainerElementContainer.mjs";
-import { VirtualScrollHeightContainer as $a } from "./components/VirtualScrollHeightContainer.mjs";
-import { VirtualScrollOverlay as Za } from "./components/VirtualScrollOverlay.mjs";
-import { gridAriaLabel as se, messages as Ge, groupColumnTitle as Ht } from "./messages/index.mjs";
-import { GridReorderableRowsContainer as Ua } from "./components/GridDraggableRowsContainer.mjs";
-import { GridRowReorderCell as Ya } from "./cells/rowreordercell/GridRowReorderCell.mjs";
-import { GridHeaderRowReorderCell as qa } from "./header/client/GridHeaderRowReorderCell.mjs";
+import { GridContainerElementContainer as $a } from "./components/GridContainerElementContainer.mjs";
+import { VirtualScrollHeightContainer as Za } from "./components/VirtualScrollHeightContainer.mjs";
+import { VirtualScrollOverlay as Ua } from "./components/VirtualScrollOverlay.mjs";
+import { gridAriaLabel as se, messages as Ee, groupColumnTitle as Ht } from "./messages/index.mjs";
+import { GridReorderableRowsContainer as Ya } from "./components/GridDraggableRowsContainer.mjs";
+import { GridRowReorderCell as qa } from "./cells/rowreordercell/GridRowReorderCell.mjs";
+import { GridHeaderRowReorderCell as Ja } from "./header/client/GridHeaderRowReorderCell.mjs";
 import { GridLoader as Nt } from "./components/GridLoader.mjs";
-import { gridPremiumFeatures as Ja } from "./utils/premium.mjs";
-import { LocalizationService as Qa, IntlService as Xa } from "@progress/kendo-react-intl";
-import { getVirtualCellsToRender as pa } from "./utils/virtualColumns.mjs";
-import { GridEditDialog as el } from "./components/GridEditDialog.mjs";
-import { GridSelectionCellServer as tl } from "./cells/selectioncell/GridSelectionCellServer.mjs";
-import { GridSelectionCell as al } from "./cells/selectioncell/GridSelectionCell.mjs";
-import { GridHierarchyCellServer as ll } from "./cells/hierarchycell/GridHierarchyCellServer.mjs";
-import { GridRowReorderCellServer as nl } from "./cells/rowreordercell/GridRowReorderCellServer.mjs";
-import { GridDetailCellServer as il } from "./cells/detailcell/GridDetailCellServer.mjs";
-import { GridGroupCellServer as ol } from "./cells/groupcell/GridGroupCellServer.mjs";
-import { GridPinCell as rl } from "./cells/pincell/GridPinCell.mjs";
-import { GridPinCellServer as dl } from "./cells/pincell/GridPinCellServer.mjs";
-import { GridHeaderPinCell as sl } from "./header/client/GridHeaderPinCell.mjs";
-import { StackedModeColGroup as ul } from "./stacked/StackedModeComponents.mjs";
-import { GridRowRenderer as ml } from "./rows/GridRowRenderer.mjs";
-import { GridDetailRowRenderer as cl } from "./rows/GridDetailRowRenderer.mjs";
+import { gridPremiumFeatures as Qa } from "./utils/premium.mjs";
+import { LocalizationService as Xa, IntlService as pa } from "@progress/kendo-react-intl";
+import { getVirtualCellsToRender as el } from "./utils/virtualColumns.mjs";
+import { GridEditDialog as tl } from "./components/GridEditDialog.mjs";
+import { GridSelectionCellServer as al } from "./cells/selectioncell/GridSelectionCellServer.mjs";
+import { GridSelectionCell as ll } from "./cells/selectioncell/GridSelectionCell.mjs";
+import { GridHierarchyCellServer as nl } from "./cells/hierarchycell/GridHierarchyCellServer.mjs";
+import { GridRowReorderCellServer as il } from "./cells/rowreordercell/GridRowReorderCellServer.mjs";
+import { GridDetailCellServer as ol } from "./cells/detailcell/GridDetailCellServer.mjs";
+import { GridGroupCellServer as rl } from "./cells/groupcell/GridGroupCellServer.mjs";
+import { GridPinCell as dl } from "./cells/pincell/GridPinCell.mjs";
+import { GridPinCellServer as sl } from "./cells/pincell/GridPinCellServer.mjs";
+import { GridHeaderPinCell as ul } from "./header/client/GridHeaderPinCell.mjs";
+import { StackedModeColGroup as ml } from "./stacked/StackedModeComponents.mjs";
+import { GridRowRenderer as cl } from "./rows/GridRowRenderer.mjs";
+import { GridDetailRowRenderer as fl } from "./rows/GridDetailRowRenderer.mjs";
 import { StickyGroupTable as Mt } from "./components/StickyGroupTable.mjs";
 import { PinnedRowsTable as Tt } from "./components/PinnedRowsTable.mjs";
-import { getRowContents as fl } from "./getRowContents.mjs";
-const gl = l.forwardRef((e, Pt) => {
+import { getRowContents as gl } from "./getRowContents.mjs";
+const bl = l.forwardRef((e, Pt) => {
   var Qe, Xe, pe, et, tt, at, lt, nt, it, ot, rt, dt, st, ut, mt, ct;
   const D = e.id + "-role-element-id", N = e.navigatable ? D : "";
   let w = e.columnsState || [];
@@ -80,12 +81,12 @@ const gl = l.forwardRef((e, Pt) => {
       u
     );
     return { flattedData: f, resolvedGroupsCount: x };
-  }, Wt = (t) => {
+  }, Bt = (t) => {
     const i = t.filter(
       (o) => o && o.type && o.type.displayName === "KendoReactGridColumn"
     );
     return Ta(i, w, { prevId: 0, idPrefix: N });
-  }, Bt = () => {
+  }, Wt = () => {
     const t = [], i = (o, r) => o == null ? void 0 : o.forEach((a) => {
       const d = a.hidden || r;
       t.push({
@@ -95,7 +96,7 @@ const gl = l.forwardRef((e, Pt) => {
     });
     return i(w, !1), t;
   }, Lt = (t) => {
-    const i = Bt();
+    const i = Wt();
     return [
       t.filter((o) => {
         var r;
@@ -107,7 +108,7 @@ const gl = l.forwardRef((e, Pt) => {
       })
     ];
   }, zt = (t, i) => {
-    m = Wt(t), m.filter((a) => !a.hidden).length === 0 && (m = Ha(
+    m = Bt(t), m.filter((a) => !a.hidden).length === 0 && (m = Ha(
       k,
       e.group,
       {
@@ -128,7 +129,7 @@ const gl = l.forwardRef((e, Pt) => {
         const u = { ...a };
         return u.children = (d = r.children) == null ? void 0 : d.map(o), u;
       }
-      return Re(r);
+      return ye(r);
     };
     w = t.filter((r) => r.parentIndex === -1).map(o);
   }, Kt = (t, i) => {
@@ -140,11 +141,11 @@ const gl = l.forwardRef((e, Pt) => {
       });
     }
     t.filter((n) => n.columnType === "checkbox").forEach((n) => {
-      n.width = n.width || "50px", n.defaultCell = e.isClient ? al : tl, n.defaultHeaderCell = La, n._type = "edit", n.sortable = !1, n.filterable = !1, n.editable = !1;
+      n.width = n.width || "50px", n.defaultCell = e.isClient ? ll : al, n.defaultHeaderCell = za, n._type = "edit", n.sortable = !1, n.filterable = !1, n.editable = !1;
     }), L !== void 0 && t.filter((n) => n.columnType === "reorder").forEach((n) => {
-      n.width = n.width || "50px", n.defaultCell = e.isClient ? Ya : nl, n.defaultHeaderCell = qa, n.sortable = !1, n.filterable = !1, n.editable = !1;
+      n.width = n.width || "50px", n.defaultCell = e.isClient ? qa : il, n.defaultHeaderCell = Ja, n.sortable = !1, n.filterable = !1, n.editable = !1;
     }), e.pinnable && t.filter((n) => n.columnType === "pin").forEach((n) => {
-      n.width = n.width || "48px", n.defaultCell = e.isClient ? rl : dl, n.defaultHeaderCell = sl, n.sortable = !1, n.filterable = !1, n.editable = !1;
+      n.width = n.width || "48px", n.defaultCell = e.isClient ? dl : sl, n.defaultHeaderCell = ul, n.sortable = !1, n.filterable = !1, n.editable = !1;
     });
     const r = Pa(w);
     Ft(t, r);
@@ -174,38 +175,38 @@ const gl = l.forwardRef((e, Pt) => {
         ...a,
         _type: "expand",
         id: de.generateNavigatableId(`${d++}`, "expand", "column"),
-        defaultCell: e.isClient ? ya : ll,
+        defaultCell: e.isClient ? ya : nl,
         field: T.column,
         headerClassName: b(c.hierarchyCell({}))
       };
-      t.unshift(n), w.unshift(r.find((g) => g.id === n.id) || Re(n));
+      t.unshift(n), w.unshift(r.find((g) => g.id === n.id) || ye(n));
     }
-    const u = E === "compact", f = E === "singleColumn", x = E === "multipleColumns", A = u || f ? Math.min(i, 1) : i, O = (n, g) => {
-      var v, s, V, re;
+    const u = R === "compact", f = R === "singleColumn", x = R === "multipleColumns", A = u || f ? Math.min(i, 1) : i, O = (n, g) => {
+      var G, s, V, re;
       if (n === "singleColumn")
-        return W.toLanguageString(Ht, Ge[Ht]);
+        return B.toLanguageString(Ht, Ee[Ht]);
       if (n !== "multipleColumns")
         return a.title;
-      const j = (s = (v = e.group) == null ? void 0 : v[g]) == null ? void 0 : s.field, I = t.find((ft) => ft.field === j && ft.declarationIndex >= 0);
+      const j = (s = (G = e.group) == null ? void 0 : G[g]) == null ? void 0 : s.field, I = t.find((ft) => ft.field === j && ft.declarationIndex >= 0);
       return (re = (V = I == null ? void 0 : I.title) != null ? V : j) != null ? re : a.title;
-    }, G = typeof e.groupable == "object" ? e.groupable.groupColumn : void 0;
+    }, E = typeof e.groupable == "object" ? e.groupable.groupColumn : void 0;
     for (let n = A - 1; n >= 0; n--) {
       const g = f || x;
       let j = a.width;
       u ? j = "0px" : g && (j = void 0);
       const I = (ie = e.group) == null ? void 0 : ie[n];
-      let v;
-      G !== void 0 && (typeof G == "function" ? I !== void 0 && (v = G(I)) : v = G);
-      const s = g ? v : void 0, V = {
+      let G;
+      E !== void 0 && (typeof E == "function" ? I !== void 0 && (G = E(I)) : G = E);
+      const s = g ? G : void 0, V = {
         ...a,
         isAccessible: g,
         isGroupColumn: g,
-        defaultCell: e.isClient ? Ba : ol,
+        defaultCell: e.isClient ? La : rl,
         defaultHeaderCell: g ? void 0 : yt,
         id: de.generateNavigatableId(`${d++}`, "group", "column"),
         field: "value",
         groupField: I == null ? void 0 : I.field,
-        title: (q = s == null ? void 0 : s.title) != null ? q : O(E, n),
+        title: (q = s == null ? void 0 : s.title) != null ? q : O(R, n),
         width: (P = s == null ? void 0 : s.width) != null ? P : j,
         locked: (oe = s == null ? void 0 : s.locked) != null ? oe : e.lockGroups,
         sortable: !1,
@@ -229,23 +230,23 @@ const gl = l.forwardRef((e, Pt) => {
         ...f ? { disableColumnMenu: !0 } : (s == null ? void 0 : s.columnMenu) !== void 0 && {
           columnMenu: s.columnMenu
         },
-        ...(v == null ? void 0 : v.cells) !== void 0 && {
+        ...(G == null ? void 0 : G.cells) !== void 0 && {
           cells: {
             group: {
-              groupHeader: v.cells.groupHeader,
-              groupFooter: v.cells.groupFooter
+              groupHeader: G.cells.groupHeader,
+              groupFooter: G.cells.groupFooter
             }
           }
         }
       };
       t.unshift(V), w.unshift(
-        r.find((re) => re.id === V.id) || Re(V)
+        r.find((re) => re.id === V.id) || ye(V)
       );
     }
     t.slice(d).forEach((n) => {
       n.parentIndex >= 0 && (n.parentIndex += d), n.rowSpannable = n.rowSpannable !== void 0 ? ht(n.rowSpannable) : He;
     });
-  }, ve = () => e.isClient ? m : Q, Se = (t) => {
+  }, Ge = () => e.isClient ? m : Q, ve = (t) => {
     const i = [];
     let o = null, r = 0;
     if (S.forEach((a, d) => {
@@ -263,7 +264,7 @@ const gl = l.forwardRef((e, Pt) => {
       }, i.push(o);
     }), e.columnVirtualization) {
       const a = Ot.current || 0, d = jt.current || parseFloat(((e.style || {}).width || "").toString());
-      return pa({
+      return el({
         cellModels: i,
         columns: S,
         tableViewPortWidth: d,
@@ -273,7 +274,7 @@ const gl = l.forwardRef((e, Pt) => {
     return i;
   }, At = () => {
     const { pageable: t, take: i, pageSize: o } = e;
-    if (!y)
+    if (!v)
       return 0;
     if (!t) {
       if (i)
@@ -285,7 +286,7 @@ const gl = l.forwardRef((e, Pt) => {
     return a && r ? Math.ceil(a / r * 1.5) : 0;
   };
   let h = [], ue, m = [], J = [], Q = [], X = [[]];
-  const Ot = e.scrollLeftRef || { current: 0 }, jt = e.widthRef || { current: 0 }, Vt = e.containerHeightRef || { current: 0 }, _t = e.minRowHeightRef || { current: 0 }, W = e.localization || new Qa(e.language), $t = e.intl || new Xa((Qe = e.locale) != null ? Qe : "en"), B = e.unstyled, c = B && B.uGrid ? B.uGrid : ua, L = ka(e.rowReorderable), _ = typeof e.scrollable == "object" ? e.scrollable.mode : e.scrollable, me = typeof e.scrollable == "object" && e.scrollable.scrollbar === "proxied", y = _ === "virtual" || _ === void 0 && e.isClient && ma(Ee) || !1, R = e.dataLayoutMode === "stacked", E = typeof e.groupable == "object" && e.groupable.displayMode || "default", M = E === "compact" ? 0 : ((Xe = e.group) == null ? void 0 : Xe.length) || 0, ke = ca(Ee), z = Da(e.autoProcessData);
+  const Ot = e.scrollLeftRef || { current: 0 }, jt = e.widthRef || { current: 0 }, Vt = e.containerHeightRef || { current: 0 }, _t = e.minRowHeightRef || { current: 0 }, B = e.localization || new Xa(e.language), $t = e.intl || new pa((Qe = e.locale) != null ? Qe : "en"), W = e.unstyled, c = W && W.uGrid ? W.uGrid : ua, L = ka(e.rowReorderable), _ = typeof e.scrollable == "object" ? e.scrollable.mode : e.scrollable, { overlayScrollbar: Se } = Da(e.scrollable), v = _ === "virtual" || _ === void 0 && e.isClient && ma(Re) || !1, y = e.dataLayoutMode === "stacked", R = typeof e.groupable == "object" && e.groupable.displayMode || "default", M = R === "compact" ? 0 : ((Xe = e.group) == null ? void 0 : Xe.length) || 0, ke = ca(Re), z = Ba(e.autoProcessData);
   let k, H;
   if (Array.isArray(e.data) ? (k = e.data, H = (pe = e.total) != null ? pe : k.length) : (k = ((et = e.data) == null ? void 0 : et.data) || [], H = (lt = (at = e.total) != null ? at : (tt = e.data) == null ? void 0 : tt.total) != null ? lt : k.length), z) {
     const t = Wa(k, {
@@ -298,7 +299,7 @@ const gl = l.forwardRef((e, Pt) => {
       take: e.take,
       skip: e.skip,
       total: e.total,
-      isVirtualScroll: y,
+      isVirtualScroll: v,
       includePaging: !0
     });
     k = t.data, H = t.total;
@@ -315,37 +316,37 @@ const gl = l.forwardRef((e, Pt) => {
     e.dataItemKey
   );
   h = Qt;
-  const ce = At(), ae = ((it = e.virtualSkipRef) == null ? void 0 : it.current) || 0;
+  const me = At(), ae = ((it = e.virtualSkipRef) == null ? void 0 : it.current) || 0;
   let xe = H;
-  if (y) {
+  if (v) {
     let t = e.skip || 0;
     if ((te || e.pageable) && (t = ae, xe = h.length), p || te || e.pageable)
-      if (ce === 0) {
+      if (me === 0) {
         const i = Math.min(e.take || e.pageSize || 20, h.length);
         ue = h.slice(t, t + i);
       } else
-        ue = h.slice(t, t + ce);
+        ue = h.slice(t, t + me);
   }
   const Ie = ha(e.selectable), He = ht(e.rowSpannable), Xt = Ie && Ie.drag ? "none" : void 0, le = l.useMemo(() => l.Children.toArray(e.children), [e.children]), pt = Math.max(Jt, (rt = (ot = e.group) == null ? void 0 : ot.length) != null ? rt : 0);
   zt(le, pt);
-  const fe = l.useMemo(() => {
-    const t = Ja(e, m);
+  const ce = l.useMemo(() => {
+    const t = Qa(e, m);
     return {
       premium: t.length > 0,
       features: t
     };
-  }, [e, m]), Ne = l.useMemo(() => fe.premium ? !fa(Ee, { component: "Grid", features: fe.features }) : !1, [fe.premium]), Me = le.map((t) => t && t.type && t.type.displayName === "KendoReactGridToolbar" ? l.cloneElement(t, { ...t.props, _ariaControls: D, ariaLabel: "Top toolbar" }) : null), ne = le.filter((t) => t && t.type && t.type.displayName === "KendoReactGridNoRecords"), Te = le.filter(
+  }, [e, m]), Ne = l.useMemo(() => ce.premium ? !fa(Re, { component: "Grid", features: ce.features }) : !1, [ce.premium]), Me = le.map((t) => t && t.type && t.type.displayName === "KendoReactGridToolbar" ? l.cloneElement(t, { ...t.props, _ariaControls: D, ariaLabel: "Top toolbar" }) : null), ne = le.filter((t) => t && t.type && t.type.displayName === "KendoReactGridNoRecords"), Te = le.filter(
     (t) => t && t.type && t.type.displayName === "KendoReactGridStatusBar"
-  ), S = m.filter((t) => t.children.length === 0), $ = E === "compact", Pe = (t) => $ && t.children.length === 0 && t.defaultHeaderCell === yt, Z = $ ? m.filter((t) => !Pe(t)) : m, ea = $ ? Q.filter((t) => !Pe(t)) : Q, De = $ ? Ct(Z, w) : X, F = Z.filter((t) => t.children.length === 0), ta = ($ || E === "singleColumn" || E === "multipleColumns") && F.some((t) => t.columnType === "checkbox"), We = ee && !R && /* @__PURE__ */ l.createElement(
+  ), S = m.filter((t) => t.children.length === 0), $ = R === "compact", Pe = (t) => $ && t.children.length === 0 && t.defaultHeaderCell === yt, Z = $ ? m.filter((t) => !Pe(t)) : m, ea = $ ? Q.filter((t) => !Pe(t)) : Q, De = $ ? Ct(Z, w) : X, F = Z.filter((t) => t.children.length === 0), ta = ($ || R === "singleColumn" || R === "multipleColumns") && F.some((t) => t.columnType === "checkbox"), Be = ee && !y && /* @__PURE__ */ l.createElement(
     va,
     {
-      columns: ve(),
+      columns: Ge(),
       hiddenColumns: J,
       group: e.group || [],
       ariaControls: D,
-      mode: E
+      mode: R
     }
-  ), Be = R ? null : /* @__PURE__ */ l.createElement(
+  ), We = y ? null : /* @__PURE__ */ l.createElement(
     Ra,
     {
       size: C,
@@ -367,11 +368,11 @@ const gl = l.forwardRef((e, Pt) => {
           columns: Z,
           columnsMap: De,
           navigatable: !!e.navigatable,
-          localization: W,
-          unstyled: B,
+          localization: B,
+          unstyled: W,
           columnsState: w,
           headerSelectionValue: !!(e.select && h.filter((t) => t.rowType === "data").every(
-            (t) => e.select && e.dataItemKey && we(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[we(e.dataItemKey)(t.dataItem)] : void 0
+            (t) => e.select && e.dataItemKey && Ce(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[Ce(e.dataItemKey)(t.dataItem)] : void 0
           ))
         }
       ),
@@ -386,41 +387,41 @@ const gl = l.forwardRef((e, Pt) => {
           sort: e.sort,
           navigatable: !!e.navigatable,
           ariaRowIndex: De.length + 1,
-          localization: W
+          localization: B
         }
       ) || void 0,
-      cols: F.map((t, i) => /* @__PURE__ */ l.createElement("col", { key: i.toString(), width: ye(t) }))
+      cols: F.map((t, i) => /* @__PURE__ */ l.createElement("col", { key: i.toString(), width: we(t) }))
     }
   ), Le = S.findIndex((t) => typeof t.colSpan == "function") > -1;
   let ze;
-  Le || (ze = Se(null));
-  const ge = ((dt = e.editable) == null ? void 0 : dt.mode) === "dialog", aa = (st = e.editable) == null ? void 0 : st.enabled, Fe = (mt = (ut = e.editZoneRef) == null ? void 0 : ut.current) != null ? mt : "body", la = Fe === "pinned" ? void 0 : e.edit, Ke = Fe === "body" ? void 0 : e.edit, U = {
+  Le || (ze = ve(null));
+  const fe = ((dt = e.editable) == null ? void 0 : dt.mode) === "dialog", aa = (st = e.editable) == null ? void 0 : st.enabled, Fe = (mt = (ut = e.editZoneRef) == null ? void 0 : ut.current) != null ? mt : "body", la = Fe === "pinned" ? void 0 : e.edit, Ke = Fe === "body" ? void 0 : e.edit, U = {
     leafColumns: S,
     renderedColumnsCount: F.length,
     columnsState: w,
     cellsToRender: ze,
-    getCellsToRender: Se,
+    getCellsToRender: ve,
     hasDynamicColSpan: Le,
     idPrefix: N,
     gridClasses: c,
-    unstyled: B,
-    localization: W,
+    unstyled: W,
+    localization: B,
     intl: $t,
     cells: e.cells,
     isRowReorderable: L,
     sort: e.sort,
     editable: e.editable,
     isClient: e.isClient,
-    isEditDialog: ge,
+    isEditDialog: fe,
     dataItemKey: e.dataItemKey,
     select: e.select,
     highlight: e.highlight,
     hiddenColumns: J,
-    groupingMode: E,
+    groupingMode: R,
     hasCheckboxColumn: ta
   }, na = 0;
-  let be = null;
-  const Ae = (t) => t >= h.length - na, he = [], Oe = !h.length, je = l.useMemo(() => {
+  let ge = null;
+  const Ae = (t) => t >= h.length - na, be = [], Oe = !h.length, je = l.useMemo(() => {
     var i;
     const t = e.pinnedTopRows || [];
     return z && ((i = e.sort) != null && i.length) ? wt([...t], e.sort) : t;
@@ -438,7 +439,7 @@ const gl = l.forwardRef((e, Pt) => {
     const t = X.length + (e.filterable ? 1 : 0) + 1;
     let i = e.skip || 0, o = -1, r = 0;
     const a = He.enabled ? {} : void 0;
-    if (y) {
+    if (v) {
       if (ae > 0) {
         const d = h.slice(0, ae).filter((u) => u.rowType === "data").length;
         o += d, i += ae;
@@ -448,13 +449,13 @@ const gl = l.forwardRef((e, Pt) => {
     (ue || h).forEach((d, u) => {
       var q;
       d.rowType === "data" && o++;
-      const f = d.dataIndex % 2 !== 0, x = e.dataItemKey && we(e.dataItemKey)(d.dataItem), A = u + i, O = x || "ai" + A, G = fl(U, la, d, O, o, f, a), ie = d.rowType === "data" ? ra.has(d.dataItem) : !1;
-      if (Y = A + t + r, ge && aa && G.isInEdit && (be = d.dataItem), he.push(
+      const f = d.dataIndex % 2 !== 0, x = e.dataItemKey && Ce(e.dataItemKey)(d.dataItem), A = u + i, O = x || "ai" + A, E = gl(U, la, d, O, o, f, a), ie = d.rowType === "data" ? ra.has(d.dataItem) : !1;
+      if (Y = A + t + r, fe && aa && E.isInEdit && (ge = d.dataItem), be.push(
         /* @__PURE__ */ l.createElement(
-          ml,
+          cl,
           {
             key: O,
-            isStackedMode: R,
+            isStackedMode: y,
             item: d,
             rowId: O,
             dataIndex: o,
@@ -468,14 +469,14 @@ const gl = l.forwardRef((e, Pt) => {
             rows: e.rows,
             leafColumns: S,
             groupLevelCount: M,
-            groupingMode: E,
+            groupingMode: R,
             stackedLayoutSettings: e.stackedLayoutSettings,
             cells: e.cells,
             editMode: (q = e.editable) == null ? void 0 : q.mode,
-            isSelected: G.isSelected,
-            isHighlighted: G.isHighlighted,
-            isInEdit: G.isInEdit && !ge,
-            preparedCells: G.row,
+            isSelected: E.isSelected,
+            isHighlighted: E.isHighlighted,
+            isInEdit: E.isInEdit && !fe,
+            preparedCells: E.row,
             showDetailToggle: !!e.detail && !!T.enabled,
             isDetailExpanded: !!d.expanded,
             detailExpandField: T.column,
@@ -486,13 +487,13 @@ const gl = l.forwardRef((e, Pt) => {
         r++;
         const P = O + "_1";
         Y = A + t + r;
-        const oe = e.isClient ? Ka : il;
-        he.push(
+        const oe = e.isClient ? Aa : ol;
+        be.push(
           /* @__PURE__ */ l.createElement(
-            cl,
+            fl,
             {
               key: P,
-              isStackedMode: R,
+              isStackedMode: y,
               detailRowId: P,
               isHidden: Ae(u),
               detailRowHeight: e.detailRowHeight,
@@ -504,13 +505,13 @@ const gl = l.forwardRef((e, Pt) => {
               cells: e.cells,
               leafColumns: S,
               detailExpandableEnabled: !!T.enabled,
-              preparedCells: G.row,
+              preparedCells: E.row,
               DetailCell: oe,
               detail: e.detail,
               detailCellId: de.generateNavigatableId(`${P}-dcell`, N),
               detailHierarchyCellId: T.enabled ? de.generateNavigatableId(`${P}-dhcell`, N) : void 0,
               detailTrClassName: b(c.detailTr({ isAlt: f })),
-              unstyled: B
+              unstyled: W
             }
           )
         );
@@ -522,8 +523,8 @@ const gl = l.forwardRef((e, Pt) => {
     total: H,
     skip: e.skip || 0,
     take: (e.take !== void 0 ? e.take : e.pageSize) || 10,
-    ...Fa(e.pageable || {})
-  }, $e = /* @__PURE__ */ l.createElement(ja, null, e.pager ? /* @__PURE__ */ l.createElement(e.pager, { ..._e }) : /* @__PURE__ */ l.createElement(Ca, { className: b(c.pager({})), ..._e })), da = (t, i) => /* @__PURE__ */ l.createElement("col", { key: i.toString(), width: ye(t) }), Ze = (ct = e.cells) != null && ct.footerCell || m.some((t) => {
+    ...Ka(e.pageable || {})
+  }, $e = /* @__PURE__ */ l.createElement(Va, null, e.pager ? /* @__PURE__ */ l.createElement(e.pager, { ..._e }) : /* @__PURE__ */ l.createElement(Ca, { className: b(c.pager({})), ..._e })), da = (t, i) => /* @__PURE__ */ l.createElement("col", { key: i.toString(), width: we(t) }), Ze = (ct = e.cells) != null && ct.footerCell || m.some((t) => {
     var i;
     return !!((i = t.cells) != null && i.footerCell);
   }) ? /* @__PURE__ */ l.createElement(
@@ -532,7 +533,7 @@ const gl = l.forwardRef((e, Pt) => {
       size: C,
       staticHeaders: _ !== "none",
       row: /* @__PURE__ */ l.createElement(
-        za,
+        Fa,
         {
           cells: e.cells,
           idPrefix: N,
@@ -542,25 +543,25 @@ const gl = l.forwardRef((e, Pt) => {
       ),
       cols: S.map(da)
     }
-  ) : null, K = R ? /* @__PURE__ */ l.createElement(ul, { groupLevelCount: M }) : /* @__PURE__ */ l.createElement(Aa, null, F.map((t, i) => /* @__PURE__ */ l.createElement(
+  ) : null, K = y ? /* @__PURE__ */ l.createElement(ml, { groupLevelCount: M }) : /* @__PURE__ */ l.createElement(Oa, null, F.map((t, i) => /* @__PURE__ */ l.createElement(
     "col",
     {
       key: i.toString(),
       className: xa(t.field, e.sort) ? b(c.sorted({})) : void 0,
-      width: ye(t)
+      width: we(t)
     }
-  ))), Ue = e.reorderable || ee, { detail: Cl, cells: wl, rows: yl, ...sa } = e, Ye = /* @__PURE__ */ l.createElement(
+  ))), Ue = e.reorderable || ee, { detail: wl, cells: yl, rows: Rl, ...sa } = e, Ye = /* @__PURE__ */ l.createElement(
     "tbody",
     {
       role: "rowgroup",
       className: b(c.tbody({})),
       ...wa
     },
-    he
-  ), qe = be ? /* @__PURE__ */ l.createElement(el, { columns: S, customEditDialog: e.editDialog, dataItem: be }) : null;
-  let Ce = Ye;
-  L && (Ce = /* @__PURE__ */ l.createElement(
-    Ua,
+    be
+  ), qe = ge ? /* @__PURE__ */ l.createElement(tl, { columns: S, customEditDialog: e.editDialog, dataItem: ge }) : null;
+  let he = Ye;
+  L && (he = /* @__PURE__ */ l.createElement(
+    Ya,
     {
       unstyled: c,
       columns: m,
@@ -572,7 +573,7 @@ const gl = l.forwardRef((e, Pt) => {
     gridRef: Pt,
     innerGrid: e.innerGrid,
     gridProps: sa,
-    columnsRef: ve(),
+    columnsRef: Ge(),
     renderedColumnsRef: e.isClient ? Z : ea,
     hiddenColumnsRef: J,
     columnsMapRef: X,
@@ -581,8 +582,8 @@ const gl = l.forwardRef((e, Pt) => {
     id: D,
     virtualTotal: xe,
     isAllData: p,
-    virtualPageSize: ce,
-    isVirtualScroll: y,
+    virtualPageSize: me,
+    isVirtualScroll: v,
     detailExpandable: !!e.detail
   };
   return _ === "none" ? /* @__PURE__ */ l.createElement(vt, { ...Je }, /* @__PURE__ */ l.createElement(It, null, /* @__PURE__ */ l.createElement(
@@ -590,11 +591,11 @@ const gl = l.forwardRef((e, Pt) => {
     {
       id: e.id,
       style: e.style,
-      className: b(c.wrapper({ size: C, isStackedMode: R }), e.className),
+      className: b(c.wrapper({ size: C, isStackedMode: y }), e.className),
       ...bt
     },
     Me,
-    We,
+    Be,
     /* @__PURE__ */ l.createElement(
       "div",
       {
@@ -603,17 +604,17 @@ const gl = l.forwardRef((e, Pt) => {
         "aria-colcount": S.length,
         "aria-rowcount": H,
         id: D,
-        "aria-label": W.toLanguageString(se, Ge[se])
+        "aria-label": B.toLanguageString(se, Ee[se])
       },
       /* @__PURE__ */ l.createElement(
-        Oa,
+        ja,
         {
           selectable: e.selectable,
           tableClassName: b(c.table({ size: C }))
         },
         K,
-        Be,
-        /* @__PURE__ */ l.createElement(xt, { rowReorderable: L }, Ce),
+        We,
+        /* @__PURE__ */ l.createElement(xt, { rowReorderable: L }, he),
         Ze
       )
     ),
@@ -627,15 +628,15 @@ const gl = l.forwardRef((e, Pt) => {
       className: b(
         c.wrapper({
           size: C,
-          virtual: y,
-          isStackedMode: R
+          virtual: v,
+          isStackedMode: y
         }),
         e.className
       ),
       ...bt
     },
     Me,
-    We,
+    Be,
     /* @__PURE__ */ l.createElement(
       "div",
       {
@@ -644,9 +645,9 @@ const gl = l.forwardRef((e, Pt) => {
         "aria-colcount": F.length,
         "aria-rowcount": H,
         id: D,
-        "aria-label": W.toLanguageString(se, Ge[se])
+        "aria-label": B.toLanguageString(se, Ee[se])
       },
-      Be,
+      We,
       e.isClient && ia && /* @__PURE__ */ l.createElement(
         Tt,
         {
@@ -656,7 +657,7 @@ const gl = l.forwardRef((e, Pt) => {
           edit: Ke,
           position: "top",
           pinnedItems: je,
-          isStackedMode: R,
+          isStackedMode: y,
           groupLevelCount: M,
           stackedLayoutSettings: e.stackedLayoutSettings,
           rowHeight: e.rowHeight,
@@ -671,26 +672,27 @@ const gl = l.forwardRef((e, Pt) => {
           colGroups: K,
           dataRowContext: U,
           position: "top",
-          isStackedMode: R,
+          isStackedMode: y,
           groupLevelCount: M,
           stackedLayoutSettings: e.stackedLayoutSettings,
           rowHeight: e.rowHeight,
           rows: e.rows
         }
-      ), /* @__PURE__ */ l.createElement(_a, null, /* @__PURE__ */ l.createElement(
+      ), /* @__PURE__ */ l.createElement($a, null, /* @__PURE__ */ l.createElement(
         "div",
         {
-          className: b(
-            c.content({}),
-            y && me && "k-grid-content--hide-scrollbar"
-          ),
-          style: {
-            ...y && me && { overflowY: "scroll", scrollbarWidth: "none" }
-          },
+          className: b(c.content({})),
+          style: v && Se ? {
+            overflowY: "hidden",
+            // Zero when the native scrollbar is an invisible macOS overlay (nothing
+            // to reserve for); the real measured width otherwise, so classic
+            // scrollbars don't cover the last column, matching AG Grid's default.
+            paddingInlineEnd: "var(--kendo-scrollbar-width, 0px)"
+          } : void 0,
           role: "presentation"
         },
         /* @__PURE__ */ l.createElement("div", { className: b(c.tableWrap({})), role: "presentation" }, /* @__PURE__ */ l.createElement(
-          Va,
+          _a,
           {
             selectable: e.selectable,
             tableClassName: b(
@@ -701,25 +703,25 @@ const gl = l.forwardRef((e, Pt) => {
             tableStyle: { userSelect: Xt }
           },
           K,
-          /* @__PURE__ */ l.createElement(xt, { rowReorderable: L }, Ce)
+          /* @__PURE__ */ l.createElement(xt, { rowReorderable: L }, he)
         ), Oe && /* @__PURE__ */ l.createElement(Gt, null, ne.length ? ne : /* @__PURE__ */ l.createElement(Rt, null))),
-        y && /* @__PURE__ */ l.createElement(
+        v && /* @__PURE__ */ l.createElement(
           "div",
           {
             className: b(c.heightContainer({})),
             "aria-colcount": F.length,
             role: "presentation"
           },
-          /* @__PURE__ */ l.createElement($a, { isVirtualScroll: y })
+          /* @__PURE__ */ l.createElement(Za, { isVirtualScroll: v })
         )
-      )), e.isClient && y && me && /* @__PURE__ */ l.createElement(Za, null), e.isClient && te && Yt && /* @__PURE__ */ l.createElement(
+      )), e.isClient && v && Se && /* @__PURE__ */ l.createElement(Ua, null), e.isClient && te && Yt && /* @__PURE__ */ l.createElement(
         Mt,
         {
           size: C,
           colGroups: K,
           dataRowContext: U,
           position: "bottom",
-          isStackedMode: R,
+          isStackedMode: y,
           groupLevelCount: M,
           stackedLayoutSettings: e.stackedLayoutSettings,
           rowHeight: e.rowHeight,
@@ -735,7 +737,7 @@ const gl = l.forwardRef((e, Pt) => {
           edit: Ke,
           position: "bottom",
           pinnedItems: Ve,
-          isStackedMode: R,
+          isStackedMode: y,
           groupLevelCount: M,
           stackedLayoutSettings: e.stackedLayoutSettings,
           rowHeight: e.rowHeight,
@@ -753,7 +755,7 @@ const gl = l.forwardRef((e, Pt) => {
     qe
   )));
 });
-gl.displayName = "KendoReactGridComponent";
+bl.displayName = "KendoReactGridComponent";
 export {
-  gl as GridComponent
+  bl as GridComponent
 };