import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from "../../lib/utils";
export function SimpleTable({ items, columns, onRowHover, onRowClick, rowClassName, "data-testid": dataTestId, }) {
    return (_jsxs("table", { className: "text-surface min-w-full table-auto text-left text-xs font-light", "data-testid": dataTestId, children: [_jsx("thead", { className: "border-border-default border-b", children: _jsx("tr", { children: columns.map((col, index) => (_jsx("th", { className: "px-1.5 py-1.5 font-medium", children: col.header }, index))) }) }), _jsx("tbody", { children: items.map((item, index) => (_jsx("tr", { className: cn("border-border-default border-b", onRowClick ? "hover:bg-neutral-grey-5 cursor-pointer" : "", rowClassName ? rowClassName(item) : ""), onClick: (ev) => {
                        if (onRowClick)
                            onRowClick({ item, event: ev });
                    }, onMouseOver: () => onRowHover?.(item), onMouseLeave: () => onRowHover?.(undefined), children: columns.map((col, index) => (_jsx("td", { className: cn("p-2", col.className), children: col.body(item) }, index))) }, index))) })] }));
}
//# sourceMappingURL=SimpleTable.js.map