@appbuckets/react-ui
Version:
Just Another React UI Framework
141 lines (138 loc) • 3.49 kB
JavaScript
import * as React from 'react';
import { childrenUtils } from '@appbuckets/react-ui-core';
import useCellElementContent from '../lib/useCellElementContent.js';
import TableCell from '../../Table/TableCell.js';
import TableCellContent from '../../Table/TableCellContent.js';
/* --------
* Component Definition
* -------- */
var RxTableBodyCell = function (props) {
var children = props.children,
className = props.className,
column = props.column,
isVirtualized = props.isVirtualized,
tableData = props.tableData,
rowIndex = props.rowIndex,
row = props.row,
style = props.style;
var Content = column.Content,
render = column.render,
cell = column.cell,
key = column.key;
// ----
// Memoize Cell Element Content
// ----
var metaContent = useCellElementContent(
cell === null || cell === void 0 ? void 0 : cell.meta,
row,
rowIndex,
tableData
);
var headerContent = useCellElementContent(
cell === null || cell === void 0 ? void 0 : cell.header,
row,
rowIndex,
tableData
);
var contentContent = useCellElementContent(
cell === null || cell === void 0 ? void 0 : cell.content,
row,
rowIndex,
tableData
);
var renderedContent = useCellElementContent(render, row, rowIndex, tableData);
// ----
// Build the Wrapper
// ----
var Wrapper = React.useCallback(
function (_a) {
var wrapperChildren = _a.children;
if (!isVirtualized) {
return React.createElement(
TableCell,
{ className: className, style: style },
wrapperChildren
);
}
return React.createElement(
'div',
{ className: className, style: style },
React.createElement(
'div',
{ className: 'virtualized cell-content' },
wrapperChildren
)
);
},
[isVirtualized, className, style]
);
// ----
// Render Children if they are declared
// ----
if (!childrenUtils.isNil(children)) {
return React.createElement(Wrapper, null, children);
}
// ----
// If Content Component has been declared, use it
// ----
if (Content) {
return React.createElement(
Wrapper,
null,
React.createElement(Content, {
column: column,
data: tableData,
rowIndex: rowIndex,
row: row,
})
);
}
// ----
// If a render function has been declared, use it
// ----
if (typeof render === 'function') {
return React.createElement(Wrapper, null, renderedContent);
}
// ----
// Render the Content using Shorthand
// ----
if (cell) {
return React.createElement(
Wrapper,
null,
TableCellContent.create(metaContent, {
autoGenerateKey: false,
overrideProps: {
type: 'meta',
},
}),
TableCellContent.create(headerContent, {
autoGenerateKey: false,
overrideProps: {
type: 'title',
},
}),
TableCellContent.create(contentContent, {
autoGenerateKey: false,
overrideProps: {
type: 'content',
},
})
);
}
// ----
// Render the Content using column key
// ----
return React.createElement(
Wrapper,
null,
TableCellContent.create(row[key] || '', {
autoGenerateKey: false,
overrideProps: {
type: 'title',
},
})
);
};
RxTableBodyCell.displayName = 'RxTableBodyCell';
export { RxTableBodyCell as default };