UNPKG

@coreui/react-pro

Version:

UI Components Library for React.js

74 lines (70 loc) 4.81 kB
'use strict'; var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js'); var React = require('react'); var PropTypes = require('prop-types'); var index = require('../../_virtual/index.js'); var CTableHead = require('./CTableHead.js'); var CTableHeaderCell = require('./CTableHeaderCell.js'); var CTableBody = require('./CTableBody.js'); var CTableDataCell = require('./CTableDataCell.js'); var CTableRow = require('./CTableRow.js'); var CTableFoot = require('./CTableFoot.js'); var CTableCaption = require('./CTableCaption.js'); var CTableResponsiveWrapper = require('./CTableResponsiveWrapper.js'); var props = require('../../props.js'); var utils = require('./utils.js'); const CTable = React.forwardRef((_a, ref) => { var { children, align, borderColor, bordered, borderless, caption, captionTop, className, color, columns, footer, hover, items, responsive, small, striped, stripedColumns, tableFootProps, tableHeadProps } = _a, rest = tslib_es6.__rest(_a, ["children", "align", "borderColor", "bordered", "borderless", "caption", "captionTop", "className", "color", "columns", "footer", "hover", "items", "responsive", "small", "striped", "stripedColumns", "tableFootProps", "tableHeadProps"]); const columnNames = React.useMemo(() => utils.getColumnNames(columns, items), [columns, items]); return (React.createElement(CTableResponsiveWrapper.CTableResponsiveWrapper, { responsive: responsive }, React.createElement("table", Object.assign({ className: index.default('table', { [`align-${align}`]: align, [`border-${borderColor}`]: borderColor, [`caption-top`]: captionTop || caption === 'top', 'table-bordered': bordered, 'table-borderless': borderless, [`table-${color}`]: color, 'table-hover': hover, 'table-sm': small, 'table-striped': striped, 'table-striped-columns': stripedColumns, }, className) }, rest, { ref: ref }), ((caption && caption !== 'top') || captionTop) && (React.createElement(CTableCaption.CTableCaption, null, caption || captionTop)), columns && (React.createElement(CTableHead.CTableHead, Object.assign({}, tableHeadProps), React.createElement(CTableRow.CTableRow, null, columns.map((column, index) => (React.createElement(CTableHeaderCell.CTableHeaderCell, Object.assign({}, (column._props && Object.assign({}, column._props)), (column._style && { style: Object.assign({}, column._style) }), { key: index }), utils.getColumnLabel(column))))))), items && (React.createElement(CTableBody.CTableBody, null, items.map((item, index) => (React.createElement(CTableRow.CTableRow, Object.assign({}, (item._props && Object.assign({}, item._props)), { key: index }), columnNames && columnNames.map((colName, index) => { // eslint-disable-next-line unicorn/no-negated-condition return item[colName] !== undefined ? (React.createElement(CTableDataCell.CTableDataCell, Object.assign({}, (item._cellProps && Object.assign(Object.assign({}, (item._cellProps['all'] && Object.assign({}, item._cellProps['all']))), (item._cellProps[colName] && Object.assign({}, item._cellProps[colName])))), { key: index }), item[colName])) : null; })))))), children, footer && (React.createElement(CTableFoot.CTableFoot, Object.assign({}, tableFootProps), React.createElement(CTableRow.CTableRow, null, footer.map((item, index) => (React.createElement(CTableDataCell.CTableDataCell, Object.assign({}, (typeof item === 'object' && item._props && Object.assign({}, item._props)), { key: index }), typeof item === 'object' ? item.label : item))))))))); }); CTable.propTypes = { align: PropTypes.oneOf(['bottom', 'middle', 'top']), borderColor: PropTypes.string, bordered: PropTypes.bool, borderless: PropTypes.bool, caption: PropTypes.oneOfType([PropTypes.string, PropTypes.oneOf(['top'])]), captionTop: PropTypes.string, children: PropTypes.node, className: PropTypes.string, color: props.colorPropType, columns: PropTypes.array, footer: PropTypes.array, hover: PropTypes.bool, items: PropTypes.array, responsive: PropTypes.oneOfType([ PropTypes.bool, PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']), ]), small: PropTypes.bool, striped: PropTypes.bool, stripedColumns: PropTypes.bool, tableFootProps: PropTypes.shape(Object.assign({}, CTableFoot.CTableFoot.propTypes)), tableHeadProps: PropTypes.shape(Object.assign({}, CTableHead.CTableHead.propTypes)), }; CTable.displayName = 'CTable'; exports.CTable = CTable; //# sourceMappingURL=CTable.js.map