@acronis-platform/ui-react 6.0.0 → 7.0.0

package/dist/components/ui/data-table/data-table.js

@@ -6,12 +6,13 @@ import { TruncateText as ee } from "../truncate-text/truncate-text.js";
 import { getCoreRowModel as s, getExpandedRowModel as c, getFilteredRowModel as l, getPaginationRowModel as u, getSortedRowModel as d } from "../../../node_modules/.pnpm/@tanstack_table-core@8.21.3/node_modules/@tanstack/table-core/build/lib/index.js";
 import { flexRender as te, useReactTable as f } from "../../../node_modules/.pnpm/@tanstack_react-table@8.21.3_react-dom@19.2.6_react@19.2.6__react@19.2.6/node_modules/@tanstack/react-table/build/lib/index.js";
 import { DropdownMenu as p, DropdownMenuContent as m, DropdownMenuTrigger as ne } from "../dropdown-menu/dropdown-menu.js";
-import { Table as re, TableActionsCell as ie, TableBody as ae, TableCell as h, TableHead as oe, TableHeader as se, TableRow as g, TableSettingsCell as _ } from "../table/table.js";
-import { isBulkSelectionActive as ce } from "./data-table-selection.js";
-import { DataTableViewOptions as le } from "./data-table-view-options.js";
-import { Fragment as v, useEffect as ue, useMemo as de, useRef as fe, useState as y } from "react";
+import { Skeleton as re } from "../skeleton/skeleton.js";
+import { Table as ie, TableActionsCell as ae, TableBody as oe, TableCell as h, TableHead as se, TableHeader as ce, TableRow as g, TableSettingsCell as le } from "../table/table.js";
+import { isBulkSelectionActive as ue } from "./data-table-selection.js";
+import { DataTableViewOptions as de } from "./data-table-view-options.js";
+import { Fragment as _, useEffect as v, useMemo as fe, useRef as pe, useState as y } from "react";
 import { jsx as b, jsxs as x } from "react/jsx-runtime";
-import { EllipsisIcon as pe } from "@acronis-platform/icons-react/stroke-mono";
+import { EllipsisIcon as me } from "@acronis-platform/icons-react/stroke-mono";
 //#region src/components/ui/data-table/data-table.tsx
 function S(e) {
 	let t = e.getIsPinned();
@@ -41,19 +42,19 @@ function T(e, t) {
 		width: r
 	};
 }
