@propellerads/table 5.1.1 → 6.0.1

package/dist/index.d.ts

@@ -1,22 +1,116 @@
-import React, { FunctionComponent } from 'react';
-import { TableState } from 'react-table';
-import { DefaultObject, FOOTER_PLACEMENT, TableProps } from './types';
-export declare const defaultProps: {
-    hasDefaultPagination: boolean;
-    isLoading: boolean;
-    footerPlacement: FOOTER_PLACEMENT[];
-    loadingMessage: string;
-    labelPerPage: string;
-    parentElementId: string;
-    tableContentId: string;
-    showLoadingState: boolean;
-    initialState: Partial<TableState<Record<string, unknown>>>;
-    LoadingCellComponent: React.FunctionComponent<Record<string, unknown>>;
-    getRowPreProps: () => DefaultObject;
-    isEnableRowSelect: (_original?: Record<string, unknown> | undefined) => boolean;
-    selectColumnProps: {};
-    noDataMessage: string;
-};
-declare type DefaultProps = Readonly<typeof defaultProps>;
-declare const Table: FunctionComponent<TableProps & DefaultProps>;
-export { Table };
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as styled_components_dist_types from 'styled-components/dist/types';
+import * as styled_components from 'styled-components';
+import * as react from 'react';
+import { CSSProperties, ComponentPropsWithoutRef, ReactNode, ComponentType, ReactElement } from 'react';
+import { RowData, Cell, HeaderGroup, Header, ColumnDef, Row, TableState, VisibilityState, SortingState } from '@tanstack/react-table';
+export { SortingState, VisibilityState } from '@tanstack/react-table';
+
+declare module '@tanstack/react-table' {
+    interface ColumnMeta<TData extends RowData, TValue> {
+        align?: CSSProperties['textAlign'];
+    }
+}
+type DefaultObject = Record<string, unknown>;
+type LoadingState<TData extends DefaultObject = DefaultObject> = {
+    loadingColumns?: ColumnDef<TData>[];
+    loadingData: TData[];
+};
+type RowPreProps = ComponentPropsWithoutRef<'div'> & {
+    isDelimiterTd?: boolean;
+};
+declare const FooterPlacement: {
+    readonly Top: "top";
+    readonly Bottom: "bottom";
+};
+type FooterPlacement = (typeof FooterPlacement)[keyof typeof FooterPlacement];
+type PaginationProps = {
+    paginationAmount?: ReactNode;
+    parentElementId: string;
+    labelPerPage?: string;
+    pageSizes?: Array<string | number>;
+    pageIndex: number;
+    perPage: number;
+    totalPages: number;
+    totalItems: number;
+    canNextPage: boolean;
+    canPreviousPage: boolean;
+    nextPageHandler: () => void;
+    previousPageHandler: () => void;
+    setPageSize: (size: number) => void;
+    gotoPage: (page: number) => void;
+};
+type ControlledPagination = {
+    paginationAmount?: ReactNode;
+    pageSize: number;
+    pageIndex: number;
+    pageCount: number;
+};
+type HeaderGroupPropsGetter<TData extends DefaultObject = DefaultObject> = (headerGroup: HeaderGroup<TData>) => ComponentPropsWithoutRef<'div'>;
+type HeaderPropsGetter<TData extends DefaultObject = DefaultObject> = (header: Header<TData, unknown>) => ComponentPropsWithoutRef<'div'>;
+type RowPropsGetter<TData extends DefaultObject = DefaultObject> = (row: Row<TData>) => ComponentPropsWithoutRef<'div'>;
+type CellPropsGetter<TData extends DefaultObject = DefaultObject> = (cell: Cell<TData, unknown>) => ComponentPropsWithoutRef<'div'>;
+type SelectColumnProps<TData extends DefaultObject = DefaultObject> = Pick<ColumnDef<TData>, 'size' | 'minSize' | 'maxSize' | 'meta' | 'enableHiding'>;
+type TableProps<TData extends DefaultObject = DefaultObject> = {
+    columns: ColumnDef<TData>[];
+    data: TData[];
+    totalItems?: number;
+    PaginationComponent?: ComponentType<PaginationProps>;
+    initialState?: Partial<TableState> & {
+        columnVisibility?: VisibilityState;
+    };
+    fetchData?: (params: {
+        pageIndex: number;
+        pageSize: number;
+    }) => void;
+    onSortedChange?: (sorting: SortingState) => void;
+    isLoading?: boolean;
+    footerPlacement?: FooterPlacement[];
+    hasDefaultPagination?: boolean;
+    onSelectRowsChange?: (rows: TData[]) => void;
+    controlledPagination?: ControlledPagination;
+    loadingMessage?: string;
+    labelPerPage?: string;
+    parentElementId?: string;
+    tableContentId?: string;
+    getRowPreProps?: (row: Row<TData>) => RowPreProps;
+    getRowId?: (originalRow: TData, index: number, parent?: Row<TData>) => string;
+    getSubRows?: (originalRow: TData, index: number) => TData[] | undefined;
+    getTableProps?: () => ComponentPropsWithoutRef<'div'>;
+    getHeaderGroupProps?: HeaderGroupPropsGetter<TData>;
+    getHeaderProps?: HeaderPropsGetter<TData>;
+    getRowProps?: RowPropsGetter<TData>;
+    getCellProps?: CellPropsGetter<TData>;
+    getFooterProps?: HeaderPropsGetter<TData>;
+    getFooterGroupProps?: HeaderGroupPropsGetter<TData>;
+    showLoadingState?: boolean;
+    LoadingCellComponent?: ComponentType;
+    noDataMessage?: ReactNode;
+    rowSubComponent?: (row: Row<TData>) => ReactElement;
+    isEnableRowSelect?: (original: TData) => boolean;
+    selectColumnProps?: Partial<SelectColumnProps<TData>>;
+};
+type StandardColumn<TData extends DefaultObject = DefaultObject> = ColumnDef<TData>;
+type StandardRow<TData extends DefaultObject = DefaultObject> = Row<TData>;
+type StandardCell<TData extends DefaultObject = DefaultObject> = Cell<TData, unknown>;
+
+type TableRowData = DefaultObject & RowData;
+declare const defaultProps: {
+    hasDefaultPagination: boolean;
+    isLoading: boolean;
+    footerPlacement: never[];
+    loadingMessage: string;
+    labelPerPage: string;
+    parentElementId: string;
+    tableContentId: string;
+    showLoadingState: boolean;
+    LoadingCellComponent: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+    getRowPreProps: () => RowPreProps;
+    isEnableRowSelect: () => boolean;
+    selectColumnProps: {};
+    noDataMessage: string;
+};
+declare const Table: <TData extends TableRowData = DefaultObject>({ columns, data, totalItems, fetchData, controlledPagination, initialState, isLoading, loadingMessage, labelPerPage, footerPlacement, onSortedChange, hasDefaultPagination, onSelectRowsChange, parentElementId, tableContentId, LoadingCellComponent, PaginationComponent, getRowPreProps, getRowId, getSubRows, getTableProps, getHeaderGroupProps, getHeaderProps, getRowProps, getCellProps, getFooterProps, getFooterGroupProps, showLoadingState, noDataMessage, rowSubComponent, isEnableRowSelect, selectColumnProps, }: TableProps<TData>) => react_jsx_runtime.JSX.Element;
+
+export { Table as default, defaultProps };
+export type { CellPropsGetter, ControlledPagination, DefaultObject, HeaderGroupPropsGetter, HeaderPropsGetter, LoadingState, PaginationProps, RowPreProps, RowPropsGetter, SelectColumnProps, StandardCell, StandardColumn, StandardRow, TableProps };

