import { j as jsxRuntimeExports } from '../../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
import { TableIcon } from '../../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
import { clsx } from '../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
import { flexRender } from '../../../node_modules/.pnpm/@tanstack_react-table@8.9.2_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@tanstack/react-table/build/lib/index.js';
import { forwardRef, useRef, useCallback, useEffect } from 'react';
import Skeleton from '../../../node_modules/.pnpm/react-loading-skeleton@3.4.0_react@18.2.0/node_modules/react-loading-skeleton/dist/index.js';
import { Badge } from '../../badge/badge.js';
import { EmptyState } from '../../empty-state/empty-state.js';
import { Flex } from '../../flex/flex.js';
import { Table } from '../../table/table.js';
import { useDataTable } from '../hooks/useDataTable.js';
import styles from '../data-table.module.css.js';

function Headers({ headerGroups = [], className = "", }) {
    return (jsxRuntimeExports.jsx(Table.Header, { className: className, children: headerGroups?.map((headerGroup) => (jsxRuntimeExports.jsx(Table.Row, { children: headerGroup?.headers?.map((header) => {
                const columnDef = header.column.columnDef;
                return (jsxRuntimeExports.jsx(Table.Head, { colSpan: header.colSpan, className: columnDef.classNames?.header, style: columnDef.styles?.header, children: flexRender(columnDef.header, header.getContext()) }, header.id));
            }) }, headerGroup?.id))) }));
}
function LoaderRows({ rowCount, columnCount, }) {
    const rows = Array.from({ length: rowCount });
    return rows.map((_, rowIndex) => {
        const columns = Array.from({ length: columnCount });
        return (jsxRuntimeExports.jsx(Table.Row, { children: columns.map((_, colIndex) => (jsxRuntimeExports.jsx(Table.Cell, { children: jsxRuntimeExports.jsx(Skeleton, { highlightColor: "var(--rs-color-background-base-primary)", baseColor: "var(--rs-color-background-base-primary-hover)" }) }, "loading-column-" + colIndex))) }, "loading-row-" + rowIndex));
    });
}
function GroupHeader({ colSpan, data, }) {
    return (jsxRuntimeExports.jsx(Table.SectionHeader, { colSpan: colSpan, children: jsxRuntimeExports.jsxs(Flex, { gap: 3, align: "center", children: [data?.label, data.showGroupCount ? (jsxRuntimeExports.jsx(Badge, { variant: "neutral", children: data?.count })) : null] }) }));
}
const Rows = forwardRef((props, lastRowRef) => {
    const { rows = [], onRowClick, classNames } = props;
    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: rows?.map((row, index) => {
            const isSelected = row.getIsSelected();
            const cells = row.getVisibleCells() || [];
            const isSectionHeadingRow = row.depth === 0 && row.getIsExpanded();
            const isLastRow = index === rows.length - 1;
            const rowKey = row.id + "-" + index;
            return isSectionHeadingRow ? (jsxRuntimeExports.jsx(GroupHeader, { colSpan: cells.length, data: row.original }, rowKey)) : (jsxRuntimeExports.jsx(Table.Row, { className: clsx(styles["row"], onRowClick ? styles["clickable"] : "", classNames?.row), "data-state": isSelected && "selected", ref: isLastRow ? lastRowRef : undefined, onClick: () => onRowClick?.(row.original), children: cells.map((cell) => {
                    const columnDef = cell.column.columnDef;
                    return (jsxRuntimeExports.jsx(Table.Cell, { className: clsx(styles["cell"], columnDef.classNames?.cell), style: columnDef.styles?.cell, children: flexRender(columnDef.cell, cell.getContext()) }, cell.id));
                }) }, rowKey));
        }) }));
});
const DefaultEmptyComponent = () => (jsxRuntimeExports.jsx(EmptyState, { icon: jsxRuntimeExports.jsx(TableIcon, {}), heading: "No Data" }));
function Content({ emptyState, classNames = {}, }) {
    const { onRowClick, table, mode, isLoading, loadMoreData, loadingRowCount = 3, } = useDataTable();
    const headerGroups = table?.getHeaderGroups();
    const { rows = [] } = table?.getRowModel();
    const lastRowRef = useRef(null);
    const observerRef = useRef(null);
    const handleObserver = useCallback((entries) => {
        const target = entries[0];
        if (target.isIntersecting && !isLoading) {
            loadMoreData();
        }
    }, [loadMoreData, isLoading]);
    useEffect(() => {
        if (mode !== "server")
            return;
        if (observerRef.current) {
            observerRef.current.disconnect();
        }
        observerRef.current = new IntersectionObserver(handleObserver, {
            threshold: 0.1,
        });
        const lastRow = lastRowRef.current;
        if (lastRow) {
            observerRef.current.observe(lastRow);
        }
        return () => {
            if (observerRef.current && lastRow) {
                observerRef.current.unobserve(lastRow);
                observerRef.current.disconnect();
            }
        };
    }, [mode, rows.length, handleObserver]);
    const visibleColumnsLength = table.getVisibleLeafColumns().length;
    return (jsxRuntimeExports.jsx("div", { className: classNames.root, children: jsxRuntimeExports.jsxs(Table, { className: classNames.table, children: [jsxRuntimeExports.jsx(Headers, { headerGroups: headerGroups, className: classNames.header }), jsxRuntimeExports.jsx(Table.Body, { className: classNames.body, children: rows?.length || isLoading ? (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(Rows, { rows: rows, ref: lastRowRef, onRowClick: onRowClick, classNames: {
                                    row: classNames.row,
                                } }), isLoading ? (jsxRuntimeExports.jsx(LoaderRows, { rowCount: loadingRowCount, columnCount: visibleColumnsLength })) : null] })) : (jsxRuntimeExports.jsx(Table.Row, { children: jsxRuntimeExports.jsx(Table.Cell, { colSpan: visibleColumnsLength, children: emptyState || jsxRuntimeExports.jsx(DefaultEmptyComponent, {}) }) })) })] }) }));
}

export { Content };
//# sourceMappingURL=content.js.map
