@progress/kendo-react-grid 11.2.1-develop.1 → 11.3.0-develop.2

package/GridComponent.mjs

@@ -6,63 +6,63 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as a from "react";
-import { uGrid as Dt, hasValidLicense as Tt, validatePackage as Ht, getter as D, classNames as f, WatermarkOverlay as We } from "@progress/kendo-react-common";
+import { uGrid as Ht, hasValidLicense as Tt, validatePackage as Kt, getter as S, classNames as f, WatermarkOverlay as $e } from "@progress/kendo-react-common";
 import { process as Pt } from "@progress/kendo-data-query";
-import { combineFilters as Kt, getDetailExpandableOptions as At, getGroupExpandableOptions as Bt, getSelectionOptions as Ft, tableKeyboardNavigationTools as O, Pager as Lt, tableKeyboardNavigationBodyAttributes as Mt, tableKeyboardNavigationScopeAttributes as $e } from "@progress/kendo-react-data-tools";
-import { GridHierarchyCell as Ot } from "./cells/hierarchycell/GridHierarchyCell.mjs";
-import { GridEditCell as _t } from "./cells/editcell/GridEditCell.mjs";
-import { Header as zt } from "./header/Header.mjs";
-import { HeaderRow as Vt } from "./header/HeaderRow.mjs";
-import { FilterRow as Wt } from "./header/FilterRow.mjs";
-import { GroupPanel as $t } from "./header/GroupPanel.mjs";
-import { Footer as jt } from "./footer/Footer.mjs";
-import { isRowReorderEnabled as Ut, getRowSpanOptions as je, getColumnWidth as le, isSorted as Ue, flatData as qt, autoGenerateColumns as Jt, mapColumns as Qt, clientColumn as Xt, getFlatColumnsState as Yt, getColumnState as ae, getColSpan as Zt, resolveCells as pt, readColumns as el } from "./utils/index.mjs";
-import { GridCell as tl } from "./cells/datacell/GridCell.mjs";
-import { GridGroupCell as qe } from "./cells/groupcell/GridGroupCell.mjs";
-import { GridRow as ll } from "./rows/GridRow.mjs";
-import { GridHeaderSelectionCell as al } from "./header/GridHeaderSelectionCell.mjs";
-import { GridNoRecords as Je } from "./components/noRecords/GridNoRecords.mjs";
-import { operators as Qe } from "./filterCommon.mjs";
-import { FooterRow as rl } from "./footer/FooterRow.mjs";
-import { normalize as nl } from "./paging/GridPagerSettings.mjs";
-import { packageMetadata as Xe } from "./package-metadata.mjs";
-import { GridDetailCell as ol } from "./cells/detailcell/GridDetailCell.mjs";
-import { GridDetailHierarchyCell as il } from "./cells/GridDetailHierarchyCell.mjs";
-import { GridNoRecordsContainer as Ye } from "./components/noRecords/GridNoRecordsContainer.mjs";
-import { GridClientWrapper as Ze } from "./GridClientWrapper.mjs";
-import { GridColGroup as dl } from "./components/colGroup/GridColGroup.mjs";
-import { GridTable as cl } from "./components/table/GridTable.mjs";
-import { GridDropClue as pe } from "./components/GridDropClue.mjs";
-import { GridDragClue as et } from "./components/GridDragClue.mjs";
-import { GridTableBody as tt } from "./components/table/GridTableBody.mjs";
-import { PagerContainer as ml } from "./components/PagerContainer.mjs";
-import { GridTableScrollable as ul } from "./components/table/GridTableScrollable.mjs";
-import { GridElementContainer as lt } from "./components/GridElementContainer.mjs";
-import { GridContainerElementContainer as sl } from "./components/GridContainerElementContainer.mjs";
-import { VirtualScrollHeightContainer as fl } from "./components/VirtualScrollHeightContainer.mjs";
-import { gridAriaLabel as at, messages as gl } from "./messages/index.mjs";
-import { GridReorderableRowsContainer as bl } from "./components/GridDraggableRowsContainer.mjs";
-import { GridRowReorderCell as hl } from "./cells/rowreordercell/GridRowReorderCell.mjs";
+import { combineFilters as At, getDetailExpandableOptions as Bt, getGroupExpandableOptions as Ft, getSelectionOptions as Lt, tableKeyboardNavigationTools as O, Pager as Mt, tableKeyboardNavigationBodyAttributes as Ot, tableKeyboardNavigationScopeAttributes as je } from "@progress/kendo-react-data-tools";
+import { GridHierarchyCell as _t } from "./cells/hierarchycell/GridHierarchyCell.mjs";
+import { GridEditCell as zt } from "./cells/editcell/GridEditCell.mjs";
+import { Header as Vt } from "./header/Header.mjs";
+import { HeaderRow as Wt } from "./header/HeaderRow.mjs";
+import { FilterRow as $t } from "./header/FilterRow.mjs";
+import { GroupPanel as jt } from "./header/GroupPanel.mjs";
+import { Footer as Ut } from "./footer/Footer.mjs";
+import { isRowReorderEnabled as qt, getRowSpanOptions as Ue, getColumnWidth as le, isSorted as qe, flatData as Jt, autoGenerateColumns as Qt, mapColumns as Xt, clientColumn as Yt, getFlatColumnsState as Zt, getColumnState as ae, getColSpan as pt, resolveCells as el, readColumns as tl } from "./utils/index.mjs";
+import { GridCell as ll } from "./cells/datacell/GridCell.mjs";
+import { GridGroupCell as Je } from "./cells/groupcell/GridGroupCell.mjs";
+import { GridRow as al } from "./rows/GridRow.mjs";
+import { GridHeaderSelectionCell as rl } from "./header/GridHeaderSelectionCell.mjs";
+import { GridNoRecords as Qe } from "./components/noRecords/GridNoRecords.mjs";
+import { operators as Xe } from "./filterCommon.mjs";
+import { FooterRow as nl } from "./footer/FooterRow.mjs";
+import { normalize as ol } from "./paging/GridPagerSettings.mjs";
+import { packageMetadata as Ye } from "./package-metadata.mjs";
+import { GridDetailCell as il } from "./cells/detailcell/GridDetailCell.mjs";
+import { GridDetailHierarchyCell as dl } from "./cells/GridDetailHierarchyCell.mjs";
+import { GridNoRecordsContainer as Ze } from "./components/noRecords/GridNoRecordsContainer.mjs";
+import { GridClientWrapper as pe } from "./GridClientWrapper.mjs";
+import { GridColGroup as cl } from "./components/colGroup/GridColGroup.mjs";
+import { GridTable as ml } from "./components/table/GridTable.mjs";
+import { GridDropClue as et } from "./components/GridDropClue.mjs";
+import { GridDragClue as tt } from "./components/GridDragClue.mjs";
+import { GridTableBody as lt } from "./components/table/GridTableBody.mjs";
+import { PagerContainer as ul } from "./components/PagerContainer.mjs";
+import { GridTableScrollable as sl } from "./components/table/GridTableScrollable.mjs";
+import { GridElementContainer as at } from "./components/GridElementContainer.mjs";
+import { GridContainerElementContainer as fl } from "./components/GridContainerElementContainer.mjs";
+import { VirtualScrollHeightContainer as gl } from "./components/VirtualScrollHeightContainer.mjs";
+import { gridAriaLabel as rt, messages as bl } from "./messages/index.mjs";
+import { GridReorderableRowsContainer as hl } from "./components/GridDraggableRowsContainer.mjs";
+import { GridRowReorderCell as yl } from "./cells/rowreordercell/GridRowReorderCell.mjs";
 import { GridHeaderRowReorderCell as Cl } from "./header/client/GridHeaderRowReorderCell.mjs";
