/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
import "./index.compiled.css";
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
import { Fragment, useCallback, useMemo } from 'react';
import { FormattedMessage } from 'react-intl-next';
import { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
import ErrorIcon from '@atlaskit/icon/core/migration/status-error--error';
import { fg } from '@atlaskit/platform-feature-flags';
import { Pressable } from '@atlaskit/primitives/compiled';
import { N800, R50, R500 } from '@atlaskit/theme/colors';
import { useAnalyticsEvents } from '../../../../../../../../common/analytics/generated/use-analytics-events';
import { messages } from '../../../../../../../../messages';
import useInvokeClientAction from '../../../../../../../../state/hooks/use-invoke-client-action';
import { getFormattedMessage } from '../../../../../utils';
var MAX_LINE_NUMBER = 8;
var styles = {
  contentStyles: "_zulpu2gc _11c81ixg _1reo15vq _18m915vq _1e0c1txw _1ul9idpf _2lx2vrvc _19pkv77o _4cvr1y6m _pqme2smr _102e2smr _ngc01fxt _1t4p1fxt",
  linkStyles: "_zulpu2gc _1reo15vq _18m915vq _11c82smr _1e0c1txw _1ul9idpf _2lx2vrvc _4cvr1h6o _80omtlke _19pku2gc _18u0xy5q _otyrv77o",
  textStylesBase: "_11c81ixg _1reo15vq _18m915vq _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54",
  dropdownItemGroupStyles: "_14hp1wdt _6pup1kw7 _1eo073ad",
  openIssueInJiraStyles: "_11c82smr _bfhk1j28 _1bah1e5h _1e0c1kw7 _syaz13af _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _9oik1r31 _1bnx8stv _jf4cnqa1 _30l312zz"
};
var LozengeActionError = function LozengeActionError(_ref) {
  var errorMessage = _ref.errorMessage,
    testId = _ref.testId,
    _ref$maxLineNumber = _ref.maxLineNumber,
    maxLineNumber = _ref$maxLineNumber === void 0 ? MAX_LINE_NUMBER : _ref$maxLineNumber,
    invokePreviewAction = _ref.invokePreviewAction;
  var _useAnalyticsEvents = useAnalyticsEvents(),
    fireEvent = _useAnalyticsEvents.fireEvent;
  var invoke = useInvokeClientAction({});
  var isPreviewAvailable = invokePreviewAction !== undefined;
  var handlePreviewOpen = useCallback(function () {
    if (isPreviewAvailable) {
      fireEvent('ui.button.clicked.smartLinkStatusOpenPreview', {});
      if (invokePreviewAction) {
        invoke(invokePreviewAction);
      }
    }
  }, [isPreviewAvailable, invoke, invokePreviewAction, fireEvent]);
  var dynamicCss = null;
  var content = useMemo(function () {
    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
      className: ax([styles.contentStyles])
    }, /*#__PURE__*/React.createElement(ErrorIcon, {
      testId: "".concat(testId, "-icon"),
      LEGACY_size: "medium",
      color: "var(--ds-icon-danger, ".concat(R500, ")"),
      LEGACY_secondaryColor: "var(--ds-background-danger, ".concat(R50, ")"),
      label: 'error',
      spacing: "spacious"
    }), /*#__PURE__*/React.createElement("span", {
      "data-testid": "".concat(testId, "-error-message"),
      className: ax([styles.textStylesBase, "_1yyj1n6p _102k1hw0"]),
      style: {
        "--_t4prqe": ix(maxLineNumber),
        "--_hm3wc5": ix("calc(".concat(maxLineNumber, " * 1rem)"))
      }
    }, typeof errorMessage === 'string' ? errorMessage : getFormattedMessage(errorMessage))), isPreviewAvailable ? /*#__PURE__*/React.createElement("div", {
      className: ax([styles.linkStyles])
    }, /*#__PURE__*/React.createElement(Pressable, {
      testId: "".concat(testId, "-open-embed"),
      onClick: handlePreviewOpen,
      xcss: styles.openIssueInJiraStyles
    }, fg('confluence-issue-terminology-refresh') ? /*#__PURE__*/React.createElement(FormattedMessage, messages.open_issue_in_jiraIssueTermRefresh) : /*#__PURE__*/React.createElement(FormattedMessage, messages.open_issue_in_jira))) : null);
  }, [errorMessage, handlePreviewOpen, isPreviewAvailable, testId, dynamicCss]);
  return /*#__PURE__*/React.createElement("span", {
    "data-testid": "".concat(testId, "-error-item-group"),
    className: ax([styles.dropdownItemGroupStyles])
  }, /*#__PURE__*/React.createElement(DropdownItemGroup, null, /*#__PURE__*/React.createElement(DropdownItem, {
    testId: "".concat(testId, "-error")
  }, content)));
};
export default LozengeActionError;