import { jsx as e } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { forwardRef as i } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/compat/dist/compat.module.js";
import m from "classnames";
import d from "../Typography/Typography.js";
import { TypographyElement as c, TypographyVariant as l } from "../Typography/types.js";
import { Icon as y } from "../Icon/Icon.js";
const f = ({ completed: a, index: r }) => a ? /* @__PURE__ */ e(y, { name: "checkmark-circle-fill" }) : /* @__PURE__ */ e("span", { className: "adyen-pe-step__number", children: r + 1 }), g = i(({ index: a, active: r, completed: p, disabled: t, onClick: n, children: o }, s) => /* @__PURE__ */ e(
  "li",
  {
    className: m("adyen-pe-step__item", {
      "adyen-pe-step--active": r,
      "adyen-pe-step--completed": p,
      "adyen-pe-step--disabled": t
    }),
    children: /* @__PURE__ */ e(
      "button",
      {
        "aria-disabled": t,
        "aria-current": r ? "step" : void 0,
        tabIndex: r ? 0 : -1,
        ref: s,
        type: "button",
        className: "adyen-pe-step__button",
        onClick: n,
        disabled: t,
        children: [
          /* @__PURE__ */ e("div", { className: "adyen-pe-step__icon", "aria-hidden": "true", children: /* @__PURE__ */ e(f, { completed: p, index: a }) }),
          /* @__PURE__ */ e(d, { variant: l.BODY, el: c.SPAN, className: "adyen-pe-step__label", children: o })
        ]
      }
    )
  }
));
export {
  g as Step
};