-import { GridLoader as rt } from "./components/GridLoader.mjs";
-import { gridPremiumFeatures as yl } from "./utils/premium.mjs";
-import { LocalizationService as wl, IntlService as El } from "@progress/kendo-react-intl";
-import { getVirtualCellsToRender as Sl } from "./utils/virtualColumns.mjs";
-import { GridEditDialog as Il } from "./components/GridEditDialog.mjs";
-import { GridCellServer as vl } from "./cells/datacell/GridCellServer.mjs";
-import { GridEditCellServer as Rl } from "./cells/editcell/GridEditCellServer.mjs";
-import { GridSelectionCellServer as Gl } from "./cells/selectioncell/GridSelectionCellServer.mjs";
-import { GridSelectionCell as xl } from "./cells/selectioncell/GridSelectionCell.mjs";
-import { GridHierarchyCellServer as kl } from "./cells/hierarchycell/GridHierarchyCellServer.mjs";
-import { GridRowReorderCellServer as Nl } from "./cells/rowreordercell/GridRowReorderCellServer.mjs";
-import { GridDetailCellServer as Dl } from "./cells/detailcell/GridDetailCellServer.mjs";
+import { GridLoader as nt } from "./components/GridLoader.mjs";
+import { gridPremiumFeatures as wl } from "./utils/premium.mjs";
+import { LocalizationService as El, IntlService as Il } from "@progress/kendo-react-intl";
+import { getVirtualCellsToRender as vl } from "./utils/virtualColumns.mjs";
+import { GridEditDialog as Sl } from "./components/GridEditDialog.mjs";
+import { GridCellServer as Rl } from "./cells/datacell/GridCellServer.mjs";
+import { GridEditCellServer as Gl } from "./cells/editcell/GridEditCellServer.mjs";
+import { GridSelectionCellServer as xl } from "./cells/selectioncell/GridSelectionCellServer.mjs";
+import { GridSelectionCell as kl } from "./cells/selectioncell/GridSelectionCell.mjs";
+import { GridHierarchyCellServer as Nl } from "./cells/hierarchycell/GridHierarchyCellServer.mjs";
+import { GridRowReorderCellServer as Dl } from "./cells/rowreordercell/GridRowReorderCellServer.mjs";
+import { GridDetailCellServer as Hl } from "./cells/detailcell/GridDetailCellServer.mjs";
 import { GridGroupCellServer as Tl } from "./cells/groupcell/GridGroupCellServer.mjs";
