@progress/kendo-react-grid 13.4.0-develop.5 → 14.0.0-develop.1

package/GridClientWrapper.mjs

@@ -7,29 +7,30 @@
  */
 "use client";
 import * as d from "react";
-import { useAdaptiveModeContext as Vt, canUseDOM as Q, getActiveElement as jt, useDir as qt, setScrollbarWidth as Ue, cloneArray as _t, RowHeightService as $t, getter as Z } from "@progress/kendo-react-common";
-import { filterBy as Jt } from "@progress/kendo-data-query";
-import { getSelectionOptions as se, populateClipboardData as Xt, ClipboardActionType as ke, getEditableOptions as Yt, tableKeyboardNavigation as _, ClipboardService as Qt, TableKeyboardNavigationContext as Zt, updateLeft as pt, updateRight as en, getGroupExpandableOptions as tn, groupExpandReducer as nn, getDetailExpandableOptions as rn, detailExpandReducer as on, getSelectedState as Ve, editReducer as an, EDIT_ACTION as dn, closestTagName as ue, getSelectedStateFromKeyDown as cn, getColumnIndex as ln, getRowIndex as sn } from "@progress/kendo-react-data-tools";
-import { ColumnResize as un } from "./drag/ColumnResize.mjs";
-import { CommonDragLogic as gn } from "./drag/CommonDragLogic.mjs";
-import { getDefaultHeadContextMenuItems as fn, getDefaultBodyContextMenuItems as mn, isRowReorderEnabled as hn, calcRowHeight as Pn, sanitizeColumns as Rn, getFlatColumnsState as bn, getDataAsArray as vn } from "./utils/index.mjs";
-import { VirtualScroll as In } from "./VirtualScroll.mjs";
-import { GridContextMenu as Cn } from "./contextMenu/GridContextMenu.mjs";
-import { GridContextMenuAnchorPart as je } from "./contextMenu/enums.mjs";
-import { normalizeSortable as En, firstLevelSortSeqMap as wn } from "./sortCommon.mjs";
-import { BasePDFExport as yn } from "./BasePDFExport.mjs";
-import { GridContext as xn } from "./utils/GridContext.mjs";
-import { operators as Sn } from "./filterCommon.mjs";
-const kn = (t, E, P, D) => {
-  const $ = Object.keys(E.cells).map((k) => P.findIndex((W) => W.field === k)), O = Object.keys(E.cells).length > 0 ? $ : !0;
-  return t.reduce((k, W) => (k[W[D != null ? D : "id"]] = O, k), {});
-}, qe = (t, E, P, D) => E.reduce((O, k) => ({
+import { useAdaptiveModeContext as $t, canUseDOM as Q, getActiveElement as Jt, useDir as Xt, setScrollbarWidth as qe, cloneArray as Yt, RowHeightService as Qt, getter as Z } from "@progress/kendo-react-common";
+import { filterBy as Zt } from "@progress/kendo-data-query";
+import { getSelectionOptions as se, populateClipboardData as pt, ClipboardActionType as ke, getEditableOptions as en, tableKeyboardNavigation as q, ClipboardService as tn, TableKeyboardNavigationContext as nn, updateLeft as rn, updateRight as on, getGroupExpandableOptions as an, groupExpandReducer as dn, getDetailExpandableOptions as cn, detailExpandReducer as ln, getSelectedState as _e, editReducer as sn, EDIT_ACTION as un, closestTagName as ue, getSelectedStateFromKeyDown as gn, getColumnIndex as fn, getRowIndex as mn } from "@progress/kendo-react-data-tools";
+import { ColumnResize as Pn } from "./drag/ColumnResize.mjs";
+import { CommonDragLogic as hn } from "./drag/CommonDragLogic.mjs";
+import { getDefaultHeadContextMenuItems as Rn, getDefaultBodyContextMenuItems as vn, isRowReorderEnabled as bn, calcRowHeight as Cn, sanitizeColumns as In, getFlatColumnsState as En, getDataAsArray as wn } from "./utils/index.mjs";
+import { VirtualScroll as xn } from "./VirtualScroll.mjs";
+import { GridContextMenu as yn } from "./contextMenu/GridContextMenu.mjs";
+import { GridContextMenuAnchorPart as $e } from "./contextMenu/enums.mjs";
+import { normalizeSortable as Sn, firstLevelSortSeqMap as kn } from "./sortCommon.mjs";
+import { BasePDFExport as Dn } from "./BasePDFExport.mjs";
+import { BaseCSVExport as Kn } from "./BaseCSVExport.mjs";
+import { GridContext as Mn } from "./utils/GridContext.mjs";
+import { operators as Hn } from "./filterCommon.mjs";
+const Tn = (t, E, h, D) => {
+  const _ = Object.keys(E.cells).map((y) => h.findIndex(($) => $.field === y)), O = Object.keys(E.cells).length > 0 ? _ : !0;
+  return t.reduce((y, $) => (y[$[D != null ? D : "id"]] = O, y), {});
+}, Je = (t, E, h, D) => E.reduce((O, y) => ({
   ...O,
-  ...kn(Jt(t, k), k, P, D)
-}), {}), Un = (t) => {
-  const E = t.gridProps.isClient, [P, D] = d.useState({}), $ = Vt(), O = d.useRef(null), k = (e) => {
+  ...Tn(Zt(t, y), y, h, D)
+}), {}), Jn = (t) => {
+  const E = t.gridProps.isClient, [h, D] = d.useState({}), _ = $t(), O = d.useRef(null), y = d.useRef(null), $ = (e) => {
     e.event.preventDefault(), D({
-      ...P,
+      ...h,
       show: !0,
       offset: {
         left: e.event.pageX,
@@ -38,31 +39,31 @@ const kn = (t, E, P, D) => {
       dataItem: e.dataItem,
       field: e.field
     });
-  }, W = () => {
+  }, De = () => {
     D({});
-  }, I = d.useMemo(() => t.columnsRef.find((e) => e.field === P.field), [t.columnsRef, P]), De = d.useMemo(() => {
-    const e = t.gridProps.sortable && (I == null ? void 0 : I.sortable);
-    return fn({
+  }, C = d.useMemo(() => t.columnsRef.find((e) => e.field === h.field), [t.columnsRef, h]), Ke = d.useMemo(() => {
+    const e = t.gridProps.sortable && (C == null ? void 0 : C.sortable);
+    return Rn({
       pdf: !!t.gridProps.pdf,
       sortable: !!e,
       selectable: se(t.gridProps.selectable).enabled,
       clipboard: !!t.gridProps.clipboard
     });
-  }, [I, t.gridProps.sortable, t.gridProps.selectable, t.gridProps.clipboard]), Ke = d.useMemo(() => (t.gridProps.sortable && (I == null || I.sortable), mn({
+  }, [C, t.gridProps.sortable, t.gridProps.selectable, t.gridProps.clipboard]), Me = d.useMemo(() => (t.gridProps.sortable && (C == null || C.sortable), vn({
     pdf: !!t.gridProps.pdf,
     selectable: se(t.gridProps.selectable).enabled,
     clipboard: !!t.gridProps.clipboard,
-    rowReorderable: hn(t.gridProps.rowReorderable)
-  })), [I, t.gridProps.sortable, t.gridProps.selectable, t.gridProps.clipboard]), p = d.useMemo(() => {
-    const e = (I == null ? void 0 : I.contextMenu) || t.gridProps.contextMenu, n = typeof e == "function" ? e(P) : e;
-    if (n && P.offset) {
-      const o = P.dataItem ? je.body : je.head, r = n[o], i = P.dataItem ? Ke : De;
+    rowReorderable: bn(t.gridProps.rowReorderable)
+  })), [C, t.gridProps.sortable, t.gridProps.selectable, t.gridProps.clipboard]), p = d.useMemo(() => {
+    const e = (C == null ? void 0 : C.contextMenu) || t.gridProps.contextMenu, n = typeof e == "function" ? e(h) : e;
+    if (n && h.offset) {
+      const o = h.dataItem ? $e.body : $e.head, r = n[o], i = h.dataItem ? Me : Ke;
       return r === !1 ? void 0 : r === !0 || r === void 0 ? i : r;
     }
-  }, [t.gridProps.contextMenu, P, Ke, De, I]), _e = (e) => {
-    var c, f, l, u, s, v, m, S, z;
+  }, [t.gridProps.contextMenu, h, Me, Ke, C]), Xe = (e) => {
+    var c, f, l, u, s, b, m, k, z;
     const n = e.event.item, o = {
-      target: y.current,
+      target: x.current,
       syntheticEvent: e.event.syntheticEvent,
       nativeEvent: e.event.nativeEvent,
       menuItem: n,
@@ -88,32 +89,32 @@ const kn = (t, E, P, D) => {
     }, a = r.findIndex((Y) => Y === e.dataItem);
     switch ((c = n.data) == null ? void 0 : c.action) {
       case "SortCommand":
-        if (I) {
-          const Y = (f = n.name) == null ? void 0 : f.toLowerCase().includes("asc"), Nt = ((l = n.name) == null ? void 0 : l.toLowerCase().includes("desc")) ? "desc" : void 0, Bt = Y ? "asc" : Nt, Ut = n.name ? Bt : void 0;
-          Me(e.event.syntheticEvent, I, Ut);
+        if (C) {
+          const Y = (f = n.name) == null ? void 0 : f.toLowerCase().includes("asc"), jt = ((l = n.name) == null ? void 0 : l.toLowerCase().includes("desc")) ? "desc" : void 0, qt = Y ? "asc" : jt, _t = n.name ? qt : void 0;
+          He(e.event.syntheticEvent, C, _t);
         }
         break;
       case "SelectRowCommand":
-        ut(i);
+        mt(i);
         break;
       case "SelectAllRowsCommand":
-        st(i);
+        ft(i);
         break;
       case "ExportPDFCommand":
         fe();
         break;
       case "ClearSelectionCommand":
-        ft(i);
+        ht(i);
         break;
       case "ReorderRowCommand":
-        X.current = e.dataItem, (u = n.name) != null && u.toLowerCase().includes("rowup") && a > 0 && J(e.event.syntheticEvent, a - 1, "before"), (s = n.name) != null && s.toLowerCase().includes("rowdown") && a < r.length - 1 && J(e.event.syntheticEvent, a + 1, "after"), (v = n.name) != null && v.toLowerCase().includes("rowtop") && J(e.event.syntheticEvent, 0, "before"), (m = n.name) != null && m.toLowerCase().includes("rowbottom") && J(e.event.syntheticEvent, r.length - 1, "after");
+        X.current = e.dataItem, (u = n.name) != null && u.toLowerCase().includes("rowup") && a > 0 && J(e.event.syntheticEvent, a - 1, "before"), (s = n.name) != null && s.toLowerCase().includes("rowdown") && a < r.length - 1 && J(e.event.syntheticEvent, a + 1, "after"), (b = n.name) != null && b.toLowerCase().includes("rowtop") && J(e.event.syntheticEvent, 0, "before"), (m = n.name) != null && m.toLowerCase().includes("rowbottom") && J(e.event.syntheticEvent, r.length - 1, "after");
         break;
       case "CopySelectionCommand":
         oe(
           ke.copy,
           e.event.nativeEvent,
           {
-            copyHeaders: !((S = n.name) != null && S.toLowerCase().includes("noheaders"))
+            copyHeaders: !((k = n.name) != null && k.toLowerCase().includes("noheaders"))
           },
           e.dataItem,
           e.field
@@ -131,14 +132,14 @@ const kn = (t, E, P, D) => {
         );
         break;
     }
-    W();
+    De();
   }, ee = () => {
     const e = t.columnsRef.filter((n) => n.declarationIndex >= 0 && n.parentIndex === -1);
-    return Rn(e);
-  }, $e = (e, n, o) => {
+    return In(e);
+  }, Ye = (e, n, o) => {
     if (t.gridProps.onContextMenu && E) {
       const r = {
-        target: y.current,
+        target: x.current,
         syntheticEvent: e,
         nativeEvent: e.nativeEvent,
         dataItem: n,
@@ -146,50 +147,50 @@ const kn = (t, E, P, D) => {
       };
       g(t.gridProps.onContextMenu, r);
     }
-    t.gridProps.contextMenu && k({
+    t.gridProps.contextMenu && $({
       event: e,
       dataItem: n,
       field: o
     });
-  }, Je = (e) => {
+  }, Qe = (e) => {
     if (e.target !== e.currentTarget)
       return;
-    clearTimeout(we.current), b.current && (b.current.table = A.current);
+    clearTimeout(we.current), v.current && (v.current.table = A.current);
     const n = e.currentTarget.scrollLeft, o = e.currentTarget.scrollTop;
-    t.gridProps.columnVirtualization && (!x || o === Ee.current) && (we.current = window.setTimeout(() => {
-      U();
-    }, 0)), t.gridProps.scrollLeftRef && (t.gridProps.scrollLeftRef.current = n), F.current && F.current.setScrollLeft(n), L.current && L.current.setScrollLeft(n), b.current && o !== Ee.current && b.current.scrollHandler(e), t.gridProps.onScroll && E && g(t.gridProps.onScroll, {
+    t.gridProps.columnVirtualization && (!S || o === Ee.current) && (we.current = window.setTimeout(() => {
+      N();
+    }, 0)), t.gridProps.scrollLeftRef && (t.gridProps.scrollLeftRef.current = n), F.current && F.current.setScrollLeft(n), L.current && L.current.setScrollLeft(n), v.current && o !== Ee.current && v.current.scrollHandler(e), t.gridProps.onScroll && E && g(t.gridProps.onScroll, {
       ...R(e)
     }), Ee.current = o;
-  }, Xe = (e) => {
-    _.onKeyDown(e, {
+  }, Ze = (e) => {
+    q.onKeyDown(e, {
       navigatable: t.gridProps.navigatable || !1,
       contextStateRef: T,
       navigationStateRef: V,
-      onNavigationAction: Qe,
+      onNavigationAction: et,
       columns: ee()
-    }), _.onGetSnapshotBeforeUpdate({
+    }), q.onGetSnapshotBeforeUpdate({
       document: K(),
       contextStateRef: T,
       navigationStateRef: V
     });
     const n = {
       dataItems: w(),
-      mode: h.mode,
-      cell: h.cell,
+      mode: P.mode,
+      cell: P.cell,
       componentId: t.id,
       selectedField: "",
       ...R(e)
     };
     t.gridProps.onKeyDown && E && g(t.gridProps.onKeyDown, n);
-  }, Ye = (e) => {
-    _.onFocus(e, {
+  }, pe = (e) => {
+    q.onFocus(e, {
       navigatable: !!t.gridProps.navigatable,
       contextStateRef: T
     });
-  }, Qe = (e) => {
+  }, et = (e) => {
     const { columnsRef: n } = t;
-    if (e.action === "moveToNextPage" && Pt(e.event), e.action === "moveToPrevPage" && Rt(e.event), e.focusElement && (e.action === "reorderToRight" || e.action === "reorderToLeft")) {
+    if (e.action === "moveToNextPage" && bt(e.event), e.action === "moveToPrevPage" && Ct(e.event), e.focusElement && (e.action === "reorderToRight" || e.action === "reorderToLeft")) {
       const o = parseInt(e.focusElement.ariaColIndex, 10) - 1;
       if (!n[o].reorderable)
         return;
@@ -204,39 +205,39 @@ const kn = (t, E, P, D) => {
         ne(o, o - 1, e.event);
       }
     }
-    if (e.action === "select" && dt(e.event), t.gridProps.onNavigationAction && E) {
+    if (e.action === "select" && st(e.event), t.gridProps.onNavigationAction && E) {
       const o = {
         focusElement: e.focusElement,
         ...R(e.event)
       };
       g(t.gridProps.onNavigationAction, o);
     }
-  }, Ze = (e, n) => {
+  }, tt = (e, n) => {
     t.gridProps.onRowClick && ue(e.target, "TD") && g(t.gridProps.onRowClick, {
       dataItem: n,
       ...R(e)
     });
-  }, pe = (e, n) => {
+  }, nt = (e, n) => {
     t.gridProps.onRowDoubleClick && ue(e.target, "TD") && g(t.gridProps.onRowDoubleClick, {
       dataItem: n,
       ...R(e)
     });
-  }, et = (e) => {
+  }, rt = (e) => {
     t.gridProps.onItemChange && g(t.gridProps.onItemChange, {
       ...R(e.syntheticEvent),
       dataItem: e.dataItem,
       field: void 0,
       value: void 0
     });
-  }, tt = (e) => {
+  }, ot = (e) => {
     t.gridProps.onItemChange && t.gridProps.onEditChange && g(t.gridProps.onEditChange, {
       edit: {},
       ...R(e.syntheticEvent)
     });
-  }, nt = (e, n, o) => {
-    if (Be.enabled && Be.mode === "incell" && t.gridProps.dataItemKey) {
-      const r = an(t.gridProps.edit, {
-        type: dn.ENTER_FIELD_EDIT,
+  }, it = (e, n, o) => {
+    if (je.enabled && je.mode === "incell" && t.gridProps.dataItemKey) {
+      const r = sn(t.gridProps.edit, {
+        type: un.ENTER_FIELD_EDIT,
         payload: { id: n[t.gridProps.dataItemKey], field: o }
       });
       t.gridProps.onEditChange && g(t.gridProps.onEditChange, {
@@ -244,34 +245,34 @@ const kn = (t, E, P, D) => {
         ...R(e)
       });
     }
-  }, rt = (e, n) => {
+  }, at = (e, n) => {
     var r;
-    if (rn(t.detailExpandable).enabled) {
-      const i = on((r = t.gridProps.detailExpand) != null ? r : {}, e);
+    if (cn(t.detailExpandable).enabled) {
+      const i = ln((r = t.gridProps.detailExpand) != null ? r : {}, e);
       t.gridProps.onDetailExpandChange && g(t.gridProps.onDetailExpandChange, {
         ...R(n),
         detailExpand: i
       });
     }
-  }, ot = (e, n) => {
+  }, dt = (e, n) => {
     var r;
-    const o = tn(
+    const o = an(
       typeof t.gridProps.groupable == "object" ? t.gridProps.groupable.expandable !== !1 : t.gridProps.groupable
     );
     if (o.enabled) {
-      const i = nn((r = t.gridProps.groupExpand) != null ? r : [], e, o);
+      const i = dn((r = t.gridProps.groupExpand) != null ? r : [], e, o);
       t.gridProps.onGroupExpandChange && g(t.gridProps.onGroupExpandChange, {
         ...R(n),
         groupExpand: i
       });
     }
-  }, Me = (e, n, o) => {
-    const { allowUnsort: r, mode: i } = En(
+  }, He = (e, n, o) => {
+    const { allowUnsort: r, mode: i } = Sn(
       t.gridProps.sortable || !1,
       n.sortable || !1
-    ), a = (t.gridProps.sort || []).filter((l) => l.field === n.field)[0], c = o || wn[r][a && a.dir || ""], f = i === "single" ? [] : (t.gridProps.sort || []).filter((l) => l.field !== n.field);
-    c !== "" && n.field && f.push({ field: n.field, dir: c }), He(f, e);
-  }, it = (e) => {
+    ), a = (t.gridProps.sort || []).filter((l) => l.field === n.field)[0], c = o || kn[r][a && a.dir || ""], f = i === "single" ? [] : (t.gridProps.sort || []).filter((l) => l.field !== n.field);
+    c !== "" && n.field && f.push({ field: n.field, dir: c }), Te(f, e);
+  }, ct = (e) => {
     t.gridProps.onItemChange && g(t.gridProps.onItemChange, {
       ...R(e.syntheticEvent),
       dataItem: e.dataItem,
@@ -279,9 +280,9 @@ const kn = (t, E, P, D) => {
       field: e.field,
       value: e.value
     });
-  }, at = (e) => {
+  }, lt = (e) => {
     var n;
-    if (t.gridProps.onSelectionChange && h.enabled) {
+    if (t.gridProps.onSelectionChange && P.enabled) {
       const { event: o, dataItem: r, dataIndex: i, columnIndex: a } = e, c = {
         ...R(o),
         dataItem: r,
@@ -294,42 +295,42 @@ const kn = (t, E, P, D) => {
         ctrlKey: !1,
         shiftKey: !1,
         metaKey: !1,
-        mode: h.mode,
-        cell: h.cell,
+        mode: P.mode,
+        cell: P.cell,
         isDrag: !1,
         componentId: t.id,
         selectedField: ""
       };
       g(t.gridProps.onSelectionChange, {
         ...c,
-        select: t.gridProps.dataItemKey ? Ve({
+        select: t.gridProps.dataItemKey ? _e({
           event: c,
           selectedState: (n = t.gridProps.select) != null ? n : {},
           dataItemKey: t.gridProps.dataItemKey
         }) : {}
       });
     }
-  }, dt = (e) => {
+  }, st = (e) => {
     var l, u;
-    if (!h.enabled || !t.gridProps.dataItemKey)
+    if (!P.enabled || !t.gridProps.dataItemKey)
       return;
     const n = {
       dataItems: w(),
-      mode: h.mode,
-      cell: h.cell,
+      mode: P.mode,
+      cell: P.cell,
       componentId: t.id,
       selectedField: "",
       ...R(e)
-    }, o = cn({
+    }, o = gn({
       event: n,
       selectedState: (l = t.gridProps.select) != null ? l : {},
       dataItemKey: t.gridProps.dataItemKey
     });
     if (o === t.gridProps.select)
       return;
-    const r = e.target, i = ue(r, "TD"), a = ue(r, "TR"), c = ln(i), f = sn(a);
+    const r = e.target, i = ue(r, "TD"), a = ue(r, "TR"), c = fn(i), f = mn(a);
     if (c !== void 0 && f !== void 0) {
-      const s = (u = vn(t.gridProps.data)) == null ? void 0 : u[f];
+      const s = (u = wn(t.gridProps.data)) == null ? void 0 : u[f];
       t.gridProps.onSelectionChange && g(t.gridProps.onSelectionChange, {
         ...n,
         select: o,
@@ -347,29 +348,29 @@ const kn = (t, E, P, D) => {
         isDrag: !1
       });
     }
-  }, ct = (e) => {
-    if (t.gridProps.onHeaderSelectionChange && h.enabled) {
+  }, ut = (e) => {
+    if (t.gridProps.onHeaderSelectionChange && P.enabled) {
       const n = w();
       g(t.gridProps.onHeaderSelectionChange, {
         select: e.syntheticEvent.target.checked ? n.reduce((o, r) => (t.gridProps.dataItemKey && Z(t.gridProps.dataItemKey)(r) !== void 0 && (o[Z(t.gridProps.dataItemKey)(r)] = !0), o), {}) : {},
         field: e.field,
         nativeEvent: e.syntheticEvent && e.syntheticEvent.nativeEvent,
         syntheticEvent: e.syntheticEvent,
-        target: y.current,
+        target: x.current,
         dataItems: n
       });
     }
-  }, N = (e, n) => {
-    t.gridProps.onSelectionChange && h.enabled && g(t.gridProps.onSelectionChange, {
+  }, W = (e, n) => {
+    t.gridProps.onSelectionChange && P.enabled && g(t.gridProps.onSelectionChange, {
       ...e,
       select: n
     });
-  }, lt = (e) => {
+  }, gt = (e) => {
     var n;
-    if (t.gridProps.onSelectionChange && h.enabled) {
+    if (t.gridProps.onSelectionChange && P.enabled) {
       const o = w()[e.startRowIndex], r = w()[e.endRowIndex], i = {
         syntheticEvent: void 0,
-        target: y.current,
+        target: x.current,
         selectedField: "",
         componentId: t.id,
         dataItems: w(),
@@ -377,17 +378,17 @@ const kn = (t, E, P, D) => {
         startDataItem: o,
         endDataItem: r,
         ...e
-      }, a = Ve({
+      }, a = _e({
         event: i,
         selectedState: (n = t.gridProps.select) != null ? n : {},
         // Thats kinda strange, even through the `dataItemKey` is required by the `getSelectedState`
         // it does work correctly even without it
         dataItemKey: t.gridProps.dataItemKey
       });
-      N(i, a);
+      W(i, a);
     }
-  }, st = (e) => {
-    if (t.gridProps.onSelectionChange && h.enabled) {
+  }, ft = (e) => {
+    if (t.gridProps.onSelectionChange && P.enabled) {
       const n = e.dataItems[0], o = e.dataItems[e.dataItems.length - 1], r = {}, i = {
         ...e,
         startDataItem: n,
@@ -400,10 +401,10 @@ const kn = (t, E, P, D) => {
       e.dataItems.forEach((a) => {
         const f = Z(t.gridProps.dataItemKey)(a);
         r[f] = e.cell ? [...Array(t.columnsRef.length).keys()] : !0;
-      }), N(i, r);
+      }), W(i, r);
     }
-  }, ut = (e) => {
-    if (t.gridProps.onSelectionChange && h.enabled) {
+  }, mt = (e) => {
+    if (t.gridProps.onSelectionChange && P.enabled) {
       const o = Z(t.gridProps.dataItemKey)(e.dataItem), r = 0, i = t.columnsRef.length - 1, a = e.dataItems.findIndex(
         (s) => s[t.gridProps.dataItemKey] === e.dataItem[t.gridProps.dataItemKey]
       ), l = {
@@ -415,15 +416,15 @@ const kn = (t, E, P, D) => {
         startColIndex: r,
         endColIndex: i
       }, u = e.mode === "multiple" ? t.gridProps.select || {} : {};
-      u[o] === !0 || Array.isArray(u[o]) && u[o].length === t.columnsRef.length ? delete u[o] : u[o] = e.cell ? [...Array(t.columnsRef.length).keys()] : !0, N(l, u);
+      u[o] === !0 || Array.isArray(u[o]) && u[o].length === t.columnsRef.length ? delete u[o] : u[o] = e.cell ? [...Array(t.columnsRef.length).keys()] : !0, W(l, u);
     }
-  }, gt = (e) => {
-    if (!h.enabled)
+  }, Pt = (e) => {
+    if (!P.enabled)
       return;
     const n = w(), o = {
       syntheticEvent: void 0,
       nativeEvent: void 0,
-      target: y.current,
+      target: x.current,
       selectedField: "",
       componentId: t.id,
       dataItems: n,
@@ -435,8 +436,8 @@ const kn = (t, E, P, D) => {
       metaKey: !1,
       shiftKey: !1,
       isDrag: !1,
-      mode: h.mode,
-      cell: h.cell
+      mode: P.mode,
+      cell: P.cell
     };
     if (!e || e.length === 0) {
       const s = {
@@ -446,24 +447,24 @@ const kn = (t, E, P, D) => {
         startColIndex: -1,
         endColIndex: -1
       };
-      N(s, {});
+      W(s, {});
       return;
     }
-    const r = qe(
+    const r = Je(
       t.gridProps.data,
       e,
       t.columnsRef,
       t.gridProps.dataItemKey
     ), i = {};
     Object.keys(r).forEach((s) => {
-      r[s] && (i[s] = h.cell ? [...Array(t.columnsRef.length).keys()] : !0);
+      r[s] && (i[s] = P.cell ? [...Array(t.columnsRef.length).keys()] : !0);
     });
     let a = -1, c = -1, f = n[0] || null, l = n[n.length - 1] || null;
     if (t.gridProps.dataItemKey) {
       const s = Z(t.gridProps.dataItemKey);
-      for (let v = 0; v < n.length; v++) {
-        const m = s(n[v]);
-        m !== void 0 && r[m] && (a === -1 && (a = v, f = n[v]), c = v, l = n[v]);
+      for (let b = 0; b < n.length; b++) {
+        const m = s(n[b]);
+        m !== void 0 && r[m] && (a === -1 && (a = b, f = n[b]), c = b, l = n[b]);
       }
     }
     const u = {
@@ -475,11 +476,11 @@ const kn = (t, E, P, D) => {
       startDataItem: f,
       endDataItem: l
     };
-    N(u, i);
-  }, ft = (e) => {
-    t.gridProps.onSelectionChange && h.enabled && N(e, {});
+    W(u, i);
+  }, ht = (e) => {
+    t.gridProps.onSelectionChange && P.enabled && W(e, {});
   }, B = (e, n, o, r, i) => {
-    ht();
+    vt();
     const a = t.gridProps.onDataStateChange;
     if (e) {
       const c = { ...R(r), ...n, targetEvent: i };
@@ -488,71 +489,71 @@ const kn = (t, E, P, D) => {
       ...R(r),
       targetEvent: i || {},
       dataState: {
-        ...kt(),
+        ...Ht(),
         ...o
       }
     });
   }, te = (e, n, o) => {
     var r;
-    x && t.gridProps.pageable && ((r = b.current) == null || r.reset()), B(
+    S && t.gridProps.pageable && ((r = v.current) == null || r.reset()), B(
       t.gridProps.onPageChange,
       { page: e },
       { skip: e.skip, take: e.take },
       n,
       o
     );
-  }, mt = (e, n, o) => {
+  }, Rt = (e, n, o) => {
     var r;
-    t.gridProps.pageable || (r = t.gridProps.group) != null && r.length ? t.gridProps.virtualSkipRef && (t.gridProps.virtualSkipRef.current = e.skip, U()) : te(e, n, o);
+    t.gridProps.pageable || (r = t.gridProps.group) != null && r.length ? t.gridProps.virtualSkipRef && (t.gridProps.virtualSkipRef.current = e.skip, N()) : te(e, n, o);
   }, ge = () => {
     let e = t.gridProps.total || 0;
     return Array.isArray(t.gridProps.data) ? e = e || t.gridProps.data.length : t.gridProps.data && (e = e || t.gridProps.data.total), e;
-  }, ht = () => {
-    x && t.gridProps.virtualSkipRef && (t.gridProps.virtualSkipRef.current = 0);
-  }, Pt = (e) => {
+  }, vt = () => {
+    S && t.gridProps.virtualSkipRef && (t.gridProps.virtualSkipRef.current = 0);
+  }, bt = (e) => {
     var i, a;
     const n = (a = (i = t.gridProps.take) != null ? i : t.gridProps.pageSize) != null ? a : 0, o = (t.gridProps.skip || 0) + n, r = ge();
     o < r && te({ skip: o, take: n }, e);
-  }, Rt = (e) => {
+  }, Ct = (e) => {
     var r, i;
     const n = (i = (r = t.gridProps.take) != null ? r : t.gridProps.pageSize) != null ? i : 0, o = (t.gridProps.skip || 0) - n;
     o >= 0 && te({ skip: o, take: n }, e);
-  }, bt = (e) => {
+  }, It = (e) => {
     te({ skip: e.skip, take: e.take }, e.syntheticEvent, e.targetEvent);
-  }, He = (e, n) => {
+  }, Te = (e, n) => {
     B(
       t.gridProps.onSortChange,
       { sort: e },
-      { sort: e, ...x && !t.gridProps.pageable ? { skip: 0 } : {} },
+      { sort: e, ...S && !t.gridProps.pageable ? { skip: 0 } : {} },
       n
     );
-  }, vt = (e, n) => {
+  }, Et = (e, n) => {
     B(
       t.gridProps.onFilterChange,
       { filter: e },
       { filter: e, skip: 0 },
       n
     );
-  }, It = (e) => {
+  }, wt = (e) => {
     if (!e || e.length === 0) {
-      Te({});
+      Ge({});
       return;
     }
-    const n = qe(
+    const n = Je(
       t.gridProps.data,
       e,
       t.columnsRef,
       t.gridProps.dataItemKey
     );
-    Te({ ...n });
-  }, Te = (e) => {
+    Ge({ ...n });
+  }, Ge = (e) => {
     B(
       t.gridProps.onHighlightChange,
       { highlight: e },
       {},
       {}
     );
-  }, Ct = (e) => {
+  }, xt = (e) => {
     const n = t.gridProps.searchFields || t.columnsRef.map((i) => i.field) || [], o = e.nativeEvent.target.value, r = {
       logic: "or",
       filters: n.filter((i) => i !== void 0).map((i) => {
@@ -576,51 +577,60 @@ const kn = (t, E, P, D) => {
   }, fe = () => {
     var e;
     (e = O.current) == null || e.save();
-  }, Et = async (e) => {
+  }, Ae = async () => {
+    var e;
+    await ((e = y.current) == null ? void 0 : e.save());
+  }, Le = () => {
+    var e;
+    return ((e = y.current) == null ? void 0 : e.getBlob()) || null;
+  }, yt = async (e) => {
     var n, o;
     (n = t.gridProps) != null && n.onPdfExport && await ((o = t.gridProps) == null ? void 0 : o.onPdfExport(e));
+  }, St = (e) => {
+    var n, o;
+    return (n = t.gridProps) != null && n.onCsvExport ? (o = t.gridProps) == null ? void 0 : o.onCsvExport(e) : e;
   }, me = (e, n) => {
     const o = n.nativeEvent ? n : { nativeEvent: n.nativeEvent || n.originalEvent };
     let r = {};
-    t.isVirtualScroll && e.length && !t.gridProps.pageable && (r = { take: void 0 }), e.length === 0 && t.gridProps.navigatable && (ve.current = !0), B(
+    t.isVirtualScroll && e.length && !t.gridProps.pageable && (r = { take: void 0 }), e.length === 0 && t.gridProps.navigatable && (be.current = !0), B(
       t.gridProps.onGroupChange,
       { group: e },
       { group: e, skip: 0, ...r },
       o
     );
-  }, he = (e) => {
+  }, Pe = (e) => {
     if (t.gridProps.onColumnsStateChange) {
       const n = {
-        target: y.current,
+        target: x.current,
         columnsState: e
       };
       g(t.gridProps.onColumnsStateChange, n);
     }
   }, ne = (e, n, o) => {
-    const { columnsRef: r, columnsState: i } = t, a = r[e], c = bn(i), f = a.depth, l = (m) => {
+    const { columnsRef: r, columnsState: i } = t, a = r[e], c = En(i), f = a.depth, l = (m) => {
       do
         m++;
       while (m < r.length && r[m].depth > f);
       return m;
     }, u = r.splice(e, l(e) - e);
-    r.splice(e < n ? l(n - u.length) : n, 0, ...u), r.filter((m) => m.declarationIndex >= 0).forEach((m, S) => {
-      m.orderIndex = S;
+    r.splice(e < n ? l(n - u.length) : n, 0, ...u), r.filter((m) => m.declarationIndex >= 0).forEach((m, k) => {
+      m.orderIndex = k;
       const z = c.find((Y) => Y.id === m.id);
-      z && (z.orderIndex = S);
+      z && (z.orderIndex = k);
     });
     const s = r[e].locked && r[n].locked;
-    pt(t.columnsMapRef, r, s || ce.current), en(t.columnsMapRef, r, s || ce.current), be.current && (ce.current = !1, be.current = !1);
-    const v = ee();
-    if (U(), t.gridProps.onColumnReorder) {
+    rn(t.columnsMapRef, r, s || ce.current), on(t.columnsMapRef, r, s || ce.current), ve.current && (ce.current = !1, ve.current = !1);
+    const b = ee();
+    if (N(), t.gridProps.onColumnReorder) {
       const m = {
-        target: y.current,
-        columns: v,
+        target: x.current,
+        columns: b,
         columnId: a.id,
         nativeEvent: o
       };
       g(t.gridProps.onColumnReorder, m);
     }
-    he(i);
+    Pe(i);
   }, J = (e, n, o) => {
     const r = typeof t.gridProps.rowReorderable == "object" ? t.gridProps.rowReorderable.enabled : t.gridProps.rowReorderable;
     if (o === "forbidden" || !r || !X.current)
@@ -632,45 +642,45 @@ const kn = (t, E, P, D) => {
       dropPosition: o,
       nativeEvent: e.originalEvent,
       dragEvent: e,
-      target: y.current
+      target: x.current
     }), X.current = null;
-  }, wt = (e, n, o) => {
+  }, kt = (e, n, o) => {
     if (t.gridProps.group === void 0)
       return;
     const r = t.gridProps.group.slice();
     r.splice(n, 0, ...r.splice(e, 1)), me(r, o);
-  }, Ge = (e, n, o) => {
+  }, Fe = (e, n, o) => {
     const r = t.columnsRef[e].field;
     if (!r)
       return;
     const i = (t.gridProps.group || []).slice();
     i.splice(n, 0, { field: r }), me(i, o);
-  }, yt = (e, n) => {
+  }, Dt = (e, n) => {
     const o = H.current.getCurrentGroupsLength;
-    Ge(e, o, n);
-  }, Pe = () => {
+    Fe(e, o, n);
+  }, he = () => {
     var o, r, i, a, c, f;
     if (t.gridProps.dataLayoutMode === "stacked") {
       const l = ((o = M.current) == null ? void 0 : o.offsetWidth) || 0;
-      if ((r = C.current) != null && r.colGroupMain && l) {
-        const u = C.current.colGroupMain.children, s = u.length - 1;
+      if ((r = I.current) != null && r.colGroupMain && l) {
+        const u = I.current.colGroupMain.children, s = u.length - 1;
         if (s >= 0) {
-          let v = 0;
-          for (let S = 0; S < s; S++) {
-            const z = parseFloat((u[S].width || 0).toString()) || u[S].clientWidth;
-            v += z;
+          let b = 0;
+          for (let k = 0; k < s; k++) {
+            const z = parseFloat((u[k].width || 0).toString()) || u[k].clientWidth;
+            b += z;
           }
-          const m = Math.max(0, l - v);
-          u[s].width = m + "px", (a = (i = C.current.colGroupHeader) == null ? void 0 : i.children) != null && a[s] && (C.current.colGroupHeader.children[s].width = m + "px"), (f = (c = C.current.colGroupFooter) == null ? void 0 : c.children) != null && f[s] && (C.current.colGroupFooter.children[s].width = m + "px");
+          const m = Math.max(0, l - b);
+          u[s].width = m + "px", (a = (i = I.current.colGroupHeader) == null ? void 0 : i.children) != null && a[s] && (I.current.colGroupHeader.children[s].width = m + "px"), (f = (c = I.current.colGroupFooter) == null ? void 0 : c.children) != null && f[s] && (I.current.colGroupFooter.children[s].width = m + "px");
         }
       }
       F.current && F.current.setWidth(l), L.current && L.current.setWidth(l), A.current && (A.current.style.width = l ? l + "px" : "");
       return;
     }
     let e = 0;
-    if (!C.current.colGroupMain)
+    if (!I.current.colGroupMain)
       return;
-    const n = C.current.colGroupMain.children;
+    const n = I.current.colGroupMain.children;
     for (let l = 0; l < n.length; l++) {
       const u = n[l].width;
       if (!u) {
@@ -680,22 +690,22 @@ const kn = (t, E, P, D) => {
       e += parseFloat(u.toString());
     }
     e = Math.round(e), F.current && F.current.setWidth(e), L.current && L.current.setWidth(e), A.current && (A.current.style.width = e ? e + "px" : "");
-  }, Ae = () => {
+  }, ze = () => {
     var e;
     t.gridProps.widthRef && (t.gridProps.widthRef.current = ((e = M.current) == null ? void 0 : e.offsetWidth) || 0);
   }, re = () => {
     var e;
     t.gridProps.containerHeightRef && (t.gridProps.containerHeightRef.current = ((e = G.current) == null ? void 0 : e.offsetHeight) || 0);
-  }, xt = () => {
+  }, Kt = () => {
     const e = t.gridProps.minRowHeightRef;
     if (e && !e.current && !t.gridProps.rowHeight) {
-      const n = Pn(q.current);
-      n && (e.current = n, U());
+      const n = Cn(j.current);
+      n && (e.current = n, N());
     }
   }, oe = d.useCallback(
     (e, n, o, r, i) => {
       var l;
-      if (!St() && !o || !e)
+      if (!Mt() && !o || !e)
         return;
       const a = {
         type: e,
@@ -706,13 +716,13 @@ const kn = (t, E, P, D) => {
         field: i,
         ...typeof t.gridProps.clipboard != "boolean" ? t.gridProps.clipboard : {},
         ...o
-      }, c = w(), f = Xt({
+      }, c = w(), f = pt({
         event: a,
         data: c,
         selectedState: (l = t.gridProps.select) != null ? l : {},
-        previousCopiedItems: We.current
+        previousCopiedItems: Ve.current
       });
-      e !== ke.paste && (We.current = f.copiedItems), t.gridProps.onClipboard && E && g(t.gridProps.onClipboard, {
+      e !== ke.paste && (Ve.current = f.copiedItems), t.gridProps.onClipboard && E && g(t.gridProps.onClipboard, {
         ...a,
         ...f
       });
@@ -724,14 +734,14 @@ const kn = (t, E, P, D) => {
       t.gridProps.clipboard,
       t.gridProps.onClipboard
     ]
-  ), St = () => {
+  ), Mt = () => {
     var i, a, c;
     if (!Q)
       return !1;
-    const e = jt(K()), n = e ? e.matches(".k-table-td") ? e : (i = K()) == null ? void 0 : i.body : (a = K()) == null ? void 0 : a.body, o = n.closest(".k-grid-container"), r = n && ((c = M.current) == null ? void 0 : c.contains(n));
+    const e = Jt(K()), n = e ? e.matches(".k-table-td") ? e : (i = K()) == null ? void 0 : i.body : (a = K()) == null ? void 0 : a.body, o = n.closest(".k-grid-container"), r = n && ((c = M.current) == null ? void 0 : c.contains(n));
     return !!(n && r && o);
-  }, Le = (e, n, o, r, i, a, c) => {
-    Pe(), ce.current = !0, be.current = !0, t.gridProps.onColumnResize && E && g(t.gridProps.onColumnResize, {
+  }, Oe = (e, n, o, r, i, a, c) => {
+    he(), ce.current = !0, ve.current = !0, t.gridProps.onColumnResize && E && g(t.gridProps.onColumnResize, {
       columns: ee(),
       nativeEvent: r,
       targetColumnId: c,
@@ -739,9 +749,9 @@ const kn = (t, E, P, D) => {
       newWidth: n,
       oldWidth: o,
       end: i,
-      target: y.current
-    }), i && he(a);
-  }, kt = () => {
+      target: x.current
+    }), i && Pe(a);
+  }, Ht = () => {
     var e;
     return {
       filter: t.gridProps.filter,
@@ -753,8 +763,8 @@ const kn = (t, E, P, D) => {
   }, R = (e) => ({
     nativeEvent: e && e.nativeEvent,
     syntheticEvent: e,
-    target: y.current
-  }), Dt = (e) => ({
+    target: x.current
+  }), Tt = (e) => ({
     ...e,
     nativeEvent: void 0,
     syntheticEvent: void 0,
@@ -766,15 +776,15 @@ const kn = (t, E, P, D) => {
       e(n);
       return;
     }
-    e(Dt(n));
-  }, Kt = () => {
+    e(Tt(n));
+  }, Gt = () => {
     var e, n, o;
-    if (q.current && ((e = q.current) == null ? void 0 : e.getElementsByClassName("k-grid-edit-row").length) > 0) {
-      Ce.current = !1, (n = document.activeElement) != null && n.closest(".k-grid-edit-row") ? Ie.current = document.activeElement : Ie.current = void 0;
-      const r = Array.from((o = q.current) == null ? void 0 : o.getElementsByClassName("k-grid-edit-row"));
-      r.length > xe.current.length ? de.current = r.filter(
-        (i) => !xe.current.includes(i)
-      )[0] : r.length === 1 && (de.current = r[0], Ce.current = !0), xe.current = r;
+    if (j.current && ((e = j.current) == null ? void 0 : e.getElementsByClassName("k-grid-edit-row").length) > 0) {
+      Ie.current = !1, (n = document.activeElement) != null && n.closest(".k-grid-edit-row") ? Ce.current = document.activeElement : Ce.current = void 0;
+      const r = Array.from((o = j.current) == null ? void 0 : o.getElementsByClassName("k-grid-edit-row"));
+      r.length > ye.current.length ? de.current = r.filter(
+        (i) => !ye.current.includes(i)
+      )[0] : r.length === 1 && (de.current = r[0], Ie.current = !0), ye.current = r;
     }
   }, w = () => t.dataRef.filter((e) => e.rowType === "data").map((e) => e.dataItem), K = () => {
     var e;
@@ -783,57 +793,57 @@ const kn = (t, E, P, D) => {
   }, ie = () => M.current, Re = d.useCallback(
     (e) => {
       var r, i;
-      if (!b.current || !((r = b.current) != null && r.container) || t.gridProps.scrollable === "none")
+      if (!v.current || !((r = v.current) != null && r.container) || t.gridProps.scrollable === "none")
         return;
-      j.current && j.current.disconnect();
+      U.current && U.current.disconnect();
       const { rowIndex: n } = e, o = ie();
-      if (x) {
-        const a = ((i = b.current.rowHeightService) == null ? void 0 : i.offset(n)) || 0;
-        b.current.container.scroll(0, a);
+      if (S) {
+        const a = ((i = v.current.rowHeightService) == null ? void 0 : i.offset(n)) || 0;
+        v.current.container.scroll(0, a);
       } else if (o) {
         const a = n < 1 ? o.querySelector("tbody > tr:nth-child(1)") : o.querySelector(`tbody > tr:nth-child(${n + 1})`);
         a && G.current && (G.current.scrollTop = a.offsetTop);
       }
     },
     [t.gridProps.scrollable]
-  ), Fe = (e) => JSON.stringify(e.map((n) => ({ id: n.id, field: n.field, title: n.title, children: n.children }))), Mt = () => Fe(Ot) === Fe(t.columnsRef), Ht = () => {
-    le.current = window.innerWidth, Mt() || U();
-  }, Tt = () => {
+  ), We = (e) => JSON.stringify(e.map((n) => ({ id: n.id, field: n.field, title: n.title, children: n.children }))), At = () => We(Vt) === We(t.columnsRef), Lt = () => {
+    le.current = window.innerWidth, At() || N();
+  }, Ft = () => {
     var a;
-    const { virtualTotal: e, virtualPageSize: n, gridProps: o } = t, r = b.current, i = t.gridProps.rowHeight || ((a = o.minRowHeightRef) == null ? void 0 : a.current) || 0;
-    r && (r.fixedScroll = o.fixedScroll || !1, r.PageChange = mt, r.pageSize = n, r.scrollableVirtual = x, r.container = G.current, r.tableBody = q.current, r.scrollHeightContainer = Oe.current, r.table = A.current, (!r.rowHeightService || r.total !== e) && i && (r.total = e, r.rowHeightService = new $t(e, i)));
-  }, ze = d.useCallback(
+    const { virtualTotal: e, virtualPageSize: n, gridProps: o } = t, r = v.current, i = t.gridProps.rowHeight || ((a = o.minRowHeightRef) == null ? void 0 : a.current) || 0;
+    r && (r.fixedScroll = o.fixedScroll || !1, r.PageChange = Rt, r.pageSize = n, r.scrollableVirtual = S, r.container = G.current, r.tableBody = j.current, r.scrollHeightContainer = Ne.current, r.table = A.current, (!r.rowHeightService || r.total !== e) && i && (r.total = e, r.rowHeightService = new Qt(e, i)));
+  }, Be = d.useCallback(
     (e) => {
-      const n = { rowIndex: ye.current };
+      const n = { rowIndex: xe.current };
       e.forEach((o) => {
         o.boundingClientRect.height !== o.intersectionRect.height && Re(n);
       });
     },
     [Re]
-  ), U = () => {
+  ), N = () => {
     t.gridProps.forceUpdate && t.gridProps.forceUpdate();
-  }, Gt = (e) => e.left !== void 0 ? Se !== "rtl" ? { left: e.left, right: e.right } : { left: e.right, right: e.left } : {}, y = d.useRef(null), b = d.useRef(void 0), C = d.useRef(void 0), H = d.useRef(void 0), T = d.useRef(void 0), V = d.useRef(void 0), ae = d.useRef(void 0), j = d.useRef(null), q = d.useRef(null), At = d.useRef(null), G = d.useRef(null), A = d.useRef(null), Lt = d.useRef(null), M = d.useRef(null), Oe = d.useRef(null), L = d.useRef(null), F = d.useRef(null), be = d.useRef(!1), ve = d.useRef(!1), de = d.useRef(void 0), Ie = d.useRef(void 0), Ce = d.useRef(!1), ce = d.useRef(!0), Ee = d.useRef(0), we = d.useRef(void 0), ye = d.useRef(void 0), xe = d.useRef([]), We = d.useRef([]), le = d.useRef(0), X = d.useRef(null), Ft = d.useRef(null), zt = d.useRef(null), Se = qt(M), x = t.isVirtualScroll, Ot = d.useMemo(() => d.Children.toArray(t.gridProps.children), [t.gridProps.children]), Ne = t.gridProps.groupable === !0 || typeof t.gridProps.groupable == "object" && t.gridProps.groupable.enabled !== !1, h = se(t.gridProps.selectable), Be = Yt(t.gridProps.editable), Wt = le.current && $ && le.current <= $.medium && t.gridProps.adaptive;
+  }, zt = (e) => e.left !== void 0 ? Se !== "rtl" ? { left: e.left, right: e.right } : { left: e.right, right: e.left } : {}, x = d.useRef(null), v = d.useRef(void 0), I = d.useRef(void 0), H = d.useRef(void 0), T = d.useRef(void 0), V = d.useRef(void 0), ae = d.useRef(void 0), U = d.useRef(null), j = d.useRef(null), Ot = d.useRef(null), G = d.useRef(null), A = d.useRef(null), Wt = d.useRef(null), M = d.useRef(null), Ne = d.useRef(null), L = d.useRef(null), F = d.useRef(null), ve = d.useRef(!1), be = d.useRef(!1), de = d.useRef(void 0), Ce = d.useRef(void 0), Ie = d.useRef(!1), ce = d.useRef(!0), Ee = d.useRef(0), we = d.useRef(void 0), xe = d.useRef(void 0), ye = d.useRef([]), Ve = d.useRef([]), le = d.useRef(0), X = d.useRef(null), Bt = d.useRef(null), Nt = d.useRef(null), Se = Xt(M), S = t.isVirtualScroll, Vt = d.useMemo(() => d.Children.toArray(t.gridProps.children), [t.gridProps.children]), Ue = t.gridProps.groupable === !0 || typeof t.gridProps.groupable == "object" && t.gridProps.groupable.enabled !== !1, P = se(t.gridProps.selectable), je = en(t.gridProps.editable), Ut = le.current && _ && le.current <= _.medium && t.gridProps.adaptive;
   return d.useMemo(() => {
-    _.onConstructor({
+    q.onConstructor({
       navigatable: !!t.gridProps.navigatable,
       contextStateRef: T,
       navigationStateRef: V,
       idPrefix: t.id
-    }), b.current = new In();
+    }), v.current = new xn();
   }, []), d.useMemo(() => {
     var e;
-    (e = b.current) == null || e.reset();
+    (e = v.current) == null || e.reset();
   }, [
     t.gridProps.scrollable,
     t.gridProps.total,
     t.gridProps.filter,
     t.gridProps.group,
-    Ne,
+    Ue,
     t.gridProps.sort,
     t.gridProps.rowHeight
-  ]), d.useEffect(() => (t.gridProps.clipboard && (ae.current = new Qt(oe), ae.current.addEventListeners(K())), () => {
+  ]), d.useEffect(() => (t.gridProps.clipboard && (ae.current = new tn(oe), ae.current.addEventListeners(K())), () => {
     ae.current && ae.current.removeEventListeners(K());
-  }), [t.gridProps.onClipboard, t.gridProps.clipboard, oe, K]), d.useEffect(() => (Ae(), Pe(), Ue(), _.onComponentDidMount({
+  }), [t.gridProps.onClipboard, t.gridProps.clipboard, oe, K]), d.useEffect(() => (ze(), he(), qe(), q.onComponentDidMount({
     scope: M.current || void 0,
     contextStateRef: T,
     navigationStateRef: V
@@ -841,47 +851,47 @@ const kn = (t, E, P, D) => {
     clearTimeout(we.current);
   }), []), d.useEffect(() => {
     var e;
-    Ae(), Pe(), Ue(), x && (re(), xt(), (e = b.current) == null || e.update()), Kt(), _.onComponentDidUpdate({
+    ze(), he(), qe(), S && (re(), Kt(), (e = v.current) == null || e.update()), Gt(), q.onComponentDidUpdate({
       scope: M.current || void 0,
       contextStateRef: T,
       navigationStateRef: V,
-      focusFirst: ve.current,
+      focusFirst: be.current,
       newEditableRow: de.current,
-      singleEditRow: Ce.current,
-      lastActiveElement: Ie.current,
+      singleEditRow: Ie.current,
+      lastActiveElement: Ce.current,
       navigatable: t.gridProps.navigatable
-    }), ve.current = !1, de.current = void 0;
+    }), be.current = !1, de.current = void 0;
   }), d.useEffect(() => {
     if (Q) {
       const e = {
         rootMargin: "0px",
         threshold: 0.9
       };
-      j.current = window.IntersectionObserver && new window.IntersectionObserver(ze, e) || null;
+      U.current = window.IntersectionObserver && new window.IntersectionObserver(Be, e) || null;
     }
-  }, [ze]), d.useEffect(() => {
+  }, [Be]), d.useEffect(() => {
     var n;
     let e;
     return Q && window.ResizeObserver && (e = new window.ResizeObserver(() => {
-      Ht(), x && re();
+      Lt(), S && re();
     }), e.observe((n = K()) == null ? void 0 : n.body)), () => {
       e == null || e.disconnect();
     };
   }, []), d.useEffect(() => {
-    if (!Q || !window.ResizeObserver || !x || !G.current)
+    if (!Q || !window.ResizeObserver || !S || !G.current)
       return;
     const e = () => {
       var i, a;
       const o = ((i = t.gridProps.containerHeightRef) == null ? void 0 : i.current) || 0;
       re();
       const r = ((a = t.gridProps.containerHeightRef) == null ? void 0 : a.current) || 0;
-      (o === 0 && r > 0 || Math.abs(r - o) > 10) && U();
+      (o === 0 && r > 0 || Math.abs(r - o) > 10) && N();
     }, n = new window.ResizeObserver(e);
     return n.observe(G.current), () => {
       n.disconnect();
     };
-  }, [x, re]), d.useImperativeHandle(
-    y,
+  }, [S, re]), d.useImperativeHandle(
+    x,
     () => ({
       get element() {
         return ie();
@@ -892,67 +902,69 @@ const kn = (t, E, P, D) => {
       },
       scrollIntoView: (e) => {
         var r;
-        if (!((r = b.current) != null && r.container) || t.gridProps.scrollable === "none")
+        if (!((r = v.current) != null && r.container) || t.gridProps.scrollable === "none")
           return;
         const { rowIndex: n } = e;
-        ye.current = n;
+        xe.current = n;
         const o = ie();
-        if (j.current && o) {
-          j.current.disconnect();
-          const i = o.querySelector(`[absolute-row-index="${ye.current}"]`);
-          i ? j.current.observe(i) : Re(e);
+        if (U.current && o) {
+          U.current.disconnect();
+          const i = o.querySelector(`[absolute-row-index="${xe.current}"]`);
+          i ? U.current.observe(i) : Re(e);
         }
       },
       fitColumns: (e) => {
-        C.current.dblClickHandler(null, e);
+        I.current.dblClickHandler(null, e);
       },
       exportAsPdf: fe,
+      saveAsCsv: Ae,
+      getCsvBlob: Le,
       getTotal: ge,
       getLeafDataItems: w
     })
-  ), d.useImperativeHandle(t.gridRef, () => y.current), d.useMemo(() => {
-    C.current = new un(Le);
+  ), d.useImperativeHandle(t.gridRef, () => x.current), d.useMemo(() => {
+    I.current = new Pn(Oe);
   }, [t.gridProps.onColumnResize, t.columnsRef]), d.useMemo(() => {
-    H.current = new gn(ne, wt, Ge);
+    H.current = new hn(ne, kt, Fe);
   }, [
     t.gridProps.onColumnReorder,
     t.gridProps.onGroupChange,
     t.gridProps.group,
     t.columnsRef,
     t.gridProps.groupable
-  ]), C.current.resizable = t.gridProps.resizable || !1, C.current.columns = t.columnsRef, C.current.columnsState = _t(t.columnsState), H.current.reorderable = t.gridProps.reorderable || !1, H.current.groupable = Ne, H.current.columns = t.columnsRef, H.current.dir = Se, Tt(), /* @__PURE__ */ d.createElement(
-    xn.Provider,
+  ]), I.current.resizable = t.gridProps.resizable || !1, I.current.columns = t.columnsRef, I.current.columnsState = Yt(t.columnsState), H.current.reorderable = t.gridProps.reorderable || !1, H.current.groupable = Ue, H.current.columns = t.columnsRef, H.current.dir = Se, Ft(), /* @__PURE__ */ d.createElement(
+    Mn.Provider,
     {
       value: {
         isClient: E,
         rowReorder: J,
         activeDragRowDataItemRef: X,
-        reorderRowDragTargetRef: Ft,
-        reorderRowDropTargetRef: zt,
+        reorderRowDragTargetRef: Bt,
+        reorderRowDropTargetRef: Nt,
         dir: Se,
-        getCellPositionStyle: Gt,
+        getCellPositionStyle: zt,
         dataItemKey: t.gridProps.dataItemKey,
         columnsState: t.columnsState,
         columnsRef: t.columnsRef,
         hiddenColumnsRef: t.hiddenColumnsRef,
-        onColumnsStateChange: he,
+        onColumnsStateChange: Pe,
         groupable: t.gridProps.groupable,
         group: t.gridProps.group,
         reorderable: t.gridProps.reorderable,
         defaultGroup: t.gridProps.defaultGroup,
         groupChange: me,
-        selectionRelease: lt,
-        pagerPageChange: bt,
-        onContextMenu: $e,
-        rowClick: Ze,
-        rowDblClick: pe,
-        cellClick: nt,
-        headerCellClick: Me,
-        itemChange: it,
-        onDialogEditCancel: tt,
-        onDialogEditSubmit: et,
+        selectionRelease: gt,
+        pagerPageChange: It,
+        onContextMenu: Ye,
+        rowClick: tt,
+        rowDblClick: nt,
+        cellClick: it,
+        headerCellClick: He,
+        itemChange: ct,
+        onDialogEditCancel: ot,
+        onDialogEditSubmit: rt,
         columnReorder: ne,
-        onResize: Le,
+        onResize: Oe,
         getTotal: ge,
         sortable: t.gridProps.sortable,
         pageable: t.gridProps.pageable,
@@ -961,71 +973,83 @@ const kn = (t, E, P, D) => {
         skip: t.gridProps.skip,
         take: t.gridProps.take,
         defaultSort: t.gridProps.defaultSort,
-        sortChange: He,
+        sortChange: Te,
         filterable: t.gridProps.filterable,
         filter: t.gridProps.filter,
         defaultFilter: t.gridProps.defaultFilter,
-        filterOperators: t.gridProps.filterOperators || Sn,
+        filterOperators: t.gridProps.filterOperators || Hn,
         getLeafDataItems: w,
-        filterChange: vt,
-        applyHighlightDescriptor: It,
-        applySelectionDescriptor: gt,
+        filterChange: Et,
+        applyHighlightDescriptor: wt,
+        applySelectionDescriptor: Pt,
         highlight: t.gridProps.highlight,
         select: t.gridProps.select,
-        searchChange: Ct,
+        searchChange: xt,
         exportAsPdf: fe,
-        onHeaderSelectionChange: ct,
-        columnGroupChange: yt,
-        onKeyDown: Xe,
-        onFocus: Ye,
-        scrollHandler: Je,
-        selectionChange: at,
-        mobileMode: Wt,
+        exportAsCsv: Ae,
+        getCsvBlob: Le,
+        onHeaderSelectionChange: ut,
+        columnGroupChange: Dt,
+        onKeyDown: Ze,
+        onFocus: pe,
+        scrollHandler: Qe,
+        selectionChange: lt,
+        mobileMode: Ut,
         adaptiveColumnMenuRef: le.current,
         adpativeTitle: t.gridProps.adaptiveTitle,
         adaptive: t.gridProps.adaptive,
-        dispatchDetailExpand: rt,
-        dispatchGroupExpand: ot,
-        columnResizeRef: C,
+        dispatchDetailExpand: at,
+        dispatchGroupExpand: dt,
+        columnResizeRef: I,
         dragLogicRef: H,
         navigationStateRef: V,
         tableElementRef: A,
-        tableBodyElementRef: q,
-        headerElementRef: At,
+        tableBodyElementRef: j,
+        headerElementRef: Ot,
         containerElementRef: G,
-        headTableElementRef: Lt,
+        headTableElementRef: Wt,
         elementRef: M,
-        virtualScrollHeightContainerRef: Oe,
+        virtualScrollHeightContainerRef: Ne,
         footerRef: L,
         headerRef: F,
-        vsRef: b
+        vsRef: v
       }
     },
-    /* @__PURE__ */ d.createElement(Zt.Provider, { value: T.current }, t.children),
+    /* @__PURE__ */ d.createElement(nn.Provider, { value: T.current }, t.children),
     /* @__PURE__ */ d.createElement(
-      Cn,
+      yn,
       {
-        show: P.show && (p == null ? void 0 : p.length),
-        dataItem: P.dataItem,
-        field: P.field,
+        show: h.show && (p == null ? void 0 : p.length),
+        dataItem: h.dataItem,
+        field: h.field,
         items: p,
-        offset: P.offset,
-        onClose: W,
-        onSelect: _e
+        offset: h.offset,
+        onClose: De,
+        onSelect: Xe
       }
     ),
     t.gridProps.pdf && /* @__PURE__ */ d.createElement(
-      yn,
+      Dn,
       {
         gridProps: t.gridProps,
         innerGrid: t.innerGrid,
         pdf: typeof t.gridProps.pdf == "object" ? t.gridProps.pdf : {},
-        onPdfExport: Et,
+        onPdfExport: yt,
         ref: (e) => O.current = e
       }
+    ),
+    t.gridProps.csv && /* @__PURE__ */ d.createElement(
+      Kn,
+      {
+        gridProps: t.gridProps,
+        csv: typeof t.gridProps.csv == "object" ? t.gridProps.csv : {},
+        onCsvExport: St,
+        columnsState: t.columnsState,
+        ref: (e) => y.current = e
+      }
     )
   );
 };
 export {
-  Un as GridClientWrapper
+  Jn as GridClientWrapper
 };