-var me = 20, E = 2 ** 53 - 1;
-function D(e, t, { shiftKey: n, min: r, max: i }) {
+var E = 20, D = 2 ** 53 - 1;
+function O(e, t, { shiftKey: n, min: r, max: i }) {
 	let a = n ? 50 : 10;
 	if (e === "ArrowLeft") return Math.min(i, Math.max(r, t - a));
 	if (e === "ArrowRight") return Math.max(r, Math.min(i, t + a));
 }
-function O(e, t, n) {
+function he(e, t, n) {
 	let r = e.indexOf(t), i = e.indexOf(n);
 	if (r === -1 || i === -1 || r === i) return e;
 	let a = [...e];
 	return a.splice(i, 0, a.splice(r, 1)[0]), a;
 }
-var he = {
+var ge = {
 	sort: {
 		label: "Sort column",
 		action: "Click"
@@ -67,21 +68,21 @@ var he = {
 		action: "Drag border"
 	}
 };
-function k({ columns: S = [], data: C = [], table: k, getRowId: ge, getRowCanExpand: _e, renderExpandedRow: A, striped: j = !1, bordered: ve = !1, highlightCurrentRow: M = !1, skeleton: N = !1, skeletonRows: ye = 5, enableColumnResizing: P = !1, onColumnSizingChange: be, enableColumnReordering: xe = !1, columnOrder: F, onColumnOrderChange: Se, columnVisibility: Ce, onColumnVisibilityChange: we, rowSelection: I, onRowSelectionChange: Te, manualSorting: L = !1, sorting: R, onSortingChange: Ee, renderRow: z, renderEmptyState: B, paginationMode: V = "page", onLoadMore: De, loadMoreRootMargin: Oe, hasNextPage: H = !1, resizeColumnLabel: ke = "Resize column", emptyLabel: Ae = "No results.", isLoadingMore: je = !1, hideActionColumn: Me = !1, renderRowActions: Ne, rowActionsLabel: Pe = "Row actions", columnSettingsLabel: Fe, columnSearchPlaceholder: Ie, showAllColumnsLabel: Le, noColumnsFoundLabel: Re, headerHints: ze }) {
-	let U = {
-		...he,
-		...ze
-	}, [Be, Ve] = y([]), He = R ?? Be, [Ue, We] = y([]), [Ge, Ke] = y({}), qe = Ce ?? Ge, [Je, Ye] = y({}), Xe = I ?? Je, [Ze, Qe] = y({}), [$e, et] = y({}), [tt, nt] = y([]), rt = F ?? tt, [W, G] = y(), [it, at] = y(), [ot, st] = y(0), ct = fe([]), lt = (e) => {
-		et(e), be?.(e);
-	}, ut = (e) => {
-		F === void 0 && nt(e), Se?.(e);
-	}, dt = (e) => {
-		Ke(e), we?.(e);
-	}, ft = (e) => {
-		R === void 0 && Ve(e), Ee?.(e);
+function k({ columns: S = [], data: C = [], table: k, getRowId: _e, getRowCanExpand: ve, renderExpandedRow: ye, striped: be = !1, bordered: xe = !1, highlightCurrentRow: A = !1, skeleton: j = !1, skeletonRows: Se = 5, enableColumnResizing: Ce = !1, onColumnSizingChange: we, enableColumnReordering: Te = !1, columnOrder: Ee, onColumnOrderChange: De, columnVisibility: Oe, onColumnVisibilityChange: ke, rowSelection: Ae, onRowSelectionChange: je, manualSorting: M = !1, sorting: N, onSortingChange: Me, renderRow: P, renderEmptyState: F, paginationMode: I = "page", onLoadMore: Ne, loadMoreRootMargin: Pe, hasNextPage: L = !1, resizeColumnLabel: Fe = "Resize column", emptyLabel: Ie = "No results.", isLoadingMore: R = !1, loadingMoreLabel: Le = "Loading more data...", hideActionColumn: Re = !1, renderRowActions: z, rowActionsLabel: ze = "Row actions", columnSettingsLabel: Be, columnSearchPlaceholder: Ve, showAllColumnsLabel: He, noColumnsFoundLabel: Ue, headerHints: We }) {
+	let B = {
+		...ge,
+		...We
+	}, [Ge, Ke] = y([]), qe = N ?? Ge, [Je, Ye] = y([]), [Xe, Ze] = y({}), Qe = Oe ?? Xe, [$e, et] = y({}), tt = Ae ?? $e, [nt, rt] = y({}), [it, at] = y({}), [ot, st] = y([]), ct = Ee ?? ot, [V, H] = y(), [lt, ut] = y(), [dt, U] = y(0), W = pe([]), ft = (e) => {
+		at(e), we?.(e);
 	}, pt = (e) => {
-		I === void 0 && Ye(e), Te?.(e);
-	}, K = !Me && !k, mt = de(() => K ? [{
+		Ee === void 0 && st(e), De?.(e);
+	}, mt = (e) => {
+		Ze(e), ke?.(e);
+	}, ht = (e) => {
+		N === void 0 && Ke(e), Me?.(e);
+	}, gt = (e) => {
+		Ae === void 0 && et(e), je?.(e);
+	}, G = !Re && !k, _t = fe(() => G ? [{
 		id: "__actions",
 		size: 48,
 		enableSorting: !1,
@@ -89,141 +90,141 @@ function k({ columns: S = [], data: C = [], table: k, getRowId: ge, getRowCanExp
 		meta: { pin: "right" },
 		header: () => null,
 		cell: () => null
-	}] : [], [K]), ht = de(() => [...S, ...mt], [S, mt]), [gt, _t] = y(), vt = f({
+	}] : [], [G]), vt = fe(() => [...S, ..._t], [S, _t]), [yt, K] = y(), bt = f({
 		data: C,
-		columns: ht,
-		getRowId: ge,
-		enableColumnResizing: P,
+		columns: vt,
+		getRowId: _e,
+		enableColumnResizing: Ce,
 		columnResizeMode: "onChange",
 		getCoreRowModel: s(),
 		getExpandedRowModel: c(),
-		...V === "page" ? { getPaginationRowModel: u() } : {},
-		getRowCanExpand: _e,
-		onExpandedChange: Qe,
-		manualSorting: L,
-		onSortingChange: ft,
-		...L ? {} : { getSortedRowModel: d() },
-		onColumnFiltersChange: We,
+		...I === "page" ? { getPaginationRowModel: u() } : {},
+		getRowCanExpand: ve,
+		onExpandedChange: rt,
+		manualSorting: M,
+		onSortingChange: ht,
+		...M ? {} : { getSortedRowModel: d() },
+		onColumnFiltersChange: Ye,
 		getFilteredRowModel: l(),
-		onColumnVisibilityChange: dt,
-		onRowSelectionChange: pt,
-		onColumnSizingChange: lt,
-		onColumnOrderChange: ut,
-		initialState: K ? { columnPinning: { right: ["__actions"] } } : void 0,
+		onColumnVisibilityChange: mt,
+		onRowSelectionChange: gt,
+		onColumnSizingChange: ft,
+		onColumnOrderChange: pt,
+		initialState: G ? { columnPinning: { right: ["__actions"] } } : void 0,
 		state: {
-			sorting: He,
-			columnFilters: Ue,
-			columnVisibility: qe,
-			rowSelection: Xe,
-			expanded: Ze,
-			columnSizing: $e,
-			columnOrder: rt
+			sorting: qe,
+			columnFilters: Je,
+			columnVisibility: Qe,
+			rowSelection: tt,
+			expanded: nt,
+			columnSizing: it,
+			columnOrder: ct
 		}
-	}), q = k ?? vt, J = !k && V === "infinite", Y = P && !k, yt = xe && !k, X = !!q.getState().columnSizingInfo.isResizingColumn;
-	ue(() => {
+	}), q = k ?? bt, J = !k && I === "infinite", Y = Ce && !k, xt = Te && !k, X = !!q.getState().columnSizingInfo.isResizingColumn;
+	v(() => {
 		if (X) return document.documentElement.setAttribute("data-ui-column-resizing", ""), () => {
 			document.documentElement.removeAttribute("data-ui-column-resizing");
 		};
 	}, [X]);
-	let bt = t({
-		onIntersect: () => De?.(),
-		disabled: !J || !H || je,
-		rootMargin: Oe
-	}), xt = (e, t) => {
+	let St = t({
+		onIntersect: () => Ne?.(),
+		disabled: !J || !L || R,
+		rootMargin: Pe
+	}), Ct = (e, t) => {
 		if (e.ctrlKey || e.altKey || e.metaKey) return;
-		let n = D(e.key, t.column.getSize(), {
+		let n = O(e.key, t.column.getSize(), {
 			shiftKey: e.shiftKey,
-			min: t.column.columnDef.minSize ?? me,
-			max: t.column.columnDef.maxSize ?? E
+			min: t.column.columnDef.minSize ?? E,
+			max: t.column.columnDef.maxSize ?? D
 		});
 		n !== void 0 && (e.preventDefault(), q.setColumnSizing((e) => ({
 			...e,
 			[t.column.id]: n
 		})));
-	}, St = (e, t) => {
-		e.dataTransfer && (e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("text/plain", t)), G(t);
-	}, Ct = (e, t) => {
+	}, wt = (e, t) => {
+		e.dataTransfer && (e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("text/plain", t)), H(t);
+	}, Tt = (e, t) => {
 		if (e.preventDefault(), !e.dataTransfer) return;
-		let n = W ? q.getColumn(W)?.parent?.id : void 0, r = q.getColumn(t)?.parent?.id;
+		let n = V ? q.getColumn(V)?.parent?.id : void 0, r = q.getColumn(t)?.parent?.id;
 		e.dataTransfer.dropEffect = n === r ? "move" : "none";
-	}, wt = (e, t) => {
-		if (e.preventDefault(), !W) return;
-		if (q.getColumn(W)?.parent?.id !== q.getColumn(t)?.parent?.id) {
-			G(void 0);
+	}, Et = (e, t) => {
+		if (e.preventDefault(), !V) return;
+		if (q.getColumn(V)?.parent?.id !== q.getColumn(t)?.parent?.id) {
+			H(void 0);
 			return;
 		}
 		let n = q.getState().columnOrder, r = n.length ? n : q.getAllLeafColumns().map((e) => e.id);
-		q.setColumnOrder(O(r, W, t)), G(void 0);
+		q.setColumnOrder(he(r, V, t)), H(void 0);
 	};
-	ue(() => {
+	v(() => {
 		k || q.getAllLeafColumns().forEach((e) => {
 			e.pin(e.columnDef.meta?.pin ?? !1);
 		});
 	}, [
 		q,
-		ht,
+		vt,
 		k
 	]);
-	let Z = q.getRowModel().rows, Q = ce(q), Tt = Z.length ? Math.min(ot, Z.length - 1) : 0, Et = (e) => {
-		st(e);
-	}, Dt = (e, t) => {
+	let Z = q.getRowModel().rows, Q = ue(q), Dt = Z.length ? Math.min(dt, Z.length - 1) : 0, Ot = (e) => {
+		U(e);
+	}, kt = (e, t) => {
 		if (e.target !== e.currentTarget || e.key !== "ArrowDown" && e.key !== "ArrowUp") return;
 		let n = e.key === "ArrowDown" ? Math.min(t + 1, Z.length - 1) : Math.max(t - 1, 0);
-		n !== t && (e.preventDefault(), st(n), ct.current[n]?.focus());
-	}, Ot = ve ? "[&_th:not(:last-child)]:border-e [&_td:not(:last-child)]:border-e [&_th]:border-[var(--ui-table-global-row-border-color)] [&_td]:border-[var(--ui-table-global-row-border-color)]" : void 0, $ = "bg-background";
+		n !== t && (e.preventDefault(), U(n), W.current[n]?.focus());
+	}, At = xe ? "[&_th:not(:last-child)]:border-e [&_td:not(:last-child)]:border-e [&_th]:border-[var(--ui-table-global-row-border-color)] [&_td]:border-[var(--ui-table-global-row-border-color)]" : void 0, $ = "bg-background";
 	return /* @__PURE__ */ b("div", {
-		className: e("rounded-md border border-[var(--ui-table-global-row-border-color)]", Ot),
-		children: /* @__PURE__ */ x(re, {
+		className: e("rounded-md border border-[var(--ui-table-global-row-border-color)]", At),
+		children: /* @__PURE__ */ x(ie, {
 			style: Y ? { width: q.getCenterTotalSize() } : void 0,
-			children: [/* @__PURE__ */ b(a, { children: /* @__PURE__ */ b(se, { children: q.getHeaderGroups().map((t, n, a) => /* @__PURE__ */ b(g, {
+			children: [/* @__PURE__ */ b(a, { children: /* @__PURE__ */ b(ce, { children: q.getHeaderGroups().map((t, n, a) => /* @__PURE__ */ b(g, {
 				className: "hover:bg-transparent",
 				children: t.headers.map((t) => {
-					let s = t.column.getIsPinned(), c = t.subHeaders.length > 0, l = !c && Y && t.column.getCanResize() && t.column.id !== "select", u = !c && yt && !t.isPlaceholder && !s, d = !c && !t.isPlaceholder && t.column.getCanSort(), f = [
-						d && U.sort,
-						u && U.reorder,
-						l && U.resize
+					let s = t.column.getIsPinned(), c = t.subHeaders.length > 0, l = !c && Y && t.column.getCanResize() && t.column.id !== "select", u = !c && xt && !t.isPlaceholder && !s, d = !c && !t.isPlaceholder && t.column.getCanSort(), f = [
+						d && B.sort,
+						u && B.reorder,
+						l && B.resize
 					].filter((e) => !!e);
-					if (t.column.id === "__actions") return n < a.length - 1 ? /* @__PURE__ */ b(_, {
+					if (t.column.id === "__actions") return n < a.length - 1 ? /* @__PURE__ */ b(le, {
 						style: w(t, Y),
 						className: $
-					}, t.id) : /* @__PURE__ */ b(_, {
+					}, t.id) : /* @__PURE__ */ b(le, {
 						style: w(t, Y),
 						className: $,
-						children: /* @__PURE__ */ b(le, {
+						children: /* @__PURE__ */ b(de, {
 							table: q,
 							iconOnly: !0,
-							triggerAriaLabel: Fe,
-							searchPlaceholder: Ie,
-							showAllLabel: Le,
-							noResultsLabel: Re
+							triggerAriaLabel: Be,
+							searchPlaceholder: Ve,
+							showAllLabel: He,
+							noResultsLabel: Ue
 						})
 					}, t.id);
-					let p = t.isPlaceholder ? null : te(t.column.columnDef.header, t.getContext()), m = /* @__PURE__ */ x(oe, {
+					let p = t.isPlaceholder ? null : te(t.column.columnDef.header, t.getContext()), m = /* @__PURE__ */ x(se, {
 						colSpan: t.colSpan,
 						style: w(t, Y),
 						draggable: u && !X || void 0,
-						onDragStart: u ? (e) => St(e, t.column.id) : void 0,
-						onDragOver: u ? (e) => Ct(e, t.column.id) : void 0,
-						onDrop: u ? (e) => wt(e, t.column.id) : void 0,
-						onDragEnd: u ? () => G(void 0) : void 0,
-						className: e(l && "relative", d && !X && "transition-colors hover:bg-[var(--ui-table-header-cell-color-hover)] active:bg-[var(--ui-table-header-cell-color-active)]", u && !X && "cursor-grab select-none active:cursor-grabbing", u && W === t.column.id && "opacity-50", s && $),
+						onDragStart: u ? (e) => wt(e, t.column.id) : void 0,
+						onDragOver: u ? (e) => Tt(e, t.column.id) : void 0,
+						onDrop: u ? (e) => Et(e, t.column.id) : void 0,
+						onDragEnd: u ? () => H(void 0) : void 0,
+						className: e(l && "relative", d && !X && "transition-colors hover:bg-[var(--ui-table-header-cell-color-hover)] active:bg-[var(--ui-table-header-cell-color-active)]", u && !X && "cursor-grab select-none active:cursor-grabbing", u && V === t.column.id && "opacity-50", s && $),
 						children: [typeof p == "string" && t.column.columnDef.meta?.wrap ? /* @__PURE__ */ b(ee, { children: p }) : p, l && /* @__PURE__ */ b("div", {
 							role: "separator",
 							"aria-orientation": "vertical",
-							"aria-label": ke,
+							"aria-label": Fe,
 							"aria-valuenow": t.column.getSize(),
-							"aria-valuemin": t.column.columnDef.minSize ?? me,
-							"aria-valuemax": t.column.columnDef.maxSize ?? E,
+							"aria-valuemin": t.column.columnDef.minSize ?? E,
+							"aria-valuemax": t.column.columnDef.maxSize ?? D,
 							tabIndex: 0,
 							draggable: !1,
 							onMouseDown: t.getResizeHandler(),
 							onTouchStart: t.getResizeHandler(),
-							onKeyDown: (e) => xt(e, t),
+							onKeyDown: (e) => Ct(e, t),
 							className: e("absolute end-0 top-0 h-full w-1 cursor-(--ui-resizable-cursor) touch-none select-none bg-[var(--ui-table-global-row-border-color)] opacity-0 transition-[opacity,background-color] hover:bg-[var(--ui-resizable-border-color-hover)] hover:opacity-100 focus-visible:bg-[var(--ui-resizable-border-color-hover)] focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-inset focus-visible:ring-[var(--ui-focus-primary)]", t.column.getIsResizing() && "bg-[var(--ui-resizable-border-color-active)] opacity-100")
 						})]
 					});
-					return f.length === 0 ? /* @__PURE__ */ b(v, { children: m }, t.id) : /* @__PURE__ */ x(r, {
-						disabled: X || W !== void 0,
+					return f.length === 0 ? /* @__PURE__ */ b(_, { children: m }, t.id) : /* @__PURE__ */ x(r, {
+						disabled: X || V !== void 0,
 						children: [/* @__PURE__ */ b(o, { render: m }), /* @__PURE__ */ b(i, {
 							className: "flex flex-col gap-1",
 							children: f.map((e) => /* @__PURE__ */ x("span", { children: [
@@ -237,91 +238,91 @@ function k({ columns: S = [], data: C = [], table: k, getRowId: ge, getRowCanExp
 						})]
 					}, t.id);
 				})
-			}, t.id)) }) }), /* @__PURE__ */ x(ae, { children: [
-				N ? Array.from({ length: ye }).map((e, t) => /* @__PURE__ */ b(g, {
-					className: "hover:bg-transparent",
-					children: q.getVisibleLeafColumns().map((e) => /* @__PURE__ */ b(h, { children: /* @__PURE__ */ b("div", { className: "h-4 w-full animate-pulse rounded bg-[var(--ui-background-surface-secondary)]" }) }, e.id))
-				}, `skeleton-${t}`)) : Z?.length ? Z.map((t, r) => {
-					if (z) return /* @__PURE__ */ b(v, { children: z(t, r) }, t.id);
-					let i = t.getIsSelected(), a = M && it === t.id, o = i || a ? "bg-[var(--ui-table-data-row-color-active)]" : j && r % 2 == 1 ? "bg-[var(--ui-background-surface-secondary)]" : "bg-background group-hover:bg-[var(--ui-table-data-row-color-hover)]", ee = !Q && gt === t.id;
-					return /* @__PURE__ */ x(v, { children: [/* @__PURE__ */ b(g, {
-						ref: (e) => {
-							ct.current[r] = e;
-						},
-						tabIndex: r === Tt ? 0 : -1,
-						onFocus: () => Et(r),
-						onKeyDown: (e) => Dt(e, r),
-						selected: i,
-						onClick: M ? () => at(t.id) : void 0,
-						className: e("group", M && "cursor-pointer", j && r % 2 == 1 && !i && !a && "bg-[var(--ui-background-surface-secondary)]", a && !i && "bg-[var(--ui-table-data-row-color-active)]", ee && "hover:bg-transparent"),
-						children: t.getVisibleCells().map((r) => {
-							let i = r.column.getIsPinned();
-							return r.column.id === "__actions" ? /* @__PURE__ */ b(ie, {
-								style: T(r, Y),
-								className: o,
-								bulkSelectionActive: Q,
-								onMouseEnter: Q ? void 0 : () => _t(t.id),
-								onMouseLeave: Q ? void 0 : () => _t((e) => e === t.id ? void 0 : e),
-								children: Ne && /* @__PURE__ */ x(p, { children: [/* @__PURE__ */ b(ne, {
-									render: /* @__PURE__ */ b(n, { "aria-label": Pe }),
-									children: /* @__PURE__ */ b(pe, {})
-								}), /* @__PURE__ */ b(m, {
-									align: "end",
-									children: Ne(t)
-								})] })
-							}, r.id) : /* @__PURE__ */ b(h, {
-								wrap: r.column.columnDef.meta?.wrap,
-								style: T(r, Y),
-								className: e(i && o),
-								children: te(r.column.columnDef.cell, r.getContext())
-							}, r.id);
-						})
-					}), A && t.getIsExpanded() && /* @__PURE__ */ b(g, {
+			}, t.id)) }) }), /* @__PURE__ */ x(oe, {
+				className: J && !j && Z.length > 0 && R ? "[&_tr:last-child]:border-b-[length:var(--ui-table-global-row-border-width)]" : void 0,
+				children: [
+					j ? Array.from({ length: Se }).map((e, t) => /* @__PURE__ */ b(g, {
 						className: "hover:bg-transparent",
-						children: /* @__PURE__ */ b(h, {
-							className: "h-auto py-3",
-							colSpan: t.getVisibleCells().length,
-							children: A(t)
-						})
-					})] }, t.id);
-				}) : B ? /* @__PURE__ */ b(g, { children: /* @__PURE__ */ b(h, {
-					colSpan: q.getVisibleLeafColumns().length,
-					className: "h-24 text-center",
-					children: B({ hasFilters: q.getState().columnFilters.length > 0 })
-				}) }) : /* @__PURE__ */ b(g, { children: /* @__PURE__ */ b(h, {
-					colSpan: q.getVisibleLeafColumns().length,
-					className: "h-24 text-center text-[var(--ui-table-data-value-color-disabled)]",
-					children: Ae
-				}) }),
-				J && !N && Z.length > 0 && H && /* @__PURE__ */ b(g, {
-					ref: bt,
-					"aria-hidden": !0,
-					className: "hover:bg-transparent",
-					children: /* @__PURE__ */ b(h, {
+						children: q.getVisibleLeafColumns().map((e) => /* @__PURE__ */ b(h, { children: /* @__PURE__ */ b(re, { className: "h-4 w-full" }) }, e.id))
+					}, `skeleton-${t}`)) : Z?.length ? Z.map((t, r) => {
+						if (P) return /* @__PURE__ */ b(_, { children: P(t, r) }, t.id);
+						let i = t.getIsSelected(), a = A && lt === t.id, o = i || a ? "bg-[var(--ui-table-data-row-color-active)]" : be && r % 2 == 1 ? "bg-[var(--ui-background-surface-secondary)]" : "bg-background group-hover:bg-[var(--ui-table-data-row-color-hover)]", ee = !Q && yt === t.id;
+						return /* @__PURE__ */ x(_, { children: [/* @__PURE__ */ b(g, {
+							ref: (e) => {
+								W.current[r] = e;
+							},
+							tabIndex: r === Dt ? 0 : -1,
+							onFocus: () => Ot(r),
+							onKeyDown: (e) => kt(e, r),
+							selected: i,
+							onClick: A ? () => ut(t.id) : void 0,
+							className: e("group", A && "cursor-pointer", be && r % 2 == 1 && !i && !a && "bg-[var(--ui-background-surface-secondary)]", a && !i && "bg-[var(--ui-table-data-row-color-active)]", ee && "hover:bg-transparent"),
+							children: t.getVisibleCells().map((r) => {
+								let i = r.column.getIsPinned();
+								return r.column.id === "__actions" ? /* @__PURE__ */ b(ae, {
+									style: T(r, Y),
+									className: o,
+									bulkSelectionActive: Q,
+									onMouseEnter: Q ? void 0 : () => K(t.id),
+									onMouseLeave: Q ? void 0 : () => K((e) => e === t.id ? void 0 : e),
+									children: z && /* @__PURE__ */ x(p, { children: [/* @__PURE__ */ b(ne, {
+										render: /* @__PURE__ */ b(n, { "aria-label": ze }),
+										children: /* @__PURE__ */ b(me, {})
+									}), /* @__PURE__ */ b(m, {
+										align: "end",
+										children: z(t)
+									})] })
+								}, r.id) : /* @__PURE__ */ b(h, {
+									wrap: r.column.columnDef.meta?.wrap,
+									style: T(r, Y),
+									className: e(i && o),
+									children: te(r.column.columnDef.cell, r.getContext())
+								}, r.id);
+							})
+						}), ye && t.getIsExpanded() && /* @__PURE__ */ b(g, {
+							className: "hover:bg-transparent",
+							children: /* @__PURE__ */ b(h, {
+								className: "h-auto py-3",
+								colSpan: t.getVisibleCells().length,
+								children: ye(t)
+							})
+						})] }, t.id);
+					}) : F ? /* @__PURE__ */ b(g, { children: /* @__PURE__ */ b(h, {
 						colSpan: q.getVisibleLeafColumns().length,
-						className: "h-1 p-0"
-					})
-				}),
-				J && !N && Z.length > 0 && je && /* @__PURE__ */ b(g, {
-					className: "hover:bg-transparent",
-					children: /* @__PURE__ */ b(h, {
+						className: "h-24 text-center",
+						children: F({ hasFilters: q.getState().columnFilters.length > 0 })
+					}) }) : /* @__PURE__ */ b(g, { children: /* @__PURE__ */ b(h, {
 						colSpan: q.getVisibleLeafColumns().length,
-						children: /* @__PURE__ */ b("div", {
-							role: "status",
-							"aria-live": "polite",
-							className: "h-4 w-full animate-pulse rounded bg-[var(--ui-background-surface-secondary)]",
+						className: "h-24 text-center text-[var(--ui-table-data-value-color-disabled)]",
+						children: Ie
+					}) }),
+					J && !j && Z.length > 0 && L && !R && /* @__PURE__ */ b(g, {
+						ref: St,
+						"aria-hidden": !0,
+						className: "hover:bg-transparent",
+						children: /* @__PURE__ */ b(h, {
+							colSpan: q.getVisibleLeafColumns().length,
+							className: "h-1 p-0"
+						})
+					}),
+					J && !j && Z.length > 0 && R && /* @__PURE__ */ b(g, {
+						className: "hover:bg-transparent",
+						children: /* @__PURE__ */ b(h, {
+							colSpan: q.getVisibleLeafColumns().length,
+							className: "text-center text-[var(--ui-text-on-surface-secondary)]",
 							children: /* @__PURE__ */ b("span", {
-								className: "sr-only",
-								children: "Loading more rows…"
+								role: "status",
+								"aria-live": "polite",
+								children: Le
 							})
 						})
 					})
-				})
-			] })]
+				]
+			})]
 		})
 	});
 }
 //#endregion
-export { k as DataTable, T as getCellStyle, C as getColumnWidth, S as getPinnedStyle, D as getResizeKeyboardStep, O as reorderColumn };
+export { k as DataTable, T as getCellStyle, C as getColumnWidth, S as getPinnedStyle, O as getResizeKeyboardStep, he as reorderColumn };
 
 //# sourceMappingURL=data-table.js.map