/* UnknownMacroPlaceholder.tsx generated by @compiled/babel-plugin v0.39.1 */
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import "./UnknownMacroPlaceholder.compiled.css";
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
import { useIntl } from 'react-intl-next';
import { messages } from './messages';
// Unknown macro placeholder styling aligned with Legacy Content Macro (LCM) for consistent look
var neutralBorder = "var(--ds-background-neutral, #0515240F)";
var unknownMacroContainerStyles = null;

// Match LCM header exactly: lcmHeaderStyles from LegacyContentHeader/index.tsx
var unknownMacroHeaderStyles = null;

// Match LCM content area: white surface, text color inherits
var unknownMacroBodyStyles = null;
var unknownMacroPreStyles = null;
export function UnknownMacroPlaceholder(_ref) {
  var _extensionNode$parame, _extensionNode$parame2, _extensionNode$parame3, _extensionNode$parame4;
  var extensionNode = _ref.extensionNode;
  var intl = useIntl();
  var macroTitle = ((_extensionNode$parame = extensionNode.parameters) === null || _extensionNode$parame === void 0 || (_extensionNode$parame = _extensionNode$parame.macroMetadata) === null || _extensionNode$parame === void 0 ? void 0 : _extensionNode$parame.title) || extensionNode.extensionKey;
  var bodyContent = (_extensionNode$parame2 = extensionNode.parameters) === null || _extensionNode$parame2 === void 0 || (_extensionNode$parame2 = _extensionNode$parame2.macroParams) === null || _extensionNode$parame2 === void 0 || (_extensionNode$parame2 = _extensionNode$parame2.__bodyContent) === null || _extensionNode$parame2 === void 0 ? void 0 : _extensionNode$parame2.value;
  var macroParams = (_extensionNode$parame3 = (_extensionNode$parame4 = extensionNode.parameters) === null || _extensionNode$parame4 === void 0 ? void 0 : _extensionNode$parame4.macroParams) !== null && _extensionNode$parame3 !== void 0 ? _extensionNode$parame3 : {};
  var formatParam = function formatParam(key, param) {
    var _param$value;
    var value = String((_param$value = param === null || param === void 0 ? void 0 : param.value) !== null && _param$value !== void 0 ? _param$value : '').trim();
    return "".concat(key, " = ").concat(value);
  };
  // eslint-disable-next-line @atlassian/perf-linting/no-expensive-computations-in-render -- Ignored via go/ees017 (to be fixed)
  var visibleParams = Object.entries(macroParams).filter(function (_ref2) {
    var _ref3 = _slicedToArray(_ref2, 1),
      key = _ref3[0];
    return !key.startsWith('_');
  }).map(function (_ref4) {
    var _ref5 = _slicedToArray(_ref4, 2),
      key = _ref5[0],
      param = _ref5[1];
    return formatParam(key, param);
  }).join(' | ');
  var headerText = visibleParams ? "".concat(intl.formatMessage(messages.unknownMacroHeader, {
    macroTitle: macroTitle
  }), " | ").concat(visibleParams) : intl.formatMessage(messages.unknownMacroHeader, {
    macroTitle: macroTitle
  });
  return /*#__PURE__*/React.createElement("section", {
    "aria-label": intl.formatMessage(messages.unknownMacroPlaceholderAriaLabel),
    className: ax(["_19it7tl1 _2rko12b0 _1reo15vq _18m915vq _bfhkhp5a"]),
    style: {
      "--_98ihdp": ix("1px solid ".concat(neutralBorder))
    }
  }, /*#__PURE__*/React.createElement("div", {
    className: ax(["_2rko14xi _11c8wadc _n7zl1q32 _bfhki8nm _ca0qu2gc _u5f3pxbi _n3td1b66 _19bvpxbi _kqswh2mm _154i1n1a"]),
    style: {
      "--_1e0q5w0": ix("var(--ds-border-width, 1px)".concat(" solid ", neutralBorder))
    }
  }, headerText), /*#__PURE__*/React.createElement("div", {
    className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf _bfhkvuon _ca0qutpp _u5f3utpp _n3tdutpp _19bvutpp"])
  }, /*#__PURE__*/React.createElement("pre", {
    className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf _11c8fhey _o5721jtm _1nmz1hna _6z24egat"])
  }, bodyContent)));
}