"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Alert = void 0;
var _classnames = _interopRequireDefault(require("classnames"));
var _mergeRefs = _interopRequireDefault(require("../utilities/mergeRefs"));
var _useAutoFocus = _interopRequireDefault(require("../utilities/useAutoFocus"));
var _useAlertAnalytics = _interopRequireDefault(require("./useAlertAnalytics"));
var _Icons = require("../Icons");
var _i18n = require("../i18n");
var _useId = _interopRequireDefault(require("../utilities/useId"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
 * For information about how and when to use this component,
 * [refer to its full documentation page](https://design.cms.gov/components/alert/).
 */
const Alert = props => {
  const {
    headingRef,
    bodyRef
  } = (0, _useAlertAnalytics.default)(props);
  const focusRef = (0, _useAutoFocus.default)(props.autoFocus);
  const rootId = (0, _useId.default)('alert--', props.id);
  const headingId = props.headingId ?? `${rootId}__heading`;
  const a11yLabelId = `${rootId}__a11y-label`;
  if (process.env.NODE_ENV !== 'production') {
    if (!props.heading && !props.children) {
      console.warn(`Empty <Alert> components are not allowed, please use the 'heading' prop or include children.`);
    }
  }
  const {
    children,
    className,
    autoFocus,
    heading,
    headingId: _headingId,
    headingLevel,
    hideIcon,
    alertRef,
    role,
    variation,
    weight,
    analytics,
    analyticsLabelOverride,
    analyticsEventTypeOverride,
    onAnalyticsEvent,
    ...alertProps
  } = props;
  let headingElement;
  if (heading) {
    const Heading = `h${headingLevel}`;
    headingElement = /*#__PURE__*/(0, _jsxRuntime.jsx)(Heading, {
      className: "ds-c-alert__heading",
      children: heading
    });
  }
  const classes = (0, _classnames.default)('ds-c-alert', hideIcon && 'ds-c-alert--hide-icon', variation && `ds-c-alert--${variation}`, weight && `ds-c-alert--${weight}`, className);
  const a11yLabelText = (0, _i18n.t)(`alert.${variation ?? 'defaultLabel'}`);
  const a11yLabel = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
    className: "ds-c-alert__a11y-label ds-u-visibility--screen-reader",
    id: a11yLabelId,
    children: `${a11yLabelText}: `
  });

  // getting proper icon for alert variation
  function getIcon() {
    const iconClass = 'ds-c-alert__icon';
    if (hideIcon) {
      return null;
    }
    switch (variation) {
      case 'error':
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.AlertCircleIcon, {
          className: iconClass
        });
      case 'success':
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.CheckCircleIcon, {
          className: iconClass
        });
      case 'warn':
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.WarningIcon, {
          className: iconClass
        });
      default:
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.InfoCircleIcon, {
          className: iconClass
        });
    }
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: classes,
    ref: (0, _mergeRefs.default)([alertRef, focusRef]),
    tabIndex: alertRef || autoFocus ? -1 : null,
    role: role,
    "aria-labelledby": heading ? headingId : a11yLabelId,
    ...alertProps,
    children: [getIcon(), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "ds-c-alert__body",
      id: headingId,
      ref: bodyRef,
      children: [heading ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
        className: "ds-c-alert__header ds-c-alert__heading",
        ref: headingRef,
        children: [a11yLabel, headingElement]
      }) : a11yLabel, children]
    })]
  });
};
exports.Alert = Alert;
Alert.defaultProps = {
  role: 'region',
  headingLevel: '2'
};
var _default = Alert;
exports.default = _default;