package/dist/index.js

@@ -1,8 +1,494 @@
+import { ArrowDown as e, ArrowUp as t, Color as n, Size as r } from "@propellerads/icon";
+import i from "@propellerads/input-checkbox";
+import { Fragment as a, useEffect as o, useMemo as s, useRef as c, useState as l } from "react";
+import { flexRender as u, getCoreRowModel as ee, getExpandedRowModel as te, getPaginationRowModel as ne, getSortedRowModel as re, useReactTable as ie } from "@tanstack/react-table";
+import d, { css as f, keyframes as p } from "styled-components";
+import { black as m, fontNormal as ae, gray80 as h, gray95 as g, spacing as _, white as v } from "@propellerads/stylevariables";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+//#region src/propsGetter.tsx
+var x = (e) => e.column.columnDef.meta?.align, oe = (e) => e.column.columnDef.meta?.align, S = p`
+  from {
+    background-position-x: 0;
+  }
+  50% {
+    background-position-x: 100%;
+  }
+  100% {
+    background-position-x: 0;
+  }
+`, se = d.div`
+  display: block;
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  background: rgba(255, 255, 255, 0.8);
+  transition: all 0.3s ease;
+  z-index: -1;
+  opacity: 0;
+  pointer-events: none;
 
-'use strict'
+  ${({ $isLoading: e }) => e && f`
+      opacity: 1;
+      z-index: 2;
+      pointer-events: all;
+    `}
+`, ce = d.div`
+  position: absolute;
+  display: block;
+  text-align: center;
+  width: 100%;
+  top: 50%;
+  left: 0;
+  color: rgba(0, 0, 0, 0.6);
+  transform: translateY(-52%);
+  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+`, le = d.div`
+  position: relative;
+  overflow: hidden;
 
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./table.cjs.production.min.js')
-} else {
-  module.exports = require('./table.cjs.development.js')
-}
+  &::before {
+    bottom: 10px;
+    content: '';
+    opacity: 0;
+    pointer-events: none;
+    position: absolute;
+    width: 10px;
+    height: 100%;
+    top: 0;
+    left: -10px;
+    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2);
+    transition: 0.3s opacity;
+  }
+
+  &::after {
+    bottom: 10px;
+    content: '';
+    opacity: 0;
+    pointer-events: none;
+    width: 10px;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    right: -10px;
+    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2);
+    transition: 0.3s opacity;
+  }
+
+  &.shadow_left {
+    &::before {
+      opacity: 1 !important;
+    }
+  }
+
+  &.shadow_right {
+    &::after {
+      opacity: 1 !important;
+    }
+  }
+`, ue = d.div`
+  font-size: ${ae}px;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  border: 0;
+`, de = d.div`
+  display: block;
+  max-width: 100%;
+  overflow-x: scroll;
+  overflow-y: hidden;
+`, fe = d.div`
+  flex: auto 1;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  border-collapse: collapse;
+`, C = d.div`
+  display: inline-flex;
+`, w = d.div`
+  flex: 0 0 ${({ $size: e }) => e ?? 50}px;
+  width: ${({ $size: e }) => e ?? 50}px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  line-height: 1.3rem;
+  padding: 7px 4px;
+  overflow: hidden;
+  transition: width 0.3s ease 0s, min-width, padding, opacity;
+
+  ${({ $align: e }) => e && f`
+      text-align: ${e};
+    `}
+`, T = d.div`
+  width: 100%;
+  height: ${_ * 4}px;
+  background: linear-gradient(to left, ${g}, ${v}, ${g});
+  background-size: 200% 200%;
+  animation: ${S} 1.6s linear infinite;
+`, E = d.div`
+  flex: 0 0 ${({ $size: e }) => e ?? 50}px;
+  width: ${({ $size: e }) => e ?? 50}px;
+  padding: 0 4px;
+  line-height: normal;
+  position: relative;
+  transition: box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
+  color: rgb(0, 0, 0);
+  font-weight: 500;
+  outline: none;
+
+  ${({ $align: e }) => e && f`
+      text-align: ${e};
+    `}
+`, pe = d.div`
+  flex: 1 0 auto;
+  display: flex;
+  flex-direction: column;
+  user-select: none;
+
+  ${E}, ${w} {
+    padding: 0 4px;
+    line-height: normal;
+    position: relative;
+    transition: box-shadow 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+    color: ${m};
+    font-weight: 500;
+    outline: none;
+  }
+`, D = d.div`
+  display: flex;
+  flex: 1 0 auto;
+  box-shadow: inset 0 -1px 0 0 ${g};
+  min-width: 100%;
+  width: max-content;
+`, O = d.div`
+  display: flex;
+  flex: 1 0 auto;
+  padding: 0;
+  align-items: center;
+`, me = d.div`
+  border-top: 1px solid ${h};
+  margin-top: ${_ * 2}px;
+  min-width: 100%;
+  width: max-content;
+`, k = d.div`
+  background: ${g};
+  flex: 1 0 auto;
+  display: flex;
+  flex-direction: column;
+`, A = d.div`
+  display: inline-block;
+  position: absolute;
+  right: 5px;
+  top: 0;
+  z-index: 1;
+  touch-action: none;
+
+  &:after {
+    content: '↔';
+    position: absolute;
+    right: 0;
+    top: 0;
+  }
+`, j = {
+	Top: "top",
+	Bottom: "bottom"
+}, he = (e, t, n, r, i) => ({
+	loadingColumns: s(() => e && t ? r.map((e) => ({
+		...e,
+		cell: () => /* @__PURE__ */ y(i, {})
+	})) : [], [
+		r,
+		t,
+		e
+	]),
+	loadingData: s(() => {
+		if (e && t && r && r.length > 0) {
+			let e = {}, t = [];
+			for (let t = 0; t < r.length; t += 1) e[`empty_${t}`] = "";
+			for (let r = 0; r < n; r += 1) t.push(e);
+			return t;
+		}
+		return [];
+	}, [
+		r,
+		t,
+		n,
+		e
+	])
+}), M = {
+	Left: "shadow_left",
+	Right: "shadow_right"
+}, N = (e, t) => {
+	let { classList: n } = e;
+	n.remove(M.Left, M.Right), n.add(...t);
+}, P = (e, t) => {
+	if (!e || !t) return;
+	let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = [], a = Math.floor(n.left), o = Math.floor(n.right), s = Math.floor(r.left), c = Math.floor(r.right);
+	a < s && i.push(M.Left), o > c && i.push(M.Right), N(t, i);
+}, ge = (e, t) => {
+	o(() => {
+		let n = !1, r = () => {
+			n ||= (window.requestAnimationFrame(() => {
+				P(e.current, t.current), n = !1;
+			}), !0);
+		};
+		return P(e.current, t.current), e?.current?.addEventListener("mousewheel", r), window.addEventListener("resize", r), () => {
+			e?.current?.removeEventListener("mousewheel", r), window.removeEventListener("resize", r);
+		};
+	}, [e.current, t.current]);
+}, F = () => !0, I = {}, L = () => ({}), _e = (e) => {
+	let { subRows: t } = e;
+	if (Array.isArray(t)) return t;
+}, R = {
+	hasDefaultPagination: !1,
+	isLoading: !1,
+	footerPlacement: [],
+	loadingMessage: "loading...",
+	labelPerPage: "Show rows",
+	parentElementId: "parent-element",
+	tableContentId: "",
+	showLoadingState: !1,
+	LoadingCellComponent: T,
+	getRowPreProps: L,
+	isEnableRowSelect: F,
+	selectColumnProps: I,
+	noDataMessage: ""
+}, ve = 0, z = 10, ye = (i) => {
+	let a = i.column.getIsSorted(), o = u(i.column.columnDef.header, i.getContext());
+	return a === "desc" ? /* @__PURE__ */ b(C, { children: [o, /* @__PURE__ */ y(t, {
+		size: r.Small,
+		color: n.GrayDark
+	})] }) : a === "asc" ? /* @__PURE__ */ b(C, { children: [o, /* @__PURE__ */ y(e, {
+		size: r.Small,
+		color: n.GrayDark
+	})] }) : o;
+}, be = (e) => e.column.getCanResize() ? /* @__PURE__ */ y(A, {
+	onMouseDown: e.getResizeHandler(),
+	onTouchStart: e.getResizeHandler(),
+	onClick: (e) => {
+		e.preventDefault(), e.stopPropagation();
+	}
+}) : null, B = ({ columns: e, data: t, totalItems: n, fetchData: r, controlledPagination: d, initialState: f, isLoading: p = R.isLoading, loadingMessage: m = R.loadingMessage, labelPerPage: ae = R.labelPerPage, footerPlacement: h = R.footerPlacement, onSortedChange: g, hasDefaultPagination: _ = R.hasDefaultPagination, onSelectRowsChange: v, parentElementId: S = R.parentElementId, tableContentId: C = R.tableContentId, LoadingCellComponent: T = R.LoadingCellComponent, PaginationComponent: A, getRowPreProps: M = L, getRowId: N, getSubRows: P = _e, getTableProps: F, getHeaderGroupProps: I, getHeaderProps: B, getRowProps: V, getCellProps: H, getFooterProps: U, getFooterGroupProps: W, showLoadingState: G = R.showLoadingState, noDataMessage: xe = R.noDataMessage, rowSubComponent: K, isEnableRowSelect: q = R.isEnableRowSelect, selectColumnProps: Se = R.selectColumnProps }) => {
+	let J = s(() => e, [e]), Y = G && p, X = !Y && typeof v == "function", Ce = typeof g == "function", Z = !!(r && d && Object.keys(d).length > 0);
+	if (_ && Z) throw Error("You have to pass either hasDefaultPagination true boolean prop or pass fetchData callback and controlledPagination data");
+	if (Z && d?.pageCount === void 0) throw Error("You have to pass pageCount in controlledPagination data");
+	let [we, Te] = l([]), [Ee, De] = l({}), [Oe, ke] = l({
+		pageIndex: ve,
+		pageSize: z
+	}), [Ae, je] = l(f?.columnVisibility ?? {});
+	o(() => {
+		f?.columnVisibility && je(f.columnVisibility);
+	}, [f?.columnVisibility]);
+	let Q = s(() => ({
+		id: "selection",
+		enableSorting: !1,
+		header: ({ table: e }) => {
+			let t = e.getRowModel().rows.map((e) => e.original).filter(q).length === 0;
+			return /* @__PURE__ */ y(i, {
+				elementId: "all",
+				onChange: e.toggleAllPageRowsSelected,
+				isChecked: e.getIsAllPageRowsSelected(),
+				isDisabled: t
+			});
+		},
+		cell: ({ row: e }) => {
+			let t = q(e.original);
+			return /* @__PURE__ */ y(i, {
+				elementId: e.id,
+				onChange: e.toggleSelected,
+				isDisabled: !t,
+				isChecked: t && e.getIsSelected()
+			});
+		},
+		...Se
+	}), [q, Se]), { loadingColumns: Me, loadingData: Ne } = he(G, p, Z ? d?.pageSize ?? z : Oe.pageSize, J, T), Pe = s(() => {
+		let e = Y ? Me ?? [] : J;
+		return X ? [Q, ...e] : e;
+	}, [
+		Y,
+		Me,
+		J,
+		X,
+		Q
+	]), Fe = Y ? Ne : t, Ie = Z && d ? {
+		pageIndex: d.pageIndex,
+		pageSize: d.pageSize
+	} : Oe, $ = ie({
+		columns: Pe,
+		data: Fe,
+		getCoreRowModel: ee(),
+		getSortedRowModel: re(),
+		getExpandedRowModel: te(),
+		..._ || Z ? { getPaginationRowModel: ne() } : {},
+		enableRowSelection: X ? (e) => q(e.original) : !1,
+		getRowCanExpand: (e) => !Y && (!!K || e.subRows.length > 0),
+		getRowId: N,
+		getSubRows: P,
+		state: {
+			sorting: we,
+			rowSelection: Ee,
+			pagination: Ie,
+			columnVisibility: Ae
+		},
+		onSortingChange: Te,
+		onRowSelectionChange: De,
+		onPaginationChange: Z ? void 0 : ke,
+		onColumnVisibilityChange: je,
+		manualSorting: Ce,
+		manualPagination: Z ? !0 : void 0,
+		pageCount: Z ? d?.pageCount : void 0,
+		enableSortingRemoval: !1,
+		enableMultiSort: !1,
+		enableColumnResizing: !0,
+		columnResizeMode: "onChange",
+		defaultColumn: { enableResizing: !1 }
+	}), Le = c(null), Re = c(null);
+	ge(Le, Re), o(() => {
+		if (X) {
+			let e = $.getSelectedRowModel().flatRows.map((e) => e.original).filter(q);
+			v?.(e);
+		}
+	}, [Ee, X]);
+	let ze = null;
+	if (Z || _) {
+		let { pageIndex: e, pageSize: i } = $.getState().pagination, a = {
+			setPageSize: $.setPageSize,
+			gotoPage: $.setPageIndex,
+			canNextPage: $.getCanNextPage(),
+			canPreviousPage: $.getCanPreviousPage(),
+			parentElementId: S,
+			labelPerPage: ae,
+			pageIndex: e,
+			previousPageHandler: $.previousPage,
+			nextPageHandler: $.nextPage,
+			totalPages: $.getPageCount(),
+			perPage: i,
+			totalItems: n ?? t.length
+		};
+		Z && d && (a.canNextPage = d.pageIndex + 1 !== a.totalPages, a.canPreviousPage = d.pageIndex !== 0, a.pageIndex = d.pageIndex, a.perPage = d.pageSize, a.setPageSize = (e) => {
+			r?.({
+				pageIndex: d.pageIndex,
+				pageSize: e
+			});
+		}, a.gotoPage = (e) => {
+			r?.({
+				pageIndex: e,
+				pageSize: d.pageSize
+			});
+		}, a.nextPageHandler = () => {
+			r?.({
+				pageIndex: d.pageIndex + 1,
+				pageSize: d.pageSize
+			});
+		}, a.previousPageHandler = () => {
+			r?.({
+				pageIndex: d.pageIndex - 1,
+				pageSize: d.pageSize
+			});
+		}, d.paginationAmount && (a.paginationAmount = d.paginationAmount)), ze = A ? /* @__PURE__ */ y(A, { ...a }) : null;
+	}
+	let Be = (e) => {
+		if (!e.column.getCanSort()) return;
+		let t = e.column.getIsSorted(), n = [{
+			id: e.column.id,
+			desc: t !== "desc"
+		}];
+		Ce && g?.(n), Te(n);
+	}, Ve = $.getHeaderGroups(), He = $.getFooterGroups(), Ue = $.getRowModel().rows;
+	return /* @__PURE__ */ b(ue, {
+		className: "table-root",
+		children: [
+			/* @__PURE__ */ y(se, {
+				$isLoading: !G && p,
+				className: "table-loading",
+				children: /* @__PURE__ */ y(ce, { children: m })
+			}),
+			/* @__PURE__ */ y(le, {
+				ref: Re,
+				className: "table-wrapper",
+				children: /* @__PURE__ */ y(de, {
+					id: C,
+					className: "table-content",
+					children: /* @__PURE__ */ b(fe, {
+						...F?.(),
+						ref: Le,
+						children: [
+							/* @__PURE__ */ y(pe, {
+								className: "table-head",
+								"data-role": "table-head",
+								children: Ve.map((e) => /* @__PURE__ */ y(O, {
+									...I?.(e),
+									children: e.headers.map((e) => /* @__PURE__ */ b(E, {
+										$size: e.getSize(),
+										onClick: () => Be(e),
+										...B?.(e),
+										children: [e.isPlaceholder ? null : ye(e), be(e)]
+									}, e.id))
+								}, e.id))
+							}),
+							h.includes(j.Top) && /* @__PURE__ */ y(k, {
+								className: "table-footer-top",
+								"data-role": "table-footer-top",
+								children: He.map((e) => /* @__PURE__ */ y(O, {
+									...W?.(e),
+									children: e.headers.map((e) => /* @__PURE__ */ y(w, {
+										$size: e.getSize(),
+										$align: x(e),
+										...U?.(e),
+										children: e.isPlaceholder ? null : u(e.column.columnDef.footer, e.getContext())
+									}, e.id))
+								}, e.id))
+							}),
+							/* @__PURE__ */ y(me, {
+								className: "table-body",
+								"data-role": "table-body",
+								children: Ue.map((e) => {
+									let { isDelimiterTd: t } = Y ? L() : M(e);
+									if (t) {
+										let t = e.getVisibleCells()[0];
+										return t ? /* @__PURE__ */ b(a, { children: [/* @__PURE__ */ y(D, { children: /* @__PURE__ */ y(O, {
+											...Y ? void 0 : V?.(e),
+											children: /* @__PURE__ */ y(w, {
+												style: { flex: "1 0 0%" },
+												...Y ? void 0 : H?.(t),
+												children: /* @__PURE__ */ y("strong", { children: u(t.column.columnDef.cell, t.getContext()) })
+											})
+										}) }), !Y && e.getIsExpanded() && K && K(e)] }, `group_${e.index}`) : null;
+									}
+									return /* @__PURE__ */ b(a, { children: [/* @__PURE__ */ y(D, { children: /* @__PURE__ */ y(O, {
+										...Y ? void 0 : V?.(e),
+										children: e.getVisibleCells().map((e) => /* @__PURE__ */ y(w, {
+											$size: e.column.getSize(),
+											$align: oe(e),
+											...Y ? void 0 : H?.(e),
+											children: u(e.column.columnDef.cell, e.getContext())
+										}, e.id))
+									}) }), !Y && e.getIsExpanded() && K && K(e)] }, `group_${e.index}`);
+								})
+							}),
+							h.includes(j.Bottom) && /* @__PURE__ */ y(k, {
+								className: "table-footer-bottom",
+								"data-role": "table-footer-bottom",
+								children: He.map((e) => /* @__PURE__ */ y(O, {
+									...W?.(e),
+									children: e.headers.map((e) => /* @__PURE__ */ y(w, {
+										$size: e.getSize(),
+										$align: x(e),
+										...U?.(e),
+										children: e.isPlaceholder ? null : u(e.column.columnDef.footer, e.getContext())
+									}, e.id))
+								}, e.id))
+							})
+						]
+					})
+				})
+			}),
+			!p && !t.length && xe,
+			ze
+		]
+	});
+};
+//#endregion
+export { B as default, R as defaultProps };
+
+//# sourceMappingURL=index.js.map