phx-react
Version:
PHX REACT
65 lines • 3.34 kB
JavaScript
import React from 'react';
import { classNames } from '../../types';
import ExpandedRows from './ExpandedRows';
import Row from './Row';
import RowMerge from './RowMerge';
/**
* Renders one body cell using either merge-row or normal-row behavior.
*
* @param props - Cell data, table configuration, and expansion state.
* @returns A table body cell component.
*/
function TableBodyCell({ bodyKey, border, brSetSelectedPeople, data, dataIdx, isExpanded, isHighlight, keyIdx, mergeConfig, readonly, rowChildren, rowClassName, rowHighlightReadonly, rowKey, selectedAllPeople, selectedPeople, tableKey, thBodyComponent, toggleRowExpanded, }) {
const commonProps = {
border,
bodyKey,
brSetSelectedPeople,
className: rowClassName(keyIdx, dataIdx),
data,
dataIdx,
highlightReadonly: rowHighlightReadonly,
selectedAllPeople,
isHighlight,
selectedPeople,
keyIdx,
thBodyComponent,
readonly,
tableKey,
};
if (mergeConfig.isMergeRowData) {
return React.createElement(RowMerge, { ...commonProps, mergeConfig: mergeConfig });
}
return (React.createElement(Row, { ...commonProps, expandable: rowChildren && keyIdx === rowChildren.columnIndex
? {
enable: true,
isExpanded,
onToggle: () => toggleRowExpanded(rowKey),
}
: undefined }));
}
/**
* Renders one parent table row and its expanded children.
*
* @param props - Row data, table configuration, and expansion handlers.
* @returns One parent row with optional expanded rows.
*/
function TableBodyRow({ data, dataIdx, expandedRowKeys, getRowChildren, getRowKey, handleClick, isHighLight, mergeConfig, thBody, ...restProps }) {
const rowChildren = getRowChildren(data);
const rowKey = getRowKey(data, dataIdx);
const isExpanded = expandedRowKeys.includes(rowKey);
const isHighlight = isHighLight(data);
return (React.createElement(React.Fragment, { key: rowKey },
React.createElement("tr", { className: classNames('group', isHighlight && 'bg-gray-100 font-semibold'), onClick: () => handleClick(data, isHighlight) }, thBody.map((bodyKey, keyIdx) => (React.createElement(TableBodyCell, { key: keyIdx, ...restProps, bodyKey: bodyKey, data: data, dataIdx: dataIdx, isExpanded: isExpanded, isHighlight: isHighlight, keyIdx: keyIdx, mergeConfig: mergeConfig, rowChildren: rowChildren, rowKey: rowKey })))),
!mergeConfig.isMergeRowData && rowChildren && isExpanded && (React.createElement(ExpandedRows, { border: restProps.border, dataIdx: dataIdx, rowChildren: rowChildren, selectedAllPeople: restProps.selectedAllPeople, spacing: restProps.spacing, textCenter: restProps.textCenter, thBody: thBody }))));
}
/**
* Renders table report body rows and their optional expanded child rows.
*
* @param props - Body row data, table configuration, and row interaction handlers.
* @returns Table body row elements.
*/
function TableBodyRows({ rows, ...config }) {
return (React.createElement(React.Fragment, null, rows.map((data, dataIdx) => (React.createElement(TableBodyRow, { key: config.getRowKey(data, dataIdx), ...config, data: data, dataIdx: dataIdx })))));
}
export default TableBodyRows;
//# sourceMappingURL=TableBodyRows.js.map