"use client";
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
import { TableIcon } from '../../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.2.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
import { flexRender } from '../../../node_modules/.pnpm/@tanstack_react-table@8.9.2_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@tanstack/react-table/build/lib/index.js';
import { cx } from '../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
import { forwardRef, useRef, useCallback, useEffect } from 'react';
import { Badge } from '../../badge/badge.js';
import { EmptyState } from '../../empty-state/empty-state.js';
import { Flex } from '../../flex/flex.js';
import { Skeleton } from '../../skeleton/skeleton.js';
import { Table } from '../../table/table.js';
import styles from '../data-table.module.css.js';
import { useDataTable } from '../hooks/useDataTable.js';

function Headers({ headerGroups = [], className = '' }) {
    return (jsx(Table.Header, { className: className, children: headerGroups?.map(headerGroup => (jsx(Table.Row, { children: headerGroup?.headers?.map(header => {
                const columnDef = header.column.columnDef;
                return (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 (jsx(Table.Row, { children: columns.map((_, colIndex) => (jsx(Table.Cell, { children: jsx(Skeleton, {}) }, 'loading-column-' + colIndex))) }, 'loading-row-' + rowIndex));
    });
}
function GroupHeader({ colSpan, data }) {
    return (jsx(Table.SectionHeader, { colSpan: colSpan, children: jsxs(Flex, { gap: 3, align: 'center', children: [data?.label, data.showGroupCount ? (jsx(Badge, { variant: 'neutral', children: data?.count })) : null] }) }));
}
const Rows = forwardRef((props, lastRowRef) => {
    const { rows = [], onRowClick, classNames } = props;
    return (jsx(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 ? (jsx(GroupHeader, { colSpan: cells.length, data: row.original }, rowKey)) : (jsx(Table.Row, { className: cx(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 (jsx(Table.Cell, { className: cx(styles['cell'], columnDef.classNames?.cell), style: columnDef.styles?.cell, children: flexRender(columnDef.cell, cell.getContext()) }, cell.id));
                }) }, rowKey));
        }) }));
});
const DefaultEmptyComponent = () => (jsx(EmptyState, { icon: jsx(TableIcon, {}), heading: 'No Data' }));
function Content({ emptyState, classNames = {} }) {
    const { onRowClick, table, mode, isLoading, loadMoreData, loadingRowCount = 3 } = useDataTable();
    const headerGroups = table?.getHeaderGroups();
    const rowModel = table?.getRowModel();
    const { rows = [] } = rowModel || {};
    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;
    const hasData = rows?.length > 0 || isLoading;
    return (jsx("div", { className: classNames.root, children: jsxs(Table, { className: classNames.table, children: [hasData && (jsx(Headers, { headerGroups: headerGroups, className: classNames.header })), jsx(Table.Body, { className: classNames.body, children: hasData ? (jsxs(Fragment, { children: [jsx(Rows, { rows: rows, ref: lastRowRef, onRowClick: onRowClick, classNames: {
                                    row: classNames.row
                                } }), isLoading ? (jsx(LoaderRows, { rowCount: loadingRowCount, columnCount: visibleColumnsLength })) : null] })) : (jsx(Table.Row, { children: jsx(Table.Cell, { colSpan: visibleColumnsLength, className: styles.emptyStateCell, children: emptyState || jsx(DefaultEmptyComponent, {}) }) })) })] }) }));
}

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