"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.EmbeddedStep = void 0;
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _stepDot = require("./step-dot");
var _types = require("./types");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const EmbeddedStep = ({
  name,
  stepKey,
  active,
  completed,
  isDisabled,
  styling = _types.StepStyles.RECTANGLE,
  onClick = () => {}
}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
  className: "embedded-step-marker",
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_stepDot.StepDot, {
    activated: active,
    completed: completed,
    onClick: onClick,
    stepKey: stepKey,
    isDisabled: isDisabled,
    ariaLabel: name
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
    className: (0, _classnames.default)('dot-text', {
      active
    }, {
      completed
    }),
    "test-id": "dot-text",
    children: name
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
    className: styling
  })]
});
exports.EmbeddedStep = EmbeddedStep;