"use strict";

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

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

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function Alert(_ref) {
  var type = _ref.type,
      heading = _ref.heading,
      text = _ref.text,
      actionItem = _ref.actionItem;
  // If in the future we make this interactive, we should use the alertdialog role
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "usa-alert usa-alert--".concat(type, " grid-row"),
    role: type === 'error' ? 'alert' : undefined
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "display-flex flex-fill"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "usa-alert__body grid-col flex-fill"
  }, heading && /*#__PURE__*/_react.default.createElement("h2", {
    className: "usa-alert__heading"
  }, heading), /*#__PURE__*/_react.default.createElement("p", {
    className: "usa-alert__text"
  }, text)), /*#__PURE__*/_react.default.createElement("div", {
    className: "usa-alert__body flex-auto display-flex flex-align-center"
  }, actionItem)));
}