@appbuckets/react-ui
Version:
Just Another React UI Framework
89 lines (86 loc) • 2.31 kB
JavaScript
import { __assign } from 'tslib';
import * as React from 'react';
import clsx from 'clsx';
import { useRxTable } from '../RxTable.context.js';
import Cell from '../atoms/Cell.js';
import SingleRowSelector from '../atoms/SingleRowSelector.js';
/* --------
* Component Definition
* -------- */
var BodyRow = function (props) {
/** Extract row index from props */
var index = props.index,
style = props.style;
// ----
// Get Context Props
// ----
var _a = useRxTable(),
classes = _a.classes,
columns = _a.columns,
BodyRowComponent = _a.Components.BodyRow,
isVirtualized = _a.layout.isVirtualized,
tableData = _a.tableData,
_b = _a.interaction,
isRowClickEnabled = _b.isRowClickEnabled,
superHandleRowClick = _b.handleRowClick,
_c = _a.selection,
isDataSelectable = _c.enabled,
isRowSelected = _c.isRowSelected,
styles = _a.styles;
// ----
// Extract Data from Array
// ----
var row = tableData[index];
// ----
// Build Default row Class
// ----
var bodyRowClasses = clsx(
{
last: index === tableData.length - 1,
first: index === 0,
clickable: isRowClickEnabled,
selected: isRowSelected(row),
},
classes.BodyRow
);
// ----
// Handlers
// ----
var handleRowClick = React.useCallback(
function () {
superHandleRowClick(index);
},
[superHandleRowClick, index]
);
// ----
// Render the Row
// ----
return React.createElement(
BodyRowComponent,
{
className: bodyRowClasses,
columns: columns.current,
onClick: isRowClickEnabled ? handleRowClick : undefined,
isVirtualized: isVirtualized,
rowIndex: index,
row: row,
style: __assign(__assign({}, style), styles.BodyRow),
},
columns.current.map(function (column, columnIndex) {
return React.createElement(Cell, {
key: column.key,
className:
isDataSelectable && columnIndex === 0 ? 'selector' : undefined,
column: column,
row: row,
rowIndex: index,
overrideContent:
isDataSelectable && columnIndex === 0
? React.createElement(SingleRowSelector, { row: row })
: undefined,
});
})
);
};
BodyRow.displayName = 'BodyRow';
export { BodyRow as default };