"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.InfoIcon = void 0;
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _faCircleInfo = require("@fortawesome/free-solid-svg-icons/faCircleInfo");
var _fontAwesomeIcon = require("../font-awesome-icon");
var _tooltip = require("../tooltip");
var _useTranslation = require("../hooks/use-translation");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/** Tooltip component that provides info icon out of the box
 * [CAPITALIZATION] Text must be in sentence case. If it is full sentence should have a period
 */
const InfoIcon = ({
  children,
  className,
  placement = _tooltip.TOOLTIP_PLACEMENT_TYPES.RIGHT,
  ariaLabel,
  docsLink,
  testId
}) => {
  const {
    t
  } = (0, _useTranslation.useTranslation)();
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.Tooltip, {
    content: children,
    placement: placement,
    docsLink: docsLink,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_fontAwesomeIcon.FontAwesomeIcon, {
      icon: _faCircleInfo.faCircleInfo,
      "aria-label": ariaLabel ?? t('Info-icon with extra information in a tooltip'),
      "aria-hidden": "false",
      tabIndex: 0 // always should be focusable when navigating with a keyboard because important explanation is provided.
      ,
      className: (0, _classnames.default)('info-icon', className),
      "test-id": testId
    })
  });
};
exports.InfoIcon = InfoIcon;