@coreui/react-pro
Version:
UI Components Library for React.js
87 lines (84 loc) • 5.46 kB
JavaScript
import { __rest, __assign } from '../../node_modules/tslib/tslib.es6.js';
import React, { forwardRef, useMemo } from 'react';
import PropTypes from 'prop-types';
import { CTableBody } from '../table/CTableBody.js';
import '../form/CForm.js';
import { CFormCheck } from '../form/CFormCheck.js';
import '../form/CFormControlValidation.js';
import '../form/CFormControlWrapper.js';
import '../form/CFormFeedback.js';
import '../form/CFormFloating.js';
import '../form/CFormInput.js';
import '../form/CFormLabel.js';
import '../form/CFormRange.js';
import '../form/CFormSelect.js';
import '../form/CFormSwitch.js';
import '../form/CFormText.js';
import '../form/CFormTextarea.js';
import '../form/CInputGroup.js';
import '../form/CInputGroupText.js';
import '../table/CTable.js';
import '../table/CTableCaption.js';
import { CTableDataCell } from '../table/CTableDataCell.js';
import '../table/CTableFoot.js';
import '../table/CTableHead.js';
import '../table/CTableHeaderCell.js';
import { CTableRow } from '../table/CTableRow.js';
import isObjectInArray from '../../utils/isObjectInArray.js';
import { ITEM_INTERNAL_KEYS } from './consts.js';
import { getColumns, getClickedColumnName, getColumnName, getTableDataCellProps, getTableDataCellStyles } from './utils.js';
var CSmartTableBody = forwardRef(function (_a, ref) {
var clickableRows = _a.clickableRows, columnNames = _a.columnNames, columns = _a.columns, currentItems = _a.currentItems, firstItemOnActivePageIndex = _a.firstItemOnActivePageIndex, noItemsLabel = _a.noItemsLabel, onRowChecked = _a.onRowChecked, onRowClick = _a.onRowClick, scopedColumns = _a.scopedColumns, selectable = _a.selectable, selected = _a.selected, rest = __rest(_a, ["clickableRows", "columnNames", "columns", "currentItems", "firstItemOnActivePageIndex", "noItemsLabel", "onRowChecked", "onRowClick", "scopedColumns", "selectable", "selected"]);
var colspan = selectable ? columns.length + 1 : columns.length;
var _columns = useMemo(function () { return getColumns(columns); }, [columns]);
return (React.createElement(CTableBody, __assign({}, (clickableRows && {
style: { cursor: 'pointer' },
}), rest, { ref: ref }), currentItems.length > 0 ? (currentItems.map(function (item, trIndex) {
return (React.createElement(React.Fragment, { key: trIndex },
React.createElement(CTableRow, __assign({}, (item._props && __assign({}, item._props)), (clickableRows && { tabIndex: 0 }), { onClick: function (event) {
return onRowClick &&
onRowClick(item, trIndex + firstItemOnActivePageIndex, getClickedColumnName(event.target, columnNames, selectable), event);
} }),
selectable && (React.createElement(CTableDataCell, null,
React.createElement(CFormCheck, { checked: selected &&
isObjectInArray(selected, item, ITEM_INTERNAL_KEYS), disabled: item._selectable === false, onChange: function (event) {
var _item = __assign({}, item);
for (var _i = 0, ITEM_INTERNAL_KEYS_1 = ITEM_INTERNAL_KEYS; _i < ITEM_INTERNAL_KEYS_1.length; _i++) {
var key = ITEM_INTERNAL_KEYS_1[_i];
delete _item[key];
}
onRowChecked && onRowChecked(_item, event.target.checked);
} }))),
_columns.map(function (column, index) {
var colName = getColumnName(column);
return ((scopedColumns &&
scopedColumns[colName] &&
React.cloneElement(scopedColumns[colName](item, trIndex + firstItemOnActivePageIndex), {
key: index,
})) ||
(item[colName] !== undefined && (React.createElement(CTableDataCell, __assign({}, getTableDataCellProps(column, item, colName), { style: getTableDataCellStyles(column, item, colName), key: index }), item[colName]))));
})),
scopedColumns && scopedColumns.details && (React.createElement(React.Fragment, null,
React.createElement(CTableRow, null,
React.createElement(CTableDataCell, { colSpan: colspan, className: "p-0", style: { borderBottomWidth: 0 }, tabIndex: -1 })),
React.createElement(CTableRow, { className: "p-0", key: "details".concat(trIndex) },
React.createElement(CTableDataCell, { colSpan: colspan, className: "p-0", style: { border: 0 } }, scopedColumns.details(item, trIndex + firstItemOnActivePageIndex)))))));
})) : (React.createElement(CTableRow, null,
React.createElement(CTableDataCell, { colSpan: colspan }, noItemsLabel)))));
});
CSmartTableBody.propTypes = {
clickableRows: PropTypes.bool,
columns: PropTypes.array.isRequired,
currentItems: PropTypes.array.isRequired,
firstItemOnActivePageIndex: PropTypes.number.isRequired,
noItemsLabel: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
onRowChecked: PropTypes.func,
onRowClick: PropTypes.func,
columnNames: PropTypes.array.isRequired,
scopedColumns: PropTypes.object,
selectable: PropTypes.bool,
selected: PropTypes.array,
};
CSmartTableBody.displayName = 'CSmartTableBody';
export { CSmartTableBody };
//# sourceMappingURL=CSmartTableBody.js.map