'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var reactIntl = require('react-intl');
var Table_messages = require('./Table.messages.js');
var TableStatusText = require('./TableStatusText.js');
var clsx = require('clsx');
var jsxRuntime = require('react/jsx-runtime');

const TableHeader = ({
  header,
  className,
  alignment = 'left',
  status,
  width,
  isActionHeader = false
}) => {
  const {
    formatMessage
  } = reactIntl.useIntl();
  const getHeaderContent = () => {
    if (isActionHeader) {
      // `Action` header doesn't have visual text content, but it has the header, which is visible for screen readers only
      return /*#__PURE__*/jsxRuntime.jsx(TableStatusText.default, {
        text: formatMessage(Table_messages.default.actionHeader),
        className: `np-table-header-content${isActionHeader ? ' sr-only' : ''}`
      });
    }
    if (header) {
      return /*#__PURE__*/jsxRuntime.jsx(TableStatusText.default, {
        text: header,
        className: `np-table-header-content${isActionHeader ? ' sr-only' : ''}`,
        status: status,
        typography: "default-bold"
      });
    }
    // If headers are empty, we still should render empty headers to keep visual consistency
    return /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "np-table-header-content np-text-body-default-bold",
      "data-testid": "np-table-empty-header",
      children: "\xA0"
    });
  };
  return /*#__PURE__*/jsxRuntime.jsx("th", {
    className: clsx.clsx('np-table-header', className, `np-table-header--${alignment}`, {
      'np-table-header--error': status === 'error',
      'np-table-header--action': isActionHeader
    }),
    style: {
      minWidth: width,
      width
    },
    children: getHeaderContent()
  });
};

exports.default = TableHeader;
//# sourceMappingURL=TableHeader.js.map
