@payfit/unity-components
Version:
103 lines (102 loc) • 4.19 kB
JavaScript
import { CircularIconButton as e } from "../icon-button/CircularIconButton.js";
import { TableBody as t } from "../table/parts/TableBody.js";
import { TableColumnHeader as n } from "../table/parts/TableColumnHeader.js";
import { TableEmptyStateError as r, TableEmptyStateLoading as i, TableEmptyStateNoData as a, TableNoSearchResults as o } from "../table/parts/TableEmptyState.js";
import { TableHeader as s } from "../table/parts/TableHeader.js";
import { TablePagination as c } from "../table/parts/TablePagination.js";
import { Table as l, TableRoot as u } from "../table/Table.js";
import { ColumnSortHeader as d } from "./parts/ColumnSortHeader.js";
import { useEffect as f, useRef as p } from "react";
import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
import { useId as _ } from "react-aria/useId";
import { flexRender as v } from "@tanstack/react-table";
//#region src/components/data-table/DataTable.tsx
var y = ({ children: t, columnNameId: n, helperText: r }) => r === void 0 ? /* @__PURE__ */ h(m, { children: t }) : /* @__PURE__ */ g("div", {
className: "uy:flex uy:gap-50 uy:items-center",
children: [t, /* @__PURE__ */ h(e, {
"aria-labelledby": n,
icon: "QuestionOutlined",
title: r,
color: "content.neutral.lowest"
})]
});
function b({ table: e, isLoading: m, error: b, emptyState: x, loadingState: S, errorState: C, pagination: w, minRows: T, maxRows: E, onPageChange: D, onPageHover: O, onPageSizeChange: k, children: A, enableVirtualization: j, estimatedRowHeight: M, overscan: N, onErrorButtonPress: P, onNoDataButtonPress: F, noDataDescription: I, onNoSearchResultsButtonPress: L, ...R }) {
let z = p(null), B = _(), { pageIndex: V, pageSize: H } = e.getState().pagination;
f(() => {
z.current?.scrollToTop();
}, [V, H]);
let U = {
label: R.label,
description: R.description,
isHorizontalScrollEnabled: R.isHorizontalScrollEnabled,
layout: R.layout
}, W = () => {
if (m) return S ?? /* @__PURE__ */ h(i, {});
if (b) return C ?? /* @__PURE__ */ h(r, { onButtonPress: P });
}, G = () => {
let t = e.getState(), n = t.globalFilter !== void 0 && t.globalFilter !== "", r = t.columnFilters !== void 0 && t.columnFilters.length > 0;
return n || r;
}, K = () => m || b ? W() : e.getRowModel().rows.length === 0 ? G() && L ? /* @__PURE__ */ h(o, { onButtonPress: L }) : x ?? /* @__PURE__ */ h(a, {
onButtonPress: F,
description: I
}) : x;
return /* @__PURE__ */ g(u, {
minRows: T,
maxRows: E,
children: [/* @__PURE__ */ g(l, {
ref: z,
...U,
enableVirtualization: j,
estimatedRowHeight: M,
overscan: N,
children: [/* @__PURE__ */ h(s, { children: e.getHeaderGroups().map((t) => t.headers.map((t) => {
let r = `${B}-column-name-${t.column.columnDef.id}`;
return /* @__PURE__ */ h(n, {
isFocusable: t.column.columnDef.meta?.isFocusable,
className: t.column.columnDef.meta?.headerClassName,
children: e.getRowModel().rows.length > 0 && t.column.getCanSort() ? /* @__PURE__ */ h(d, {
header: t,
children: /* @__PURE__ */ h(y, {
columnNameId: r,
helperText: t.column.columnDef.meta?.helperText,
children: /* @__PURE__ */ h("span", {
id: r,
children: v(t.column.columnDef.header, t.getContext())
})
})
}) : /* @__PURE__ */ h(y, {
columnNameId: r,
helperText: t.column.columnDef.meta?.helperText,
children: /* @__PURE__ */ h("span", {
id: r,
children: v(t.column.columnDef.header, t.getContext())
})
})
}, t.id);
})) }), /* @__PURE__ */ h(t, {
renderEmptyState: K,
renderDataState: W,
children: !m && !b && e.getRowModel().rows.map(A)
})]
}), e.getPageCount() > 0 && /* @__PURE__ */ h(c, {
pageCount: e.getPageCount(),
rowCount: e.getRowCount(),
currentPage: V + 1,
rowsPerPage: H,
pageSizeOptions: w?.pageSizeOptions,
onPageChange: (t, n, r) => {
e.setPageIndex(t - 1), D?.(t - 1, n, r);
},
onPageHover: (e) => {
O?.(e);
},
onPageSizeChange: (t) => {
e.setPageSize(t), k?.(t);
},
itemLabel: w?.labels?.itemLabel
})]
});
}
b.displayName = "DataTable";
//#endregion
export { b as DataTable };