@wordpress/block-library/build/table/save.js

Block library for the WordPress editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = save;
var _clsx = _interopRequireDefault(require("clsx"));
var _blockEditor = require("@wordpress/block-editor");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

function save({
  attributes
}) {
  const {
    hasFixedLayout,
    head,
    body,
    foot,
    caption
  } = attributes;
  const isEmpty = !head.length && !body.length && !foot.length;
  if (isEmpty) {
    return null;
  }
  const colorProps = (0, _blockEditor.__experimentalGetColorClassesAndStyles)(attributes);
  const borderProps = (0, _blockEditor.__experimentalGetBorderClassesAndStyles)(attributes);
  const classes = (0, _clsx.default)(colorProps.className, borderProps.className, {
    'has-fixed-layout': hasFixedLayout
  });
  const hasCaption = !_blockEditor.RichText.isEmpty(caption);
  const Section = ({
    type,
    rows
  }) => {
    if (!rows.length) {
      return null;
    }
    const Tag = `t${type}`;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Tag, {
      children: rows.map(({
        cells
      }, rowIndex) => /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
        children: cells.map(({
          content,
          tag,
          scope,
          align,
          colspan,
          rowspan
        }, cellIndex) => {
          const cellClasses = (0, _clsx.default)({
            [`has-text-align-${align}`]: align
          });
          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, {
            className: cellClasses ? cellClasses : undefined,
            "data-align": align,
            tagName: tag,
            value: content,
            scope: tag === 'th' ? scope : undefined,
            colSpan: colspan,
            rowSpan: rowspan
          }, cellIndex);
        })
      }, rowIndex))
    });
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("figure", {
    ..._blockEditor.useBlockProps.save(),
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
      className: classes === '' ? undefined : classes,
      style: {
        ...colorProps.style,
        ...borderProps.style
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Section, {
        type: "head",
        rows: head
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Section, {
        type: "body",
        rows: body
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Section, {
        type: "foot",
        rows: foot
      })]
    }), hasCaption && /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText.Content, {
      tagName: "figcaption",
      value: caption,
      className: (0, _blockEditor.__experimentalGetElementClassName)('caption')
    })]
  });
}
//# sourceMappingURL=save.js.map