'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var Checkbox = require('../../Field/checkbox/Checkbox.js');
var styles = require('../styles.js');
var utils = require('../utils.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

const TableHeader = ({ columns, selectAllRows, rows, selectedRows, rowIdentifier, 'data-testid': dataTestId, 'data-trackid': dataTrackId, }) => {
    const [selectAll, setSelectAll] = React.useState(false);
    React.useEffect(() => {
        if (selectedRows &&
            (selectedRows.length === 0 || selectedRows.length < rows.length)) {
            setSelectAll(false);
        }
    }, [selectedRows]);
    return (React__default['default'].createElement("thead", { "data-testid": dataTestId, "data-trackid": dataTrackId },
        React__default['default'].createElement("tr", { role: "row" },
            selectedRows && typeof selectAllRows === 'function' && (React__default['default'].createElement(styles.CheckboxCell, { as: "th", role: "columnheader" },
                React__default['default'].createElement(Checkbox.Checkbox, { onChange: () => {
                        setSelectAll((prevSelectAllState) => {
                            const updatedSelectAll = !prevSelectAllState;
                            let rowIds = [];
                            if (rowIdentifier) {
                                rowIds = rows.map((row) => utils.getRowIdByIdentifier(row, rowIdentifier));
                            }
                            selectAllRows(rowIds, updatedSelectAll);
                            return updatedSelectAll;
                        });
                    }, checked: selectAll, name: "select-all", value: 0, indeterminate: selectedRows.length > 0 && !selectAll }))),
            columns.map((column, index) => !column.hideHeader && (React__default['default'].createElement(styles.Th, { key: `${index}_${column.header.title}`, textAlign: column.textAlign, onClick: column.onClick, columnWidth: column.width, role: "columnheader" },
                React__default['default'].createElement(styles.ThContainer, null,
                    React__default['default'].createElement("span", null, column.header.title),
                    column.header.icon)))))));
};

exports['default'] = TableHeader;
