@progress/kendo-react-grid
Version:
React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package
658 lines (657 loc) • 26.5 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import * as n from "react";
import { uGrid as Wt, hasValidLicense as At, getLicenseMessage as Ft, validatePackage as Ot, getter as Y, classNames as c, WatermarkOverlay as $e } from "@progress/kendo-react-common";
import { getDetailExpandableOptions as _t, getGroupExpandableOptions as Vt, getSelectionOptions as jt, tableKeyboardNavigationTools as j, Pager as $t, tableKeyboardNavigationBodyAttributes as Zt, tableKeyboardNavigationScopeAttributes as Ze } from "@progress/kendo-react-data-tools";
import { GridHierarchyCell as Ut } from "./cells/hierarchycell/GridHierarchyCell.mjs";
import { Header as qt } from "./header/Header.mjs";
import { HeaderRow as Jt } from "./header/HeaderRow.mjs";
import { FilterRow as Qt } from "./header/FilterRow.mjs";
import { GroupPanel as Xt } from "./header/GroupPanel.mjs";
import { Footer as Yt } from "./footer/Footer.mjs";
import { isRowReorderEnabled as pt, getRowSpanOptions as Ue, getColumnWidth as p, isSorted as ea, flatData as ta, autoGenerateColumns as aa, mapColumns as la, clientColumn as na, getColSpan as ia, readColumns as ra, getFlatColumnsState as oa, getColumnState as ee } from "./utils/index.mjs";
import { normalizeAutoProcessData as da, processData as sa } from "./utils/dataProcessing.mjs";
import { orderBy as qe } from "@progress/kendo-data-query";
import { GridGroupCell as ma } from "./cells/groupcell/GridGroupCell.mjs";
import { GridHeaderGroupSpacerCell as ca } from "./header/GridHeaderGroupSpacerCell.mjs";
import { GridHeaderSelectionCell as ua } from "./header/GridHeaderSelectionCell.mjs";
import { GridNoRecords as Je } from "./components/noRecords/GridNoRecords.mjs";
import { operators as Qe } from "./filterCommon.mjs";
import { FooterRow as fa } from "./footer/FooterRow.mjs";
import { normalize as ga } from "./paging/GridPagerSettings.mjs";
import { packageMetadata as te } from "./package-metadata.mjs";
import { GridDetailCell as ba } from "./cells/detailcell/GridDetailCell.mjs";
import { GridNoRecordsContainer as Xe } from "./components/noRecords/GridNoRecordsContainer.mjs";
import { GridClientWrapper as Ye } from "./GridClientWrapper.mjs";
import { GridColGroup as ha } from "./components/colGroup/GridColGroup.mjs";
import { GridTable as wa } 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 Ca } from "./components/PagerContainer.mjs";
import { GridTableScrollable as Ra } from "./components/table/GridTableScrollable.mjs";
import { GridElementContainer as at } from "./components/GridElementContainer.mjs";
import { GridContainerElementContainer as ya } from "./components/GridContainerElementContainer.mjs";
import { VirtualScrollHeightContainer as Ea } from "./components/VirtualScrollHeightContainer.mjs";
import { gridAriaLabel as lt, messages as Sa } from "./messages/index.mjs";
import { GridReorderableRowsContainer as va } from "./components/GridDraggableRowsContainer.mjs";
import { GridRowReorderCell as Ga } from "./cells/rowreordercell/GridRowReorderCell.mjs";
import { GridHeaderRowReorderCell as Ia } from "./header/client/GridHeaderRowReorderCell.mjs";
import { GridLoader as nt } from "./components/GridLoader.mjs";
import { gridPremiumFeatures as ka } from "./utils/premium.mjs";
import { LocalizationService as xa, IntlService as Ha } from "@progress/kendo-react-intl";
import { getVirtualCellsToRender as La } from "./utils/virtualColumns.mjs";
import { GridEditDialog as Na } from "./components/GridEditDialog.mjs";
import { GridSelectionCellServer as Da } from "./cells/selectioncell/GridSelectionCellServer.mjs";
import { GridSelectionCell as Ta } from "./cells/selectioncell/GridSelectionCell.mjs";
import { GridHierarchyCellServer as Pa } from "./cells/hierarchycell/GridHierarchyCellServer.mjs";
import { GridRowReorderCellServer as Ba } from "./cells/rowreordercell/GridRowReorderCellServer.mjs";
import { GridDetailCellServer as Ma } from "./cells/detailcell/GridDetailCellServer.mjs";
import { GridGroupCellServer as za } from "./cells/groupcell/GridGroupCellServer.mjs";
import { GridPinCell as Ka } from "./cells/pincell/GridPinCell.mjs";
import { GridPinCellServer as Wa } from "./cells/pincell/GridPinCellServer.mjs";
import { GridHeaderPinCell as Aa } from "./header/client/GridHeaderPinCell.mjs";
import { StackedModeColGroup as Fa } from "./stacked/StackedModeComponents.mjs";
import { GridRowRenderer as Oa } from "./rows/GridRowRenderer.mjs";
import { GridDetailRowRenderer as _a } from "./rows/GridDetailRowRenderer.mjs";
import { StickyGroupTable as it } from "./components/StickyGroupTable.mjs";
import { PinnedRowsTable as rt } from "./components/PinnedRowsTable.mjs";
import { getRowContents as Va } from "./getRowContents.mjs";
const ja = n.forwardRef((e, ot) => {
var Ne, De, Te, Pe, Be, Me, ze, Ke, We, Ae, Fe, Oe, _e, Ve;
const L = e.id + "-role-element-id", y = e.navigatable ? L : "";
let w = e.columnsState || [];
const dt = (t, i, r, o, a, l, d) => {
const h = [], F = ta(
h,
t,
i,
{ index: r },
o !== void 0,
a,
l,
Gt.defaultExpand,
d
);
return { flattedData: h, resolvedGroupsCount: F };
}, st = (t) => {
const i = t.filter(
(r) => r && r.type && r.type.displayName === "KendoReactGridColumn"
);
return ra(i, w, { prevId: 0, idPrefix: y });
}, mt = () => {
const t = [], i = (r, o) => r == null ? void 0 : r.forEach((a) => {
const l = a.hidden || o;
t.push({
...a,
hidden: l
}), i(a.children, l);
});
return i(w, !1), t;
}, ct = (t) => {
const i = mt();
return [
t.filter((r) => {
var o;
return !r.hidden && !((o = i.find((a) => a.id === r.id)) != null && o.hidden);
}),
t.filter((r) => {
var o;
return r.hidden || ((o = i.find((a) => a.id === r.id)) == null ? void 0 : o.hidden);
})
];
}, ut = (t, i) => {
s = st(t), s.filter((a) => !a.hidden).length === 0 && (s = aa(
C,
e.group,
{
column: v.column
},
{
prevId: 0,
idPrefix: y
}
)), gt(s, i);
const [r, o] = ct(s);
s = r, ne = o, N = la(s, w, !0), ie = s.map(na);
}, ft = (t, i) => {
const r = (o) => {
var l;
const a = i.find((d) => d.id === o.id);
if (a) {
const d = { ...a };
return d.children = (l = o.children) == null ? void 0 : l.map(r), d;
}
return ee(o);
};
w = t.filter((o) => o.parentIndex === -1).map(r);
}, gt = (t, i) => {
t.filter((l) => l.columnType === "checkbox").forEach((l) => {
l.width = l.width || "50px", l.defaultCell = e.isClient ? Ta : Da, l.defaultHeaderCell = ua, l._type = "edit";
}), I !== void 0 && t.filter((l) => l.columnType === "reorder").forEach((l) => {
l.width = l.width || "50px", l.defaultCell = e.isClient ? Ga : Ba, l.defaultHeaderCell = Ia, l.sortable = !1, l.filterable = !1, l.editable = !1;
}), e.pinnable && t.filter((l) => l.columnType === "pin").forEach((l) => {
l.width = l.width || "48px", l.defaultCell = e.isClient ? Ka : Wa, l.defaultHeaderCell = Aa, l.sortable = !1, l.filterable = !1, l.editable = !1;
});
const r = oa(w);
ft(t, r);
const o = {
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 a = 0;
if (v.enabled && e.detail) {
const l = {
...o,
_type: "expand",
id: j.generateNavigatableId(`${a++}`, "expand", "column"),
defaultCell: e.isClient ? Ut : Pa,
field: v.column,
headerClassName: c(m.hierarchyCell({}))
};
t.unshift(l), w.unshift(r.find((d) => d.id === l.id) || ee(l));
}
for (let l = 0; l < i; l++) {
const d = {
...o,
isAccessible: !1,
defaultCell: e.isClient ? ma : za,
defaultHeaderCell: ca,
id: j.generateNavigatableId(`${a++}`, "group", "column"),
field: "value",
locked: e.lockGroups
};
t.unshift(d), w.unshift(r.find((h) => h.id === d.id) || ee(d));
}
t.slice(a).forEach((l) => {
l.parentIndex >= 0 && (l.parentIndex += a), l.rowSpannable = l.rowSpannable !== void 0 ? Ue(l.rowSpannable) : se;
});
}, ae = () => e.isClient ? s : ie, le = (t) => {
const i = [];
let r = null, o = 0;
if (g.forEach((a, l) => {
let d = parseFloat((a.width || "").toString()) || 10;
if (typeof (a == null ? void 0 : a.width) == "number" && (a != null && a.minResizableWidth) && (a == null ? void 0 : a.width) < (a == null ? void 0 : a.minResizableWidth) && (d = a == null ? void 0 : a.minResizableWidth), typeof (a == null ? void 0 : a.width) == "number" && (a != null && a.minWidth) && (a == null ? void 0 : a.width) < (a == null ? void 0 : a.minWidth) ? d = a == null ? void 0 : a.minWidth : typeof (a == null ? void 0 : a.width) == "number" && (a != null && a.maxWidth) && (a == null ? void 0 : a.width) > (a == null ? void 0 : a.maxWidth) && (d = a == null ? void 0 : a.maxWidth), o) {
o--, r && (r.width += d);
return;
}
const h = Math.min(ia(a, t), g.length - l);
o = h - 1, r = {
width: d,
colSpan: h,
columnIndex: l
}, i.push(r);
}), e.columnVirtualization) {
const a = ht.current || 0, l = wt.current || parseFloat(((e.style || {}).width || "").toString());
return La({
cellModels: i,
columns: g,
tableViewPortWidth: l,
scrollLeft: a
});
}
return i;
}, bt = () => {
const { pageable: t, take: i, pageSize: r } = e;
if (!R)
return 0;
if (!t) {
if (i)
return i;
if (r)
return r;
}
const o = e.rowHeight || Rt.current, a = Ct.current;
return a && o ? Math.ceil(a / o * 1.5) : 0;
};
let u = [], $, s = [], ne = [], ie = [], N = [[]];
const ht = e.scrollLeftRef || { current: 0 }, wt = e.widthRef || { current: 0 }, Ct = e.containerHeightRef || { current: 0 }, Rt = e.minRowHeightRef || { current: 0 }, P = e.localization || new xa(e.language), yt = e.intl || new Ha((Ne = e.locale) != null ? Ne : "en"), G = e.unstyled, m = G && G.uGrid ? G.uGrid : Wt, I = pt(e.rowReorderable), R = e.scrollable === "virtual" || e.scrollable === void 0 && e.isClient && At(te) || !1, b = e.dataLayoutMode === "stacked", E = ((De = e.group) == null ? void 0 : De.length) || 0, re = Ft(te), k = da(e.autoProcessData);
let C, S;
if (Array.isArray(e.data) ? (C = e.data, S = (Te = e.total) != null ? Te : C.length) : (C = ((Pe = e.data) == null ? void 0 : Pe.data) || [], S = (ze = (Me = e.total) != null ? Me : (Be = e.data) == null ? void 0 : Be.total) != null ? ze : C.length), k) {
const t = sa(C, {
autoProcessData: k,
group: e.group,
sort: e.sort,
filter: e.filter,
search: e.search,
pageable: e.pageable,
take: e.take,
skip: e.skip,
total: e.total,
isVirtualScroll: R,
includePaging: !0
});
C = t.data, S = t.total;
}
const B = C.length === S, { size: f } = e, Et = typeof e.groupable == "object" && e.groupable.footer || "none", St = typeof e.groupable == "object" && !!e.groupable.stickyHeaders, vt = typeof e.groupable == "object" && !!e.groupable.stickyFooters, M = e.groupable === !0 || typeof e.groupable == "object" && e.groupable.enabled !== !1, v = _t(!!e.detail), Gt = Vt(
typeof e.groupable == "object" && e.groupable.enabled !== !1 ? e.groupable.expandable : e.groupable
), z = !!((Ke = e.group) != null && Ke.length), { resolvedGroupsCount: It, flattedData: kt } = dt(
C,
Et,
B ? 0 : e.skip || 0,
e.group,
e.detailExpand,
e.groupExpand,
e.dataItemKey
);
u = kt;
const Z = bt(), K = ((We = e.virtualSkipRef) == null ? void 0 : We.current) || 0;
let oe = S;
if (R) {
let t = e.skip || 0;
if ((z || e.pageable) && (t = K, oe = u.length), B || z || e.pageable)
if (Z === 0) {
const i = Math.min(e.take || e.pageSize || 20, u.length);
$ = u.slice(t, t + i);
} else
$ = u.slice(t, t + Z);
}
const de = jt(e.selectable), se = Ue(e.rowSpannable), xt = de && de.drag ? "none" : void 0, W = n.useMemo(() => n.Children.toArray(e.children), [e.children]);
ut(W, It);
const U = n.useMemo(() => {
const t = ka(e, s);
return {
premium: t.length > 0,
features: t
};
}, [e, s]), me = n.useMemo(() => U.premium ? !Ot(te, { component: "Grid", features: U.features }) : !1, [U.premium]), ce = W.map((t) => t && t.type && t.type.displayName === "KendoReactGridToolbar" ? n.cloneElement(t, { ...t.props, _ariaControls: L, ariaLabel: "Top toolbar" }) : null), A = W.filter((t) => t && t.type && t.type.displayName === "KendoReactGridNoRecords"), ue = W.filter(
(t) => t && t.type && t.type.displayName === "KendoReactGridStatusBar"
), g = s.filter((t) => t.children.length === 0), fe = M && !b && /* @__PURE__ */ n.createElement(Xt, { columns: ae(), group: e.group || [], ariaControls: L }), ge = b ? null : /* @__PURE__ */ n.createElement(
qt,
{
size: f,
staticHeaders: e.scrollable !== "none",
draggable: e.reorderable || M,
headerRow: /* @__PURE__ */ n.createElement(
Jt,
{
cells: e.cells,
sort: e.sort,
sortable: e.sortable,
group: e.group || [],
groupable: M,
filter: e.filter,
filterable: e.filterable,
filterOperators: e.filterOperators || Qe,
columnMenu: e.columnMenu,
columnMenuIcon: e.columnMenuIcon,
columns: s,
columnsMap: N,
navigatable: !!e.navigatable,
localization: P,
unstyled: G,
columnsState: w,
headerSelectionValue: !!(e.select && u.filter((t) => t.rowType === "data").every(
(t) => e.select && e.dataItemKey && Y(e.dataItemKey)(t.dataItem) !== void 0 ? e.select[Y(e.dataItemKey)(t.dataItem)] : void 0
))
}
),
filterRow: e.filterable && /* @__PURE__ */ n.createElement(
Qt,
{
cells: e.cells,
size: f,
columns: s,
filter: e.filter,
filterOperators: e.filterOperators || Qe,
sort: e.sort,
navigatable: !!e.navigatable,
ariaRowIndex: N.length + 1,
localization: P
}
) || void 0,
cols: g.map((t, i) => /* @__PURE__ */ n.createElement("col", { key: i.toString(), width: p(t) }))
}
), be = g.findIndex((t) => typeof t.colSpan == "function") > -1;
let he;
be || (he = le(null));
const q = ((Ae = e.editable) == null ? void 0 : Ae.mode) === "dialog", Ht = (Fe = e.editable) == null ? void 0 : Fe.enabled, we = (_e = (Oe = e.editZoneRef) == null ? void 0 : Oe.current) != null ? _e : "body", Lt = we === "pinned" ? void 0 : e.edit, Ce = we === "body" ? void 0 : e.edit, D = {
leafColumns: g,
columnsState: w,
cellsToRender: he,
getCellsToRender: le,
hasDynamicColSpan: be,
idPrefix: y,
gridClasses: m,
unstyled: G,
localization: P,
intl: yt,
cells: e.cells,
isRowReorderable: I,
sort: e.sort,
editable: e.editable,
isClient: e.isClient,
isEditDialog: q,
dataItemKey: e.dataItemKey,
select: e.select,
highlight: e.highlight
}, Nt = 0;
let J = null;
const Re = (t) => t >= u.length - Nt, Q = [], ye = !u.length, Ee = n.useMemo(() => {
var i;
const t = e.pinnedTopRows || [];
return k && ((i = e.sort) != null && i.length) ? qe([...t], e.sort) : t;
}, [e.pinnedTopRows, e.sort, k]), Se = n.useMemo(() => {
var i;
const t = e.pinnedBottomRows || [];
return k && ((i = e.sort) != null && i.length) ? qe([...t], e.sort) : t;
}, [e.pinnedBottomRows, e.sort, k]), Dt = e.pinnable && Ee.length > 0, Tt = e.pinnable && Se.length > 0;
let T = 0;
const Pt = n.useMemo(() => {
const t = /* @__PURE__ */ new Set();
return e.pinnedTopRows && e.pinnedTopRows.forEach((i) => t.add(i)), e.pinnedBottomRows && e.pinnedBottomRows.forEach((i) => t.add(i)), t;
}, [e.pinnedTopRows, e.pinnedBottomRows]);
if (u.length) {
const t = N.length + (e.filterable ? 1 : 0) + 1;
let i = e.skip || 0, r = -1, o = 0;
const a = se.enabled ? {} : void 0;
if (R) {
if (K > 0) {
const l = u.slice(0, K).filter((d) => d.rowType === "data").length;
r += l, i += K;
}
!e.pageable && B && (r += e.skip || 0);
}
($ || u).forEach((l, d) => {
var je;
l.rowType === "data" && r++;
const h = l.dataIndex % 2 !== 0, F = e.dataItemKey && Y(e.dataItemKey)(l.dataItem), O = d + i, _ = F || "ai" + O, H = Va(D, Lt, l, _, r, h, a), zt = l.rowType === "data" ? Pt.has(l.dataItem) : !1;
if (T = O + t + o, q && Ht && H.isInEdit && (J = l.dataItem), Q.push(
/* @__PURE__ */ n.createElement(
Oa,
{
key: _,
isStackedMode: b,
item: l,
rowId: _,
dataIndex: r,
idPrefix: y,
ariaRowIndex: T,
absoluteRowIndex: O,
isAltRow: h,
isHidden: Re(d),
isRowReorderable: I,
rowHeight: e.rowHeight,
rows: e.rows,
leafColumns: g,
groupLevelCount: E,
stackedLayoutSettings: e.stackedLayoutSettings,
cells: e.cells,
editMode: (je = e.editable) == null ? void 0 : je.mode,
isSelected: H.isSelected,
isHighlighted: H.isHighlighted,
isInEdit: H.isInEdit && !q,
preparedCells: H.row,
showDetailToggle: !!e.detail && !!v.enabled,
isDetailExpanded: !!l.expanded,
detailExpandField: v.column,
isPinned: zt
}
)
), e.detail && l.rowType === "data" && l.expanded) {
o++;
const V = _ + "_1";
T = O + t + o;
const Kt = e.isClient ? ba : Ma;
Q.push(
/* @__PURE__ */ n.createElement(
_a,
{
key: V,
isStackedMode: b,
detailRowId: V,
isHidden: Re(d),
detailRowHeight: e.detailRowHeight,
ariaRowIndex: T,
item: l,
groupLevelCount: E,
groupDescriptors: e.group,
lockGroups: e.lockGroups,
cells: e.cells,
leafColumns: g,
detailExpandableEnabled: !!v.enabled,
preparedCells: H.row,
DetailCell: Kt,
detail: e.detail,
detailCellId: j.generateNavigatableId(`${V}-dcell`, y),
detailHierarchyCellId: v.enabled ? j.generateNavigatableId(`${V}-dhcell`, y) : void 0,
detailTrClassName: c(m.detailTr({ isAlt: h })),
unstyled: G
}
)
);
}
});
}
const ve = {
size: f,
total: S,
skip: e.skip || 0,
take: (e.take !== void 0 ? e.take : e.pageSize) || 10,
...ga(e.pageable || {})
}, Ge = /* @__PURE__ */ n.createElement(Ca, null, e.pager ? /* @__PURE__ */ n.createElement(e.pager, { ...ve }) : /* @__PURE__ */ n.createElement($t, { className: c(m.pager({})), ...ve })), Bt = (t, i) => /* @__PURE__ */ n.createElement("col", { key: i.toString(), width: p(t) }), Ie = (Ve = e.cells) != null && Ve.footerCell || s.some((t) => {
var i;
return !!((i = t.cells) != null && i.footerCell);
}) ? /* @__PURE__ */ n.createElement(
Yt,
{
size: f,
staticHeaders: e.scrollable !== "none",
row: /* @__PURE__ */ n.createElement(
fa,
{
cells: e.cells,
idPrefix: y,
columns: s,
ariaRowIndex: T + 1
}
),
cols: g.map(Bt)
}
) : null, x = b ? /* @__PURE__ */ n.createElement(Fa, { groupLevelCount: E }) : /* @__PURE__ */ n.createElement(ha, null, g.map((t, i) => /* @__PURE__ */ n.createElement(
"col",
{
key: i.toString(),
className: ea(t.field, e.sort) ? c(m.sorted({})) : void 0,
width: p(t)
}
))), ke = e.reorderable || M, { detail: $a, cells: Za, rows: Ua, ...Mt } = e, xe = /* @__PURE__ */ n.createElement(
"tbody",
{
role: "rowgroup",
className: c(m.tbody({})),
...Zt
},
Q
), He = J ? /* @__PURE__ */ n.createElement(Na, { columns: g, customEditDialog: e.editDialog, dataItem: J }) : null;
let X = xe;
I && (X = /* @__PURE__ */ n.createElement(
va,
{
unstyled: m,
columns: s,
rowReorderSettings: e.rowReorderable
},
xe
));
const Le = {
gridRef: ot,
innerGrid: e.innerGrid,
gridProps: Mt,
columnsRef: ae(),
hiddenColumnsRef: ne,
columnsMapRef: N,
columnsState: w,
dataRef: u,
id: L,
virtualTotal: oe,
isAllData: B,
virtualPageSize: Z,
isVirtualScroll: R,
detailExpandable: !!e.detail
};
return e.scrollable === "none" ? /* @__PURE__ */ n.createElement(Ye, { ...Le }, /* @__PURE__ */ n.createElement(at, null, /* @__PURE__ */ n.createElement(
"div",
{
id: e.id,
style: e.style,
className: c(m.wrapper({ size: f, isStackedMode: b }), e.className),
...Ze
},
ce,
fe,
/* @__PURE__ */ n.createElement(
wa,
{
selectable: e.selectable,
className: c(m.table({ size: f }))
},
x,
ge,
/* @__PURE__ */ n.createElement(tt, { rowReorderable: I }, X),
Ie
),
ye && /* @__PURE__ */ n.createElement(Xe, null, A.length ? A : /* @__PURE__ */ n.createElement(Je, null)),
ke && /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(pe, null), /* @__PURE__ */ n.createElement(et, null))
)), ue, e.pageable && Ge, /* @__PURE__ */ n.createElement(nt, { loader: e.loader, showLoader: e.showLoader }), He, me && /* @__PURE__ */ n.createElement($e, { message: re })) : /* @__PURE__ */ n.createElement(Ye, { ...Le }, /* @__PURE__ */ n.createElement(at, null, /* @__PURE__ */ n.createElement(
"div",
{
id: e.id,
style: e.style,
className: c(
m.wrapper({
size: f,
virtual: R,
isStackedMode: b
}),
e.className
),
...Ze
},
ce,
fe,
/* @__PURE__ */ n.createElement(
"div",
{
className: c(m.ariaRoot({})),
role: "grid",
"aria-colcount": g.length,
"aria-rowcount": S,
id: L,
"aria-label": P.toLanguageString(lt, Sa[lt])
},
ge,
e.isClient && Dt && /* @__PURE__ */ n.createElement(
rt,
{
size: f,
colGroups: x,
dataRowContext: D,
edit: Ce,
position: "top",
pinnedItems: Ee,
isStackedMode: b,
groupLevelCount: E,
stackedLayoutSettings: e.stackedLayoutSettings,
rowHeight: e.rowHeight,
rows: e.rows,
selectable: e.selectable
}
),
/* @__PURE__ */ n.createElement("div", { className: c(m.container({})), role: "presentation" }, e.isClient && z && St && /* @__PURE__ */ n.createElement(
it,
{
size: f,
colGroups: x,
dataRowContext: D,
position: "top",
isStackedMode: b,
groupLevelCount: E,
stackedLayoutSettings: e.stackedLayoutSettings,
rowHeight: e.rowHeight
}
), /* @__PURE__ */ n.createElement(ya, null, /* @__PURE__ */ n.createElement("div", { className: c(m.content({})), role: "presentation" }, /* @__PURE__ */ n.createElement("div", { className: c(m.tableWrap({})), role: "presentation" }, /* @__PURE__ */ n.createElement(
Ra,
{
selectable: e.selectable,
tableClassName: c(
m.table({
size: f
})
),
tableStyle: { userSelect: xt }
},
x,
/* @__PURE__ */ n.createElement(tt, { rowReorderable: I }, X)
), ye && /* @__PURE__ */ n.createElement(Xe, null, A.length ? A : /* @__PURE__ */ n.createElement(Je, null))), R && /* @__PURE__ */ n.createElement(
"div",
{
className: c(m.heightContainer({})),
role: "presentation"
},
/* @__PURE__ */ n.createElement(Ea, { isVirtualScroll: R })
))), e.isClient && z && vt && /* @__PURE__ */ n.createElement(
it,
{
size: f,
colGroups: x,
dataRowContext: D,
position: "bottom",
isStackedMode: b,
groupLevelCount: E,
stackedLayoutSettings: e.stackedLayoutSettings,
rowHeight: e.rowHeight
}
)),
e.isClient && Tt && /* @__PURE__ */ n.createElement(
rt,
{
size: f,
colGroups: x,
dataRowContext: D,
edit: Ce,
position: "bottom",
pinnedItems: Se,
isStackedMode: b,
groupLevelCount: E,
stackedLayoutSettings: e.stackedLayoutSettings,
rowHeight: e.rowHeight,
rows: e.rows,
selectable: e.selectable
}
),
Ie,
ke && /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(pe, null), /* @__PURE__ */ n.createElement(et, null)),
me && /* @__PURE__ */ n.createElement($e, { message: re })
),
ue,
e.pageable && Ge,
/* @__PURE__ */ n.createElement(nt, { loader: e.loader, showLoader: e.showLoader }),
He
)));
});
ja.displayName = "KendoReactGridComponent";
export {
ja as GridComponent
};