@pantheon-systems/design-toolkit-react/dist/Stepper/StepperProgress/Milestone.js

Pantheon's React Design Toolkit

import { faCheckCircle, faExclamationCircle } from '@fortawesome/pro-solid-svg-icons';
import PropTypes from 'prop-types';
import Icon from '../../Icons/Icon.js';
import { jsx } from 'react/jsx-runtime';

var ICON_STYLES = 'align-baseline bg-white text-xl';
var Milestone = function Milestone(_ref) {
  var disableNavButton = _ref.disableNavButton,
    isActive = _ref.isActive,
    isComplete = _ref.isComplete,
    isError = _ref.isError;
  if (isComplete) {
    return /*#__PURE__*/jsx(Icon, {
      className: "".concat(ICON_STYLES, " border-green-3 text-green-3 ").concat(!disableNavButton && 'hover:border-green-4 hover:text-green-4'),
      icon: faCheckCircle
    });
  }
  if (isError) {
    return /*#__PURE__*/jsx(Icon, {
      className: "".concat(ICON_STYLES, " border-red-3 text-red-3"),
      icon: faExclamationCircle
    });
  }
  return /*#__PURE__*/jsx("span", {
    className: "inline-block border-4 border-solid rounded-full bg-white text-base h-6 w-6 p-0 ".concat(isActive ? 'border-green-3' : 'border-gray-3')
  });
};
Milestone.propTypes = {
  disableNavButton: PropTypes.bool,
  isActive: PropTypes.bool,
  isComplete: PropTypes.bool,
  isError: PropTypes.bool
};
Milestone.defaultProps = {
  disableNavButton: false,
  isActive: false,
  isComplete: false,
  isError: false
};
var Milestone$1 = Milestone;

export { Milestone$1 as default };
//# sourceMappingURL=Milestone.js.map