import { jsx, jsxs } from 'react/jsx-runtime';
import { memo } from 'react';
import classNames from '../../../_virtual/index.js';
import { getColumnLeftPosition } from '../utils/virtualization.js';
import Tooltip from '../../Tooltip/Tooltip.js';
import Icon from '../../Icon/Icon.js';
import Typography from '../../Typography/Typography.js';
import Checkbox from '../../Checkbox/Checkbox.js';

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 { TableHeader as default };
//# sourceMappingURL=TableHeader.js.map