-const Hl = a.forwardRef((e, nt) => {
-  var De, Te, He, Pe, Ke, Ae, Be, Fe, Le, Me, Oe, _e;
-  const T = e.id + "-role-element-id", R = e.navigatable ? T : "";
-  let I = e.columnsState || [];
-  const ot = (t, o, n, d, i, l, c) => {
-    const u = [], N = qt(
+const Kl = a.forwardRef((e, ot) => {
+  var De, He, Te, Ke, Pe, Ae, Be, Fe, Le, Me, Oe, _e;
+  const T = e.id + "-role-element-id", x = e.navigatable ? T : "";
+  let R = e.columnsState || [];
+  const it = (t, o, n, d, i, l, c) => {
+    const u = [], h = Jt(
       u,
       t,
       o,
@@ -70,16 +70,16 @@ const Hl = a.forwardRef((e, nt) => {
       d !== void 0,
       i,
       l,
-      Et.defaultExpand,
+      It.defaultExpand,
       c
     );
-    return { flattedData: u, resolvedGroupsCount: N };
-  }, it = (t) => {
+    return { flattedData: u, resolvedGroupsCount: h };
+  }, dt = (t) => {
     const o = t.filter(
       (n) => n && n.type && n.type.displayName === "KendoReactGridColumn"
     );
-    return el(o, I, { prevId: 0, idPrefix: R });
-  }, dt = () => {
+    return tl(o, R, { prevId: 0, idPrefix: x });
+  }, ct = () => {
     const t = [], o = (n, d) => n == null ? void 0 : n.forEach((i) => {
       const l = i.hidden || d;
       t.push({
@@ -87,40 +87,40 @@ const Hl = a.forwardRef((e, nt) => {
         hidden: l
       }), o(i.children, l);
     });
-    return o(I, !1), t;
-  }, ct = (t) => {
-    const o = dt();
+    return o(R, !1), t;
+  }, mt = (t) => {
+    const o = ct();
     return t.filter((n) => {
       var d;
       return !n.hidden && !((d = o.find((i) => i.id === n.id)) != null && d.hidden);
     });
-  }, mt = (t, o) => {
-    m = it(t), m.filter((n) => !n.hidden).length === 0 && (m = Jt(
-      h,
+  }, ut = (t, o) => {
+    m = dt(t), m.filter((n) => !n.hidden).length === 0 && (m = Qt(
+      C,
       e.group,
       {
         column: P.column
       },
       {
         prevId: 0,
-        idPrefix: R
+        idPrefix: x
       }
-    )), st(m, o), m = ct(m), H = Qt(m, !0), ie = m.map(Xt);
-  }, ut = (t, o) => {
+    )), ft(m, o), m = mt(m), K = Xt(m, !0), ie = m.map(Yt);
+  }, st = (t, o) => {
     const n = (d) => {
       var l;
       const i = o.find((c) => c.id === d.id);
       return i ? (i.children = (l = d.children) == null ? void 0 : l.map(n), i) : ae(d);
     };
-    I = t.filter((d) => d.parentIndex === -1).map(n);
-  }, st = (t, o) => {
+    R = t.filter((d) => d.parentIndex === -1).map(n);
+  }, ft = (t, o) => {
     t.filter((l) => l.columnType === "checkbox").forEach((l) => {
-      l.width = l.width || "50px", l.defaultCell = e.isClient ? xl : Gl, l.defaultHeaderCell = al, l._type = "edit";
-    }), x !== void 0 && t.filter((l) => l.columnType === "reorder").forEach((l) => {
-      l.width = l.width || "50px", l.defaultCell = e.isClient ? hl : Nl, l.defaultHeaderCell = Cl, l.sortable = !1, l.filterable = !1, l.editable = !1;
+      l.width = l.width || "50px", l.defaultCell = e.isClient ? kl : xl, l.defaultHeaderCell = rl, l._type = "edit";
+    }), N !== void 0 && t.filter((l) => l.columnType === "reorder").forEach((l) => {
+      l.width = l.width || "50px", l.defaultCell = e.isClient ? yl : Dl, l.defaultHeaderCell = Cl, l.sortable = !1, l.filterable = !1, l.editable = !1;
     });
-    const n = Yt(I);
-    ut(t, n);
+    const n = Zt(R);
+    st(t, n);
     const d = {
       id: "",
       resizable: !0,
@@ -147,25 +147,25 @@ const Hl = a.forwardRef((e, nt) => {
         ...d,
         _type: "expand",
         id: O.generateNavigatableId(`${i++}`, "expand", "column"),
-        defaultCell: e.isClient ? Ot : kl,
+        defaultCell: e.isClient ? _t : Nl,
         field: P.column,
         headerClassName: f(s.hierarchyCell({}))
       };
-      t.unshift(l), I.unshift(n.find((c) => c.id === l.id) || ae(l));
+      t.unshift(l), R.unshift(n.find((c) => c.id === l.id) || ae(l));
     }
     for (let l = 0; l < o; l++) {
       const c = {
         ...d,
         isAccessible: !1,
-        defaultCell: e.isClient ? qe : Tl,
+        defaultCell: e.isClient ? Je : Tl,
         id: O.generateNavigatableId(`${i++}`, "group", "column"),
         field: "value",
         locked: e.lockGroups
       };
-      t.unshift(c), I.unshift(n.find((u) => u.id === c.id) || ae(c));
+      t.unshift(c), R.unshift(n.find((u) => u.id === c.id) || ae(c));
     }
     t.slice(i).forEach((l) => {
-      l.parentIndex >= 0 && (l.parentIndex += i), l.rowSpannable = l.rowSpannable !== void 0 ? je(l.rowSpannable) : se;
+      l.parentIndex >= 0 && (l.parentIndex += i), l.rowSpannable = l.rowSpannable !== void 0 ? Ue(l.rowSpannable) : se;
     });
   }, re = () => e.isClient ? m : ie, ne = (t) => {
     const o = [];
@@ -176,15 +176,15 @@ const Hl = a.forwardRef((e, nt) => {
         d--, n && (n.width += c);
         return;
       }
-      const u = Math.min(Zt(i, t), g.length - l);
+      const u = Math.min(pt(i, t), g.length - l);
       d = u - 1, n = {
         width: c,
         colSpan: u,
         columnIndex: l
       }, o.push(n);
     }), e.columnVirtualization) {
-      const i = gt.current || 0, l = bt.current || parseFloat(((e.style || {}).width || "").toString());
-      return Sl({
+      const i = bt.current || 0, l = ht.current || parseFloat(((e.style || {}).width || "").toString());
+      return vl({
         cellModels: o,
         columns: g,
         tableViewPortWidth: l,
@@ -192,9 +192,9 @@ const Hl = a.forwardRef((e, nt) => {
       });
     }
     return o;
-  }, ft = () => {
+  }, gt = () => {
     const { pageable: t, take: o, pageSize: n } = e;
-    if (!w)
+    if (!E)
       return 0;
     if (!t) {
       if (o)
@@ -202,69 +202,69 @@ const Hl = a.forwardRef((e, nt) => {
       if (n)
         return n;
     }
-    const d = e.rowHeight || Ct.current, i = ht.current;
+    const d = e.rowHeight || Ct.current, i = yt.current;
     return i && d ? Math.ceil(i / d * 1.5) : 0;
   };
-  let b = [], oe, m = [], ie = [], H = [[]];
-  const gt = e.scrollLeftRef || { current: 0 }, bt = e.widthRef || { current: 0 }, ht = e.containerHeightRef || { current: 0 }, Ct = e.minRowHeightRef || { current: 0 }, _ = e.localization || new wl(e.language), yt = e.intl || new El((De = e.locale) != null ? De : "en"), G = e.unstyled, s = G && G.uGrid ? G.uGrid : Dt, x = Ut(e.rowReorderable), w = e.scrollable === "virtual" || e.scrollable === void 0 && Tt(Xe), k = e.autoProcessData === !0 ? {
+  let b = [], oe, m = [], ie = [], K = [[]];
+  const bt = e.scrollLeftRef || { current: 0 }, ht = e.widthRef || { current: 0 }, yt = e.containerHeightRef || { current: 0 }, Ct = e.minRowHeightRef || { current: 0 }, _ = e.localization || new El(e.language), wt = e.intl || new Il((De = e.locale) != null ? De : "en"), k = e.unstyled, s = k && k.uGrid ? k.uGrid : Ht, N = qt(e.rowReorderable), E = e.scrollable === "virtual" || e.scrollable === void 0 && Tt(Ye), D = e.autoProcessData === !0 ? {
     group: !0,
     sort: !0,
     filter: !0,
     search: !0,
     page: !0
   } : e.autoProcessData;
-  let h, v;
-  if (Array.isArray(e.data) ? (h = e.data, v = (Te = e.total) != null ? Te : h.length) : (h = ((He = e.data) == null ? void 0 : He.data) || [], v = (Ae = (Ke = e.total) != null ? Ke : (Pe = e.data) == null ? void 0 : Pe.total) != null ? Ae : h.length), k) {
-    const t = k.page && !(w && !e.pageable), { data: o, total: n } = Pt(h, {
-      group: k.group ? e.group : void 0,
-      sort: k.sort ? e.sort : void 0,
-      filter: Kt(
-        k.filter ? e.filter : void 0,
-        k.search ? e.search : void 0
+  let C, G;
+  if (Array.isArray(e.data) ? (C = e.data, G = (He = e.total) != null ? He : C.length) : (C = ((Te = e.data) == null ? void 0 : Te.data) || [], G = (Ae = (Pe = e.total) != null ? Pe : (Ke = e.data) == null ? void 0 : Ke.total) != null ? Ae : C.length), D) {
+    const t = D.page && !(E && !e.pageable), { data: o, total: n } = Pt(C, {
+      group: D.group ? e.group : void 0,
+      sort: D.sort ? e.sort : void 0,
+      filter: At(
+        D.filter ? e.filter : void 0,
+        D.search ? e.search : void 0
       ),
       ...t ? {
         take: e.pageable ? e.take || 10 : e.take,
         skip: e.skip || 0
       } : {}
     });
-    h = o, v = (Be = e.total) != null ? Be : n;
+    C = o, G = (Be = e.total) != null ? Be : n;
   }
-  const z = h.length === v, { size: E = "medium" } = e, wt = typeof e.groupable == "object" && e.groupable.footer || "none", V = e.groupable === !0 || typeof e.groupable == "object" && e.groupable.enabled !== !1, P = At(!!e.detail), Et = Bt(
+  const z = C.length === G, { size: I = "medium" } = e, Et = typeof e.groupable == "object" && e.groupable.footer || "none", V = e.groupable === !0 || typeof e.groupable == "object" && e.groupable.enabled !== !1, P = Bt(!!e.detail), It = Ft(
     typeof e.groupable == "object" && e.groupable.enabled !== !1 ? e.groupable.expandable : e.groupable
-  ), de = !!((Fe = e.group) != null && Fe.length), { resolvedGroupsCount: St, flattedData: It } = ot(
-    h,
-    wt,
+  ), de = !!((Fe = e.group) != null && Fe.length), { resolvedGroupsCount: vt, flattedData: St } = it(
+    C,
+    Et,
     z ? 0 : e.skip || 0,
     e.group,
     e.detailExpand,
     e.groupExpand,
     e.dataItemKey
   );
-  b = It;
-  const ce = ft(), U = ((Le = e.virtualSkipRef) == null ? void 0 : Le.current) || 0;
-  let me = v;
-  if (w) {
+  b = St;
+  const ce = gt(), j = ((Le = e.virtualSkipRef) == null ? void 0 : Le.current) || 0;
+  let me = G;
+  if (E) {
     let t = e.skip || 0;
-    (de || e.pageable) && (t = U, me = b.length), (z || de || e.pageable) && (oe = b.slice(t, t + ce));
+    (de || e.pageable) && (t = j, me = b.length), (z || de || e.pageable) && (oe = b.slice(t, t + ce));
   }
-  const ue = Ft(e.selectable), se = je(e.rowSpannable), vt = ue && ue.drag ? "none" : void 0, W = a.useMemo(() => a.Children.toArray(e.children), [e.children]);
-  mt(W, St);
-  const q = a.useMemo(() => {
-    const t = yl(e, m);
+  const ue = Lt(e.selectable), se = Ue(e.rowSpannable), Rt = ue && ue.drag ? "none" : void 0, W = a.useMemo(() => a.Children.toArray(e.children), [e.children]);
+  ut(W, vt);
+  const U = a.useMemo(() => {
+    const t = wl(e, m);
     return {
       premium: t.length > 0,
       features: t
     };
-  }, [e, m]), fe = a.useMemo(() => q.premium ? !Ht(Xe, { component: "Grid", features: q.features }) : !1, [q.premium]), ge = W.map((t) => t && t.type && t.type.displayName === "KendoReactGridToolbar" ? a.cloneElement(t, { ...t.props, _ariaControls: T, ariaLabel: "Top toolbar" }) : null), $ = W.filter((t) => t && t.type && t.type.displayName === "KendoReactGridNoRecords"), be = W.filter(
+  }, [e, m]), fe = a.useMemo(() => U.premium ? !Kt(Ye, { component: "Grid", features: U.features }) : !1, [U.premium]), ge = W.map((t) => t && t.type && t.type.displayName === "KendoReactGridToolbar" ? a.cloneElement(t, { ...t.props, _ariaControls: T, ariaLabel: "Top toolbar" }) : null), $ = W.filter((t) => t && t.type && t.type.displayName === "KendoReactGridNoRecords"), be = W.filter(
     (t) => t && t.type && t.type.displayName === "KendoReactGridStatusBar"
-  ), g = m.filter((t) => t.children.length === 0), he = V && /* @__PURE__ */ a.createElement($t, { columns: re(), group: e.group || [], ariaControls: T }), Ce = /* @__PURE__ */ a.createElement(
-    zt,
+  ), g = m.filter((t) => t.children.length === 0), he = V && /* @__PURE__ */ a.createElement(jt, { columns: re(), group: e.group || [], ariaControls: T }), ye = /* @__PURE__ */ a.createElement(
+    Vt,
     {
-      size: E,
+      size: I,
       staticHeaders: e.scrollable !== "none",
       draggable: e.reorderable || V,
       headerRow: /* @__PURE__ */ a.createElement(
-        Vt,
+        Wt,
         {
           cells: e.cells,
           sort: e.sort,
@@ -273,73 +273,73 @@ const Hl = a.forwardRef((e, nt) => {
           groupable: V,
           filter: e.filter,
           filterable: e.filterable,
-          filterOperators: e.filterOperators || Qe,
+          filterOperators: e.filterOperators || Xe,
           columnMenu: e.columnMenu,
           columnMenuIcon: e.columnMenuIcon,
           columns: m,
-          columnsMap: H,
+          columnsMap: K,
           navigatable: !!e.navigatable,
           localization: _,
-          unstyled: G,
+          unstyled: k,
           headerSelectionValue: !!(e.select && b.filter((t) => t.rowType === "data").every(
-            (t) => e.select && e.dataItemKey && D(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[D(e.dataItemKey)(t.dataItem)] : void 0
+            (t) => e.select && e.dataItemKey && S(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[S(e.dataItemKey)(t.dataItem)] : void 0
           ))
         }
       ),
       filterRow: e.filterable && /* @__PURE__ */ a.createElement(
-        Wt,
+        $t,
         {
           cells: e.cells,
-          size: E,
+          size: I,
           columns: m,
           filter: e.filter,
-          filterOperators: e.filterOperators || Qe,
+          filterOperators: e.filterOperators || Xe,
           sort: e.sort,
           navigatable: !!e.navigatable,
-          ariaRowIndex: H.length + 1,
+          ariaRowIndex: K.length + 1,
           localization: _
         }
       ) || void 0,
       cols: g.map((t, o) => /* @__PURE__ */ a.createElement("col", { key: o.toString(), width: le(t) }))
     }
-  ), ye = g.findIndex((t) => typeof t.colSpan == "function") > -1;
-  let J;
-  ye || (J = ne(null));
-  const Q = ((Me = e.editable) == null ? void 0 : Me.mode) === "dialog", Rt = (Oe = e.editable) == null ? void 0 : Oe.enabled, Gt = (t, o, n, d, i) => {
+  ), Ce = g.findIndex((t) => typeof t.colSpan == "function") > -1;
+  let q;
+  Ce || (q = ne(null));
+  const J = ((Me = e.editable) == null ? void 0 : Me.mode) === "dialog", Gt = (Oe = e.editable) == null ? void 0 : Oe.enabled, xt = (t, o, n, d, i) => {
     let l = !1;
-    const c = e.select && e.dataItemKey && D(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[D(e.dataItemKey)(t.dataItem)] : void 0;
-    return ye && (J = ne(t.dataItem)), {
-      row: J.map(({ columnIndex: u, colSpan: N }) => {
-        var j, M, ze, Ve;
-        const r = g[u];
-        let C;
-        if ((j = r.rowSpannable) != null && j.enabled && t.rowType === "data" && r.field && i) {
-          const S = r.field ? (ze = (M = r.rowSpannable).valueGetter) == null ? void 0 : ze.call(M, t.dataItem, r.field) : null;
-          C = { value: S, count: 1 }, i[r.field] && ((Ve = i[r.field]) == null ? void 0 : Ve.value) === S && i[r.field] !== null ? (i[r.field].count++, C.count = null) : i[r.field] = C;
+    const c = e.select && e.dataItemKey && S(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[S(e.dataItemKey)(t.dataItem)] : void 0, u = e.highlight && e.dataItemKey && S(e.dataItemKey)(t.dataItem) !== void 0 ? e.highlight[S(e.dataItemKey)(t.dataItem)] : void 0;
+    return Ce && (q = ne(t.dataItem)), {
+      row: q.map(({ columnIndex: h, colSpan: H }) => {
+        var M, ze, Ve, We;
+        const r = g[h];
+        let w;
+        if ((M = r.rowSpannable) != null && M.enabled && t.rowType === "data" && r.field && i) {
+          const v = r.field ? (Ve = (ze = r.rowSpannable).valueGetter) == null ? void 0 : Ve.call(ze, t.dataItem, r.field) : null;
+          w = { value: v, count: 1 }, i[r.field] && ((We = i[r.field]) == null ? void 0 : We.value) === v && i[r.field] !== null ? (i[r.field].count++, w.count = null) : i[r.field] = w;
         }
-        const A = r.id ? r.id : u, y = f(s.contentSticky({ locked: r.locked }), r.className), p = r.left !== void 0 ? { left: r.left, right: r.right } : {};
+        const y = r.id ? r.id : h, Z = f(s.contentSticky({ locked: r.locked }), r.className), p = r.left !== void 0 ? { left: r.left, right: r.right } : {};
         let B = !1;
         if (r.editable && e.editable) {
-          const S = e.edit && e.dataItemKey ? e.edit[D(e.dataItemKey)(t.dataItem)] : void 0, te = typeof S == "boolean" ? S : Array.isArray(S) ? r.field && S.indexOf(r.field) > -1 : r.field !== void 0 && S === r.field;
-          te && r.columnType === "data" && (te === !0 || te === r.field) && (l = !0, Q || (B = !0));
+          const v = e.edit && e.dataItemKey ? e.edit[S(e.dataItemKey)(t.dataItem)] : void 0, te = typeof v == "boolean" ? v : Array.isArray(v) ? r.field && v.indexOf(r.field) > -1 : r.field !== void 0 && v === r.field;
+          te && r.columnType === "data" && (te === !0 || te === r.field) && (l = !0, J || (B = !0));
         }
-        const ee = r._type === "expand", F = {
+        const F = r._type === "expand", L = {
           locked: e.lockGroups,
           id: O.generateNavigatableId(
-            `${o}-${String(u)}`,
-            R,
-            ee || t.rowType === "groupHeader" || t.rowType === "groupFooter" || r.field === "value" ? "nodata" : "cell"
+            `${o}-${String(h)}`,
+            x,
+            F || t.rowType === "groupHeader" || t.rowType === "groupFooter" || r.field === "value" ? "nodata" : "cell"
           ),
-          colSpan: N,
+          colSpan: H,
           dataItem: t.dataItem,
           field: r.field,
           editor: r.editor,
           format: r.format,
           columnType: r.columnType,
-          rowReorderable: x,
-          className: y,
-          cells: pt(e.cells, r.cells),
-          columnIndex: u,
+          rowReorderable: N,
+          className: Z,
+          cells: el(e.cells, r.cells),
+          columnIndex: h,
           columnsCount: g.length,
           rowType: t.rowType,
           level: t.level,
@@ -349,91 +349,94 @@ const Hl = a.forwardRef((e, nt) => {
           columnPosition: p,
           style: {},
           ariaColumnIndex: r.ariaColumnIndex,
-          isSelected: !!((r == null ? void 0 : r._type) === "edit" ? c : Array.isArray(c) && c.indexOf(u) > -1),
-          isSorted: !!Ue(r.field, e.sort),
+          isSelected: !!((r == null ? void 0 : r._type) === "edit" ? c : Array.isArray(c) && c.indexOf(h) > -1),
+          isHighlighted: !!(typeof u != "boolean" && u && r.field && u[r.field] === !0),
+          isSorted: !!qe(r.field, e.sort),
           isInEdit: B,
           isAlt: d,
-          unstyled: G,
+          unstyled: k,
           group: t.group,
           localization: _,
-          intl: yt,
-          _rowSpan: C
-        }, L = r.defaultCell || B && (e.isClient ? _t : Rl) || (e.isClient ? tl : vl);
-        return /* @__PURE__ */ a.createElement(L, { key: A, cellProps: F });
+          intl: wt,
+          _rowSpan: w
+        }, ee = r.defaultCell || B && (e.isClient ? zt : Gl) || (e.isClient ? ll : Rl);
+        return /* @__PURE__ */ a.createElement(ee, { key: y, cellProps: L });
       }),
       isInEdit: l,
-      isSelected: typeof c == "boolean" && c
+      isSelected: typeof c == "boolean" && c,
+      isHighlighted: typeof u == "boolean" && u
     };
   };
-  let xt = 0, X = null;
-  const we = (t) => t >= b.length - xt, Y = [], Ee = !b.length;
-  let K = 0;
+  let kt = 0, Q = null;
+  const we = (t) => t >= b.length - kt, X = [], Ee = !b.length;
+  let A = 0;
   if (b.length) {
-    const t = H.length + (e.filterable ? 1 : 0) + 1;
+    const t = K.length + (e.filterable ? 1 : 0) + 1;
     let o = e.skip || 0, n = -1, d = 0;
     const i = se.enabled ? {} : void 0;
-    if (w) {
-      if (U > 0) {
-        const l = b.slice(0, U).filter((c) => c.rowType === "data").length;
+    if (E) {
+      if (j > 0) {
+        const l = b.slice(0, j).filter((c) => c.rowType === "data").length;
         n += l, o += l;
       }
       !e.pageable && z && (n += e.skip || 0);
     }
     (oe || b).forEach((l, c) => {
       l.rowType === "data" && n++;
-      const u = l.dataIndex % 2 !== 0, N = e.dataItemKey && D(e.dataItemKey)(l.dataItem), r = c + o, C = N || "ai" + r, A = C + "_1", y = Gt(l, C, n, u, i);
-      if (K = r + t + d, Q && Rt && y.isInEdit && (X = l.dataItem), Y.push(
+      const u = l.dataIndex % 2 !== 0, h = e.dataItemKey && S(e.dataItemKey)(l.dataItem), H = c + o, r = h || "ai" + H, w = r + "_1", y = xt(l, r, n, u, i);
+      if (A = H + t + d, J && Gt && y.isInEdit && (Q = l.dataItem), X.push(
         /* @__PURE__ */ a.createElement(
-          ll,
+          al,
           {
-            key: C,
+            key: r,
             dataItem: l.dataItem,
             isAltRow: u,
-            isInEdit: y.isInEdit && !Q,
+            isInEdit: y.isInEdit && !J,
             rowType: l.rowType,
-            isRowReorderable: x,
+            isRowReorderable: N,
             isHidden: we(c),
             onClick: null,
             onDoubleClick: null,
             rowHeight: e.rowHeight,
-            ariaRowIndex: K,
-            absoluteRowIndex: r,
+            ariaRowIndex: A,
+            absoluteRowIndex: H,
             dataIndex: n,
             isSelected: y.isSelected,
+            isHighlighted: y.isHighlighted,
             rows: e.rows
           },
           y.row
         )
       ), e.detail && l.rowType === "data" && l.expanded) {
-        const p = g.length - (P.enabled ? 1 : 0) - (e.group ? e.group.length : 0) || 1;
-        d++, K = r + t + d;
-        const B = e.isClient ? ol : Dl;
-        Y.push(
+        const Z = g.length - (P.enabled ? 1 : 0) - (e.group ? e.group.length : 0) || 1;
+        d++, A = H + t + d;
+        const p = e.isClient ? il : Hl;
+        X.push(
           /* @__PURE__ */ a.createElement(
             "tr",
             {
-              key: A,
+              key: w,
               className: f(s.detailTr({ isAlt: u })),
               style: {
                 visibility: we(c) ? "hidden" : "",
                 height: e.detailRowHeight
               },
               role: "row",
-              "aria-rowindex": K
+              "aria-rowindex": A
             },
-            e.group && e.group.map((ee, F) => {
+            e.group && e.group.map((B, F) => {
               var M;
-              const L = (M = y == null ? void 0 : y.row[F]) == null ? void 0 : M.props.style, j = L ? { left: L.left, right: L.right } : {};
+              const L = (M = y == null ? void 0 : y.row[F]) == null ? void 0 : M.props.style, ee = L ? { left: L.left, right: L.right } : {};
               return /* @__PURE__ */ a.createElement(
-                qe,
+                Je,
                 {
                   key: F,
                   cellProps: {
                     id: "",
                     dataItem: l.dataItem,
-                    field: ee.field,
+                    field: B.field,
                     dataIndex: l.dataIndex,
-                    columnPosition: j,
+                    columnPosition: ee,
                     style: {},
                     ariaColumnIndex: 1 + F,
                     isSelected: !1,
@@ -445,21 +448,21 @@ const Hl = a.forwardRef((e, nt) => {
               );
             }),
             P.enabled && /* @__PURE__ */ a.createElement(
-              il,
+              dl,
               {
-                unstyled: G,
-                id: O.generateNavigatableId(`${A}-dhcell`, R)
+                unstyled: k,
+                id: O.generateNavigatableId(`${w}-dhcell`, x)
               }
             ),
             /* @__PURE__ */ a.createElement(
-              B,
+              p,
               {
                 dataItem: l.dataItem,
                 dataIndex: l.dataIndex,
-                colSpan: p,
+                colSpan: Z,
                 ariaColIndex: 2 + (e.group ? e.group.length : 0),
                 detail: e.detail,
-                id: O.generateNavigatableId(`${A}-dcell`, R)
+                id: O.generateNavigatableId(`${w}-dcell`, x)
               }
             )
           )
@@ -467,50 +470,50 @@ const Hl = a.forwardRef((e, nt) => {
       }
     });
   }
-  const Se = {
-    size: E,
-    total: v,
+  const Ie = {
+    size: I,
+    total: G,
     skip: e.skip || 0,
     take: (e.take !== void 0 ? e.take : e.pageSize) || 10,
-    ...nl(e.pageable || {})
-  }, Ie = /* @__PURE__ */ a.createElement(ml, null, e.pager ? /* @__PURE__ */ a.createElement(e.pager, { ...Se }) : /* @__PURE__ */ a.createElement(Lt, { className: f(s.pager({})), ...Se })), kt = (t, o) => /* @__PURE__ */ a.createElement("col", { key: o.toString(), width: le(t) }), ve = (_e = e.cells) != null && _e.footerCell || m.some((t) => {
+    ...ol(e.pageable || {})
+  }, ve = /* @__PURE__ */ a.createElement(ul, null, e.pager ? /* @__PURE__ */ a.createElement(e.pager, { ...Ie }) : /* @__PURE__ */ a.createElement(Mt, { className: f(s.pager({})), ...Ie })), Nt = (t, o) => /* @__PURE__ */ a.createElement("col", { key: o.toString(), width: le(t) }), Se = (_e = e.cells) != null && _e.footerCell || m.some((t) => {
     var o;
     return !!((o = t.cells) != null && o.footerCell);
   }) ? /* @__PURE__ */ a.createElement(
-    jt,
+    Ut,
     {
-      size: E,
+      size: I,
       staticHeaders: e.scrollable !== "none",
       row: /* @__PURE__ */ a.createElement(
-        rl,
+        nl,
         {
           cells: e.cells,
-          idPrefix: R,
+          idPrefix: x,
           columns: m,
-          ariaRowIndex: K + 1
+          ariaRowIndex: A + 1
         }
       ),
-      cols: g.map(kt)
+      cols: g.map(Nt)
     }
-  ) : null, Re = /* @__PURE__ */ a.createElement(dl, null, g.map((t, o) => /* @__PURE__ */ a.createElement(
+  ) : null, Re = /* @__PURE__ */ a.createElement(cl, null, g.map((t, o) => /* @__PURE__ */ a.createElement(
     "col",
     {
       key: o.toString(),
-      className: Ue(t.field, e.sort) ? f(s.sorted({})) : void 0,
+      className: qe(t.field, e.sort) ? f(s.sorted({})) : void 0,
       width: le(t)
     }
-  ))), Ge = e.reorderable || V, { detail: Pl, cells: Kl, rows: Al, ...Nt } = e, xe = /* @__PURE__ */ a.createElement(
+  ))), Ge = e.reorderable || V, { detail: Pl, cells: Al, rows: Bl, ...Dt } = e, xe = /* @__PURE__ */ a.createElement(
     "tbody",
     {
       role: "rowgroup",
       className: f(s.tbody({})),
-      ...Mt
+      ...Ot
     },
-    Y
-  ), ke = X ? /* @__PURE__ */ a.createElement(Il, { columns: g, customEditDialog: e.editDialog, dataItem: X }) : null;
-  let Z = xe;
-  x && (Z = /* @__PURE__ */ a.createElement(
-    bl,
+    X
+  ), ke = Q ? /* @__PURE__ */ a.createElement(Sl, { columns: g, customEditDialog: e.editDialog, dataItem: Q }) : null;
+  let Y = xe;
+  N && (Y = /* @__PURE__ */ a.createElement(
+    hl,
     {
       unstyled: s,
       columns: m,
@@ -519,56 +522,56 @@ const Hl = a.forwardRef((e, nt) => {
     xe
   ));
   const Ne = {
-    gridRef: nt,
+    gridRef: ot,
     innerGrid: e.innerGrid,
-    gridProps: Nt,
+    gridProps: Dt,
     columnsRef: re(),
-    columnsMapRef: H,
-    columnsState: I,
+    columnsMapRef: K,
+    columnsState: R,
     dataRef: b,
     id: T,
     virtualTotal: me,
     isAllData: z,
     virtualPageSize: ce,
-    isVirtualScroll: w,
+    isVirtualScroll: E,
     detailExpandable: !!e.detail
   };
-  return e.scrollable === "none" ? /* @__PURE__ */ a.createElement(Ze, { ...Ne }, /* @__PURE__ */ a.createElement(lt, null, /* @__PURE__ */ a.createElement(
+  return e.scrollable === "none" ? /* @__PURE__ */ a.createElement(pe, { ...Ne }, /* @__PURE__ */ a.createElement(at, null, /* @__PURE__ */ a.createElement(
     "div",
     {
       id: e.id,
       style: e.style,
-      className: f(s.wrapper({ size: E }), e.className),
-      ...$e
+      className: f(s.wrapper({ size: I }), e.className),
+      ...je
     },
     ge,
     he,
     /* @__PURE__ */ a.createElement(
-      cl,
+      ml,
       {
         selectable: e.selectable,
-        className: f(s.table({ size: E }))
+        className: f(s.table({ size: I }))
       },
       Re,
-      Ce,
-      /* @__PURE__ */ a.createElement(tt, { rowReorderable: x }, Z),
-      ve
+      ye,
+      /* @__PURE__ */ a.createElement(lt, { rowReorderable: N }, Y),
+      Se
     ),
-    Ee && /* @__PURE__ */ a.createElement(Ye, null, $.length ? $ : /* @__PURE__ */ a.createElement(Je, null)),
-    Ge && /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(pe, null), /* @__PURE__ */ a.createElement(et, null))
-  )), be, e.pageable && Ie, /* @__PURE__ */ a.createElement(rt, { loader: e.loader, showLoader: e.showLoader }), ke, fe && /* @__PURE__ */ a.createElement(We, null)) : /* @__PURE__ */ a.createElement(Ze, { ...Ne }, /* @__PURE__ */ a.createElement(lt, null, /* @__PURE__ */ a.createElement(
+    Ee && /* @__PURE__ */ a.createElement(Ze, null, $.length ? $ : /* @__PURE__ */ a.createElement(Qe, null)),
+    Ge && /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(et, null), /* @__PURE__ */ a.createElement(tt, null))
+  )), be, e.pageable && ve, /* @__PURE__ */ a.createElement(nt, { loader: e.loader, showLoader: e.showLoader }), ke, fe && /* @__PURE__ */ a.createElement($e, null)) : /* @__PURE__ */ a.createElement(pe, { ...Ne }, /* @__PURE__ */ a.createElement(at, null, /* @__PURE__ */ a.createElement(
     "div",
     {
       id: e.id,
       style: e.style,
       className: f(
         s.wrapper({
-          size: E,
-          virtual: w
+          size: I,
+          virtual: E
         }),
         e.className
       ),
-      ...$e
+      ...je
     },
     ge,
     he,
@@ -578,43 +581,43 @@ const Hl = a.forwardRef((e, nt) => {
         className: f(s.ariaRoot({})),
         role: "grid",
         "aria-colcount": g.length,
-        "aria-rowcount": v,
+        "aria-rowcount": G,
         id: T,
-        "aria-label": _.toLanguageString(at, gl[at])
+        "aria-label": _.toLanguageString(rt, bl[rt])
       },
-      Ce,
-      /* @__PURE__ */ a.createElement("div", { className: f(s.container({})), role: "presentation" }, /* @__PURE__ */ a.createElement(sl, null, /* @__PURE__ */ a.createElement("div", { className: f(s.content({})), role: "presentation" }, /* @__PURE__ */ a.createElement("div", { className: f(s.tableWrap({})), role: "presentation" }, /* @__PURE__ */ a.createElement(
-        ul,
+      ye,
+      /* @__PURE__ */ a.createElement("div", { className: f(s.container({})), role: "presentation" }, /* @__PURE__ */ a.createElement(fl, null, /* @__PURE__ */ a.createElement("div", { className: f(s.content({})), role: "presentation" }, /* @__PURE__ */ a.createElement("div", { className: f(s.tableWrap({})), role: "presentation" }, /* @__PURE__ */ a.createElement(
+        sl,
         {
           selectable: e.selectable,
           tableClassName: f(
             s.table({
-              size: E
+              size: I
             })
           ),
-          tableStyle: { userSelect: vt }
+          tableStyle: { userSelect: Rt }
         },
         Re,
-        /* @__PURE__ */ a.createElement(tt, { rowReorderable: x }, Z)
-      ), Ee && /* @__PURE__ */ a.createElement(Ye, null, $.length ? $ : /* @__PURE__ */ a.createElement(Je, null))), w && /* @__PURE__ */ a.createElement(
+        /* @__PURE__ */ a.createElement(lt, { rowReorderable: N }, Y)
+      ), Ee && /* @__PURE__ */ a.createElement(Ze, null, $.length ? $ : /* @__PURE__ */ a.createElement(Qe, null))), E && /* @__PURE__ */ a.createElement(
         "div",
         {
           className: f(s.heightContainer({})),
           role: "presentation"
         },
-        /* @__PURE__ */ a.createElement(fl, { isVirtualScroll: w })
+        /* @__PURE__ */ a.createElement(gl, { isVirtualScroll: E })
       )))),
-      ve,
-      Ge && /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(pe, null), /* @__PURE__ */ a.createElement(et, null)),
-      fe && /* @__PURE__ */ a.createElement(We, null)
+      Se,
+      Ge && /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(et, null), /* @__PURE__ */ a.createElement(tt, null)),
+      fe && /* @__PURE__ */ a.createElement($e, null)
     ),
     be,
-    e.pageable && Ie,
-    /* @__PURE__ */ a.createElement(rt, { loader: e.loader, showLoader: e.showLoader }),
+    e.pageable && ve,
+    /* @__PURE__ */ a.createElement(nt, { loader: e.loader, showLoader: e.showLoader }),
     ke
   )));
 });
-Hl.displayName = "KendoReactGridComponent";
+Kl.displayName = "KendoReactGridComponent";
 export {
-  Hl as GridComponent
+  Kl as GridComponent
 };