import _extends from "@babel/runtime/helpers/extends";
import React, { useMemo } from 'react';
import { fg } from '@atlaskit/platform-feature-flags';
import { ElementName } from '../../../../../constants';
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
import { BaseLozengeElement } from '../common';
var STATE_METRIC_REGEX = /^(.+?)\s+-\s+(\d+(?:\.\d+)?)$/;
var StateElement = function StateElement(props) {
  var _context$state;
  var context = useFlexibleUiContext();
  var data = (_context$state = context === null || context === void 0 ? void 0 : context.state) !== null && _context$state !== void 0 ? _context$state : null;
  var metricProps = fg('platform-dst-lozenge-tag-badge-visual-uplifts') ?
  // eslint-disable-next-line react-hooks/rules-of-hooks
  useMemo(function () {
    if (data && typeof data.text === 'string') {
      var match = data.text.match(STATE_METRIC_REGEX);
      if (match) {
        return {
          text: match[1],
          trailingMetric: match[2]
        };
      }
    }
    return null;
  }, [data]) : undefined;
  if (!data) {
    return null;
  }
  return /*#__PURE__*/React.createElement(BaseLozengeElement, _extends({}, data, props, metricProps, {
    name: ElementName.State
  }));
};
export default StateElement;