import 'react';
import classnames from 'classnames';
import { jsx, jsxs } from 'react/jsx-runtime';

var Stepper = function Stepper(_ref) {
  var steps = _ref.steps,
    activeIndex = _ref.activeIndex,
    setActiveIndex = _ref.setActiveIndex;
  return /*#__PURE__*/jsx("div", {
    className: "neeto-ui-stepper__wrapper",
    children: steps.map(function (_ref2, index) {
      var id = _ref2.id,
        label = _ref2.label;
      return /*#__PURE__*/jsx("div", {
        "data-testid": "stepper-item-".concat(id),
        className: classnames("neeto-ui-stepper-item__wrapper", {
          "neeto-ui-stepper-item__wrapper--active": index === activeIndex,
          "neeto-ui-stepper-item__wrapper--done": index < activeIndex
        }),
        children: /*#__PURE__*/jsxs("button", {
          className: "neeto-ui-stepper-item",
          "data-testid": "stepper-navigation-button",
          onClick: function onClick() {
            return setActiveIndex(index);
          },
          children: [/*#__PURE__*/jsx("span", {
            className: "neeto-ui-stepper-item__stage",
            children: /*#__PURE__*/jsx("span", {
              children: id
            })
          }), /*#__PURE__*/jsx("span", {
            className: "neeto-ui-stepper-item__label",
            "data-text": label,
            children: label
          })]
        })
      }, id);
    })
  });
};

export { Stepper as default };
//# sourceMappingURL=Stepper.js.map
