import React from 'react';
import { fg } from '@atlaskit/platform-feature-flags';
import InlineLozenge from '../common/inline-lozenge';
const LOZENGE_TEST_ID = 'inline-card-resolved-view-lozenge';
export function renderLozenge(lozenge) {
  var _lozenge$style3, _lozenge$style4;
  if (!lozenge || !(lozenge !== null && lozenge !== void 0 && lozenge.text)) {
    return null;
  }
  if (fg('platform-dst-lozenge-tag-badge-visual-uplifts')) {
    const stateMetricMatch = lozenge.text.match(/^(.+?)\s+-\s+(\d+(?:\.\d+)?)$/);
    if (stateMetricMatch) {
      var _lozenge$style, _lozenge$style2;
      const [, label, metric] = stateMetricMatch;
      const appearance = lozenge.appearance || 'neutral';
      return /*#__PURE__*/React.createElement(InlineLozenge, {
        testId: LOZENGE_TEST_ID,
        appearance: appearance,
        style: {
          backgroundColor: lozenge === null || lozenge === void 0 ? void 0 : (_lozenge$style = lozenge.style) === null || _lozenge$style === void 0 ? void 0 : _lozenge$style.backgroundColor,
          color: lozenge === null || lozenge === void 0 ? void 0 : (_lozenge$style2 = lozenge.style) === null || _lozenge$style2 === void 0 ? void 0 : _lozenge$style2.color
        },
        trailingMetric: metric
      }, label);
    }
  }
  const appearance = lozenge.appearance || 'default';
  return /*#__PURE__*/React.createElement(InlineLozenge, {
    testId: LOZENGE_TEST_ID,
    appearance: appearance,
    style: {
      backgroundColor: lozenge === null || lozenge === void 0 ? void 0 : (_lozenge$style3 = lozenge.style) === null || _lozenge$style3 === void 0 ? void 0 : _lozenge$style3.backgroundColor,
      color: lozenge === null || lozenge === void 0 ? void 0 : (_lozenge$style4 = lozenge.style) === null || _lozenge$style4 === void 0 ? void 0 : _lozenge$style4.color
    },
    isBold: lozenge.isBold !== false
  }, lozenge.text);
}