import { defineComponent as g, useSlots as y, useCssModule as w, inject as k, computed as d, onBeforeMount as b, openBlock as i, createElementBlock as r, normalizeClass as a, unref as t, createElementVNode as n, createBlock as B, toDisplayString as u, createCommentVNode as f, createTextVNode as N, renderSlot as C } from "vue";
import { t as M } from "./locale.js";
import R from "./Icon.js";
import { S as z } from "./keys-C8Zfr_By.js";
import { _ as E } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const I = { key: 1 }, P = /* @__PURE__ */ g({
  __name: "Step",
  props: {
    active: { type: Boolean, default: !1 },
    completed: { type: Boolean, default: !1 },
    error: { type: Boolean, default: !1 },
    text: {},
    nested: { type: Boolean, default: !1 },
    step: { default: void 0 },
    disabled: { type: Boolean, default: !1 },
    loading: { type: Boolean, default: !1 }
  },
  setup(m) {
    const e = m, v = y(), s = w(), l = k(z), c = d(() => (l == null ? void 0 : l.orientation) === "horizontal"), p = d(() => (l == null ? void 0 : l.theme) === "light"), o = l == null ? void 0 : l.showResponsiveNav, _ = d(() => e.loading ? "working" : e.completed ? "circle-check" : "circle-info"), h = d(
      () => M("ll.stepper.currentStep", { num: e.step, total: String(l == null ? void 0 : l.stepCount.value) })
    );
    return b(() => {
      l && l.registerStep(e.nested);
    }), (x, K) => (i(), r("li", {
      class: a(["stash-step relative flex w-full", [
        t(s).step,
        {
          [t(s)["nested-step--active"]]: e.nested && e.active,
          "last:w-auto": c.value && !t(o),
          [t(s)["stash-step--singular"]]: t(o),
          "relative w-full shrink-0 snap-start flex-col justify-center": t(o)
        }
      ]]),
      "data-test": "stash-step"
    }, [
      e.nested ? f("", !0) : (i(), r("div", {
        key: 0,
        class: a(["stash-step__indicator flex flex-col items-center", { "mr-3": !t(o) }]),
        "data-test": "stash-step|indicator"
      }, [
        n("div", {
          class: a([
            t(s).circle,
            {
              [t(s)["circle--todo"]]: !e.error && !e.active && !e.completed,
              [t(s)["circle--error"]]: e.error && !e.active,
              [t(s)["circle--completed"]]: e.completed && !e.active,
              [t(s)["circle--active"]]: e.active,
              [t(s)["circle--loading"]]: e.loading
            }
          ])
        }, [
          (e.completed || e.error || e.loading) && !e.active ? (i(), B(R, {
            key: 0,
            name: _.value,
            class: a({ "fx-spin": e.loading }),
            size: "dense"
          }, null, 8, ["name", "class"])) : (i(), r("span", I, u(e.step), 1))
        ], 2),
        n("div", {
          class: a(["my-1.5 w-px bg-ice-500", [t(s).line, { [t(s)["line--expanded"]]: e.completed || e.active, hidden: c.value }]])
        }, null, 2)
      ], 2)),
      n("div", {
        class: a(["flex", [
          {
            "w-full flex-row items-center": c.value,
            "mt-1.5 justify-center": t(o),
            "flex-col": !c.value || t(o)
          }
        ]])
      }, [
        n("div", {
          class: a(["stash-step__title", [
            t(s).title,
            {
              "whitespace-nowrap": c.value,
              "cursor-pointer": !e.active && (e.completed || e.error),
              "cursor-not-allowed": e.disabled,
              "text-ice-900": p.value,
              "!font-semibold": e.active,
              "text-white": !e.disabled && !p.value,
              "place-self-center": t(o)
            }
          ]]),
          "data-test": "stash-step|title"
        }, [
          N(u(e.text) + " ", 1),
          t(o) ? (i(), r("p", {
            key: 0,
            class: a(["stash-step__pagination-label mb-0 text-center text-xs", p.value ? "text-ice-700" : "text-white"]),
            "data-test": "stash-step|pagination-label"
          }, u(h.value), 3)) : f("", !0)
        ], 2),
        c.value ? (i(), r("div", {
          key: 0,
          class: a([
            t(s).line,
            {
              [t(s)["line--expanded"]]: e.completed || e.active,
              "mx-1.5 border-t group-last:hidden": !t(o)
            }
          ])
        }, null, 2)) : f("", !0),
        n("div", {
          class: a(["stash-step--nested-steps", { "pb-9": !m.nested && !t(v).default, hidden: c.value }])
        }, [
          n("ul", {
            class: a([t(s).nested, { hidden: !t(v).default }])
          }, [
            C(x.$slots, "default")
          ], 2)
        ], 2)
      ], 2)
    ], 2));
  }
}), T = "_step_SqlMR", S = "_title_kKRRz", D = "_line_L-Nzh", V = "_circle_9ywfN", q = "_nested_1_jBD", H = {
  step: T,
  title: S,
  "nested-step--active": "_nested-step--active_I0PyI",
  line: D,
  "line--expanded": "_line--expanded_hx7PD",
  "stash-step--singular": "_stash-step--singular_R16MM",
  circle: V,
  "circle--todo": "_circle--todo_ZLHin",
  "circle--active": "_circle--active_2ZCqF",
  "circle--loading": "_circle--loading_kVPqc",
  "circle--completed": "_circle--completed_1HbTv",
  "circle--error": "_circle--error_mICDP",
  nested: q
}, L = {
  $style: H
}, Y = /* @__PURE__ */ E(P, [["__cssModules", L]]);
export {
  Y as default
};
//# sourceMappingURL=Step.js.map
