import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from "#scalars";
import { useCallback } from "react";
import { getColumnTitle } from "../utils.js";
import { HeaderCell } from "./header/header-cell.js";
import { HeaderNumberTd } from "./header/header-number-td.js";
import { useInternalTableState } from "./table-provider/table-provider.js";
const TableHeader = ({ columns }) => {
    const { config: { data, allowRowSelection }, state: { selectedRowIndexes }, api, } = useInternalTableState();
    const handleSelectAllRows = useCallback(() => {
        if (!allowRowSelection)
            return;
        api.selection.toggleSelectAll();
    }, [allowRowSelection]);
    const isAllRowsSelected = selectedRowIndexes.length === data.length;
    return (_jsx("thead", { children: _jsxs("tr", { className: cn("border-gray-300", !selectedRowIndexes.includes(0) && "border-b"), children: [_jsx(HeaderNumberTd, { isAllRowsSelected: isAllRowsSelected, handleSelectAllRows: handleSelectAllRows }), columns.map((column) => (_jsx(HeaderCell, { children: getColumnTitle(column) }, column.field)))] }) }));
};
export { TableHeader };
//# sourceMappingURL=header.js.map