import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { memo } from 'react';
import classNames from 'classnames';
import { getColumnLeftPosition } from '../utils/virtualization';
import Tooltip from '../../Tooltip';
import Icon from '../../Icon';
import Typography from '../../Typography';
import Checkbox from '../../Checkbox';
const TableHeader = memo((props) => {
    const { columns, freezeColumns, headerType, tableHeadClass, headerTextColor, headerCheckboxDisabled, withCheckbox, allSelected, partialSelected, headerIconName = '', headerIconOnClick, headerIconTooltipTitle, tableHeaderZindex, onSelectClick, withFixedHeader, } = props;
    return (_jsx("thead", { className: classNames('ff-table-header', { 'ff-table-fixed-header': withFixedHeader }, tableHeadClass), style: { zIndex: tableHeaderZindex }, children: _jsx("tr", { children: columns.map((column, index) => {
                const isFrozen = freezeColumns && index < freezeColumns;
                return (_jsxs("th", { className: classNames('ff-table-header-cell', headerType !== 'default' ? `ff-table-${headerType}-bg` : '', headerTextColor && `ff-table-${headerTextColor}-color`), style: {
                        position: isFrozen ? 'sticky' : 'static',
                        left: isFrozen
                            ? getColumnLeftPosition(index, columns, freezeColumns)
                            : 'auto',
                        zIndex: isFrozen ? 999 : 'auto',
                        width: column.width ? `${column.width}px` : 'auto',
                        padding: '8px 8px',
                        boxSizing: 'border-box',
                        paddingRight: isFrozen ? 0 : '8px',
                    }, children: [_jsx("div", { className: "ff-table-icon", children: _jsx(Tooltip, { title: headerIconTooltipTitle || '', placement: "bottom", children: _jsx(Icon, { height: 14, width: 14, name: headerIconName, onClick: headerIconOnClick, cursorType: "pointer" }) }) }), _jsxs(Typography, { style: column.width ? { width: column.width } : undefined, as: "div", fontWeight: "semi-bold", className: "ff-table-label-checkbox-container", children: [index === 0 && withCheckbox && (_jsx("span", { className: "ff-table-checkbox-table", children: _jsx(Checkbox, { onChange: (e) => onSelectClick(e, {
                                            allSelected: e.target.checked,
                                        }), checked: allSelected || false, partial: !!partialSelected, disabled: headerCheckboxDisabled }) })), column.header] })] }, column.header));
            }) }) }));
});
export default TableHeader;
//# sourceMappingURL=TableHeader.js.map