@tpr/govuk-react-jsx/govuk/components/table/index.js

[](https://github.com/alphagov/govuk-frontend/releases/tag/v4.0.1) [![version](https://img.shields.io/npm/v/govuk-react-jsx.svg?styl

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Table = Table;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _react = _interopRequireDefault(require("react"));

var _excluded = ["caption", "captionClassName", "className", "firstCellIsHeader", "head", "rows"],
    _excluded2 = ["className", "format", "children", "reactListKey"],
    _excluded3 = ["className", "children", "format", "reactListKey"];

function Table(props) {
  var caption = props.caption,
      captionClassName = props.captionClassName,
      className = props.className,
      firstCellIsHeader = props.firstCellIsHeader,
      head = props.head,
      rows = props.rows,
      attributes = (0, _objectWithoutProperties2["default"])(props, _excluded);
  var captionComponent;
  var headComponent;

  if (caption) {
    captionComponent = /*#__PURE__*/_react["default"].createElement("caption", {
      className: "govuk-table__caption ".concat(captionClassName || '')
    }, caption);
  }

  if (head) {
    headComponent = /*#__PURE__*/_react["default"].createElement("thead", {
      className: "govuk-table__head"
    }, /*#__PURE__*/_react["default"].createElement("tr", {
      className: "govuk-table__row"
    }, head.map(function (item, index) {
      var itemClassName = item.className,
          itemFormat = item.format,
          itemChildren = item.children,
          reactListKey = item.reactListKey,
          itemAttributes = (0, _objectWithoutProperties2["default"])(item, _excluded2);
      return /*#__PURE__*/_react["default"].createElement("th", (0, _extends2["default"])({
        key: reactListKey || index,
        scope: "col",
        className: "govuk-table__header ".concat(itemFormat ? "govuk-table__header--".concat(itemFormat) : '', " ").concat(itemClassName || '')
      }, itemAttributes), itemChildren);
    })));
  }

  var filteredRows = rows ? rows.filter(function (row) {
    return row.cells;
  }) : [];
  return /*#__PURE__*/_react["default"].createElement("table", (0, _extends2["default"])({
    className: "govuk-table ".concat(className || '')
  }, attributes), captionComponent, headComponent, /*#__PURE__*/_react["default"].createElement("tbody", {
    className: "govuk-table__body"
  }, filteredRows.map(function (row, rowIndex) {
    return /*#__PURE__*/_react["default"].createElement("tr", {
      key: row.reactListKey || rowIndex,
      className: "govuk-table__row"
    }, row.cells.map(function (cell, cellIndex) {
      var cellClassName = cell.className,
          cellChildren = cell.children,
          cellFormat = cell.format,
          reactListKey = cell.reactListKey,
          cellAttributes = (0, _objectWithoutProperties2["default"])(cell, _excluded3);

      if (cellIndex === 0 && firstCellIsHeader) {
        return /*#__PURE__*/_react["default"].createElement("th", (0, _extends2["default"])({
          key: reactListKey || cellIndex,
          scope: "row",
          className: "govuk-table__header ".concat(cellClassName || '')
        }, cellAttributes), cellChildren);
      }

      return /*#__PURE__*/_react["default"].createElement("td", (0, _extends2["default"])({
        key: cell.reactListKey || cellIndex,
        className: "govuk-table__cell ".concat(cellClassName || '', " ").concat(cellFormat ? "govuk-table__cell--".concat(cellFormat) : '')
      }, cellAttributes), cellChildren);
    }));
  })));
}