@progress/kendo-react-grid
Version:
React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package
621 lines (620 loc) • 24.9 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
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 { 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 { 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 { 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(
u,
t,
o,
{ index: n },
d !== void 0,
i,
l,
Et.defaultExpand,
c
);
return { flattedData: u, resolvedGroupsCount: N };
}, it = (t) => {
const o = t.filter(
(n) => n && n.type && n.type.displayName === "KendoReactGridColumn"
);
return el(o, I, { prevId: 0, idPrefix: R });
}, dt = () => {
const t = [], o = (n, d) => n == null ? void 0 : n.forEach((i) => {
const l = i.hidden || d;
t.push({
...i,
hidden: l
}), o(i.children, l);
});
return o(I, !1), t;
}, ct = (t) => {
const o = dt();
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,
e.group,
{
column: P.column
},
{
prevId: 0,
idPrefix: R
}
)), st(m, o), m = ct(m), H = Qt(m, !0), ie = m.map(Xt);
}, ut = (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) => {
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;
});
const n = Yt(I);
ut(t, n);
const d = {
id: "",
resizable: !0,
width: "32px",
title: " ",
declarationIndex: -1,
orderIndex: -1,
children: [],
parentIndex: -1,
depth: 0,
colSpan: 0,
headerColSpan: 0,
rowSpan: 0,
left: 0,
right: 0,
index: 0,
rightBorder: !1,
ariaColumnIndex: 0,
isAccessible: !0
};
let i = 0;
if (P.enabled && e.detail) {
const l = {
...d,
_type: "expand",
id: O.generateNavigatableId(`${i++}`, "expand", "column"),
defaultCell: e.isClient ? Ot : kl,
field: P.column,
headerClassName: f(s.hierarchyCell({}))
};
t.unshift(l), I.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,
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.slice(i).forEach((l) => {
l.parentIndex >= 0 && (l.parentIndex += i), l.rowSpannable = l.rowSpannable !== void 0 ? je(l.rowSpannable) : se;
});
}, re = () => e.isClient ? m : ie, ne = (t) => {
const o = [];
let n = null, d = 0;
if (g.forEach((i, l) => {
const c = parseFloat((i.width || "").toString()) || 10;
if (d) {
d--, n && (n.width += c);
return;
}
const u = Math.min(Zt(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({
cellModels: o,
columns: g,
tableViewPortWidth: l,
scrollLeft: i
});
}
return o;
}, ft = () => {
const { pageable: t, take: o, pageSize: n } = e;
if (!w)
return 0;
if (!t) {
if (o)
return o;
if (n)
return n;
}
const d = e.rowHeight || Ct.current, i = ht.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 ? {
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
),
...t ? {
take: e.pageable ? e.take || 10 : e.take,
skip: e.skip || 0
} : {}
});
h = o, v = (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(
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,
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) {
let t = e.skip || 0;
(de || e.pageable) && (t = U, 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);
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(
(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,
{
size: E,
staticHeaders: e.scrollable !== "none",
draggable: e.reorderable || V,
headerRow: /* @__PURE__ */ a.createElement(
Vt,
{
cells: e.cells,
sort: e.sort,
sortable: e.sortable,
group: e.group || [],
groupable: V,
filter: e.filter,
filterable: e.filterable,
filterOperators: e.filterOperators || Qe,
columnMenu: e.columnMenu,
columnMenuIcon: e.columnMenuIcon,
columns: m,
columnsMap: H,
navigatable: !!e.navigatable,
localization: _,
unstyled: G,
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
))
}
),
filterRow: e.filterable && /* @__PURE__ */ a.createElement(
Wt,
{
cells: e.cells,
size: E,
columns: m,
filter: e.filter,
filterOperators: e.filterOperators || Qe,
sort: e.sort,
navigatable: !!e.navigatable,
ariaRowIndex: H.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) => {
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 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 } : {};
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 ee = r._type === "expand", F = {
locked: e.lockGroups,
id: O.generateNavigatableId(
`${o}-${String(u)}`,
R,
ee || t.rowType === "groupHeader" || t.rowType === "groupFooter" || r.field === "value" ? "nodata" : "cell"
),
colSpan: N,
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,
columnsCount: g.length,
rowType: t.rowType,
level: t.level,
expanded: t.expanded,
dataIndex: t.dataIndex,
rowDataIndex: n,
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),
isInEdit: B,
isAlt: d,
unstyled: G,
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 });
}),
isInEdit: l,
isSelected: typeof c == "boolean" && c
};
};
let xt = 0, X = null;
const we = (t) => t >= b.length - xt, Y = [], Ee = !b.length;
let K = 0;
if (b.length) {
const t = H.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;
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(
/* @__PURE__ */ a.createElement(
ll,
{
key: C,
dataItem: l.dataItem,
isAltRow: u,
isInEdit: y.isInEdit && !Q,
rowType: l.rowType,
isRowReorderable: x,
isHidden: we(c),
onClick: null,
onDoubleClick: null,
rowHeight: e.rowHeight,
ariaRowIndex: K,
absoluteRowIndex: r,
dataIndex: n,
isSelected: y.isSelected,
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(
/* @__PURE__ */ a.createElement(
"tr",
{
key: A,
className: f(s.detailTr({ isAlt: u })),
style: {
visibility: we(c) ? "hidden" : "",
height: e.detailRowHeight
},
role: "row",
"aria-rowindex": K
},
e.group && e.group.map((ee, 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 } : {};
return /* @__PURE__ */ a.createElement(
qe,
{
key: F,
cellProps: {
id: "",
dataItem: l.dataItem,
field: ee.field,
dataIndex: l.dataIndex,
columnPosition: j,
style: {},
ariaColumnIndex: 1 + F,
isSelected: !1,
locked: e.lockGroups,
cells: e.cells,
group: l.group
}
}
);
}),
P.enabled && /* @__PURE__ */ a.createElement(
il,
{
unstyled: G,
id: O.generateNavigatableId(`${A}-dhcell`, R)
}
),
/* @__PURE__ */ a.createElement(
B,
{
dataItem: l.dataItem,
dataIndex: l.dataIndex,
colSpan: p,
ariaColIndex: 2 + (e.group ? e.group.length : 0),
detail: e.detail,
id: O.generateNavigatableId(`${A}-dcell`, R)
}
)
)
);
}
});
}
const Se = {
size: E,
total: v,
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) => {
var o;
return !!((o = t.cells) != null && o.footerCell);
}) ? /* @__PURE__ */ a.createElement(
jt,
{
size: E,
staticHeaders: e.scrollable !== "none",
row: /* @__PURE__ */ a.createElement(
rl,
{
cells: e.cells,
idPrefix: R,
columns: m,
ariaRowIndex: K + 1
}
),
cols: g.map(kt)
}
) : null, Re = /* @__PURE__ */ a.createElement(dl, null, g.map((t, o) => /* @__PURE__ */ a.createElement(
"col",
{
key: o.toString(),
className: Ue(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(
"tbody",
{
role: "rowgroup",
className: f(s.tbody({})),
...Mt
},
Y
), ke = X ? /* @__PURE__ */ a.createElement(Il, { columns: g, customEditDialog: e.editDialog, dataItem: X }) : null;
let Z = xe;
x && (Z = /* @__PURE__ */ a.createElement(
bl,
{
unstyled: s,
columns: m,
rowReorderSettings: e.rowReorderable
},
xe
));
const Ne = {
gridRef: nt,
innerGrid: e.innerGrid,
gridProps: Nt,
columnsRef: re(),
columnsMapRef: H,
columnsState: I,
dataRef: b,
id: T,
virtualTotal: me,
isAllData: z,
virtualPageSize: ce,
isVirtualScroll: w,
detailExpandable: !!e.detail
};
return e.scrollable === "none" ? /* @__PURE__ */ a.createElement(Ze, { ...Ne }, /* @__PURE__ */ a.createElement(lt, null, /* @__PURE__ */ a.createElement(
"div",
{
id: e.id,
style: e.style,
className: f(s.wrapper({ size: E }), e.className),
...$e
},
ge,
he,
/* @__PURE__ */ a.createElement(
cl,
{
selectable: e.selectable,
className: f(s.table({ size: E }))
},
Re,
Ce,
/* @__PURE__ */ a.createElement(tt, { rowReorderable: x }, Z),
ve
),
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(
"div",
{
id: e.id,
style: e.style,
className: f(
s.wrapper({
size: E,
virtual: w
}),
e.className
),
...$e
},
ge,
he,
/* @__PURE__ */ a.createElement(
"div",
{
className: f(s.ariaRoot({})),
role: "grid",
"aria-colcount": g.length,
"aria-rowcount": v,
id: T,
"aria-label": _.toLanguageString(at, gl[at])
},
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,
{
selectable: e.selectable,
tableClassName: f(
s.table({
size: E
})
),
tableStyle: { userSelect: vt }
},
Re,
/* @__PURE__ */ a.createElement(tt, { rowReorderable: x }, Z)
), Ee && /* @__PURE__ */ a.createElement(Ye, null, $.length ? $ : /* @__PURE__ */ a.createElement(Je, null))), w && /* @__PURE__ */ a.createElement(
"div",
{
className: f(s.heightContainer({})),
role: "presentation"
},
/* @__PURE__ */ a.createElement(fl, { isVirtualScroll: w })
)))),
ve,
Ge && /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(pe, null), /* @__PURE__ */ a.createElement(et, null)),
fe && /* @__PURE__ */ a.createElement(We, null)
),
be,
e.pageable && Ie,
/* @__PURE__ */ a.createElement(rt, { loader: e.loader, showLoader: e.showLoader }),
ke
)));
});
Hl.displayName = "KendoReactGridComponent";
export {
Hl as GridComponent
};