"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.EMPTY_STATE_BUTTON_TYPES = void 0;
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _button = require("../button");
var _useTranslation = require("../hooks/use-translation");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function checkForMultiplePrimaryButtons(actionParamsProp) {
  let primaryButtonsCount = 0;
  actionParamsProp.forEach(item => {
    // we need to check whether onActionBtnType is primary or undefined as undefined will default to primary
    if (item?.onActionBtnType === _button.ACCENT_TYPES.PRIMARY || !item?.onActionBtnType) {
      primaryButtonsCount++;
    }
  });
  // if number of primary buttons is more than 1 - raise the error
  if (primaryButtonsCount > 1) {
    return new Error(`More then one primary buttons passed. Check onActionBtnType prop.`);
  }
}
/** EmptyState displays a missing content container with title, description
 * and action button, that helps you to get going without wondering what to do next
 * [CAPITALIZATION] Use sentence case for title, description and buttons
 * @midnight-gray-supported
 * @alpine-light-supported
 * */
const EmptyState = ({
  imageSrc,
  title,
  description,
  actionParams = [],
  originalImageSize = false,
  testId = 'empty-state',
  altText,
  className = '',
  customContentTop,
  customContentBottom
}) => {
  const {
    t
  } = (0, _useTranslation.useTranslation)();
  const actionParamsProps = Array.isArray(actionParams) ? actionParams : [actionParams];
  if (actionParamsProps.length) {
    checkForMultiplePrimaryButtons(actionParamsProps);
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    "aria-live": "polite",
    "test-id": testId,
    className: (0, _classnames.default)('empty-state', className),
    children: [imageSrc && /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
      "test-id": "empty-state-img",
      className: originalImageSize ? 'original-image-size' : undefined,
      src: imageSrc,
      alt: altText ?? t('Empty state')
    }), customContentTop, title && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      "test-id": "empty-state-title",
      className: "empty-state-title",
      children: title
    }), description && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
      "test-id": "empty-state-description",
      className: "empty-state-description",
      children: description
    }), actionParams && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: "empty-state-action-buttons-container",
      children: actionParamsProps.map(actionParamItem => {
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
          testId: "empty-state-action-btn",
          onClick: actionParamItem.onActionBtnClick,
          accentType: actionParamItem.onActionBtnType,
          className: "empty-state-action-btn",
          isDisabled: actionParamItem.onActionButtonDisabled,
          tooltipText: actionParamItem.onActionButtonTooltipText,
          tooltipPlacement: actionParamItem.onActionButtonTooltipPlacement || 'bottom',
          leftIcon: actionParamItem.onActionBtnIcon,
          isLoading: actionParamItem.onActionBtnIsLoading,
          loadingText: actionParamItem.onActionBtnLoadingText,
          fullWidth: actionParamItem.fullWidth,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            "test-id": "empty-state-action-btn-text",
            children: actionParamItem.onActionBtnText
          })
        }, actionParamItem.onActionBtnText);
      })
    }), customContentBottom]
  });
};
const EMPTY_STATE_BUTTON_TYPES = exports.EMPTY_STATE_BUTTON_TYPES = {
  PRIMARY: _button.ACCENT_TYPES.PRIMARY,
  SECONDARY: _button.ACCENT_TYPES.SECONDARY,
  COMMAND: _button.ACCENT_TYPES.COMMAND
};
var _default = exports.default = EmptyState;