@blocktion/json-to-table
Version:
A powerful, modular React component for converting JSON data to navigable tables with advanced features like automatic column detection, theming, and sub-table navigation. Part of the Blocktion SaaS project ecosystem.
14 lines (13 loc) • 1.17 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { TableCell } from "./TableCell";
export const TableRow = ({ row, rowIndex, columns, onRowClick, onCellClick, onNavigateToSubTable, enableNavigation, showRowNumbers, customRenderers = {}, }) => {
const handleRowClick = () => {
onRowClick?.(row, rowIndex);
};
return (_jsxs("tr", { className: "border-b border-lace-cap hover:bg-ma-white transition-colors duration-150", onClick: handleRowClick, style: { cursor: onRowClick ? "pointer" : "default" }, children: [showRowNumbers && (_jsx("td", { className: "px-2 py-4 whitespace-nowrap text-body-sm text-jet-grey align-top text-center row-number-column", style: {
width: "50px",
minWidth: "50px",
maxWidth: "50px",
boxSizing: "border-box",
}, children: rowIndex + 1 })), columns.map((column) => (_jsx(TableCell, { column: column, row: row, onNavigateToSubTable: onNavigateToSubTable, onCellClick: onCellClick, enableNavigation: enableNavigation, showRowNumbers: showRowNumbers, customRenderers: customRenderers }, column.key)))] }));
};