@synopackageland/ui 0.25.20 → 0.25.22

package/dist/modules/components/composite/wizard/Wizard.vue.js

@@ -0,0 +1,397 @@
+import { defineComponent as $e, ref as T, useId as ve, watch as D, computed as r, useTemplateRef as fe, onMounted as Ae, nextTick as ye, onBeforeUnmount as He, provide as Me, openBlock as s, createElementBlock as d, normalizeStyle as We, unref as l, toDisplayString as y, createCommentVNode as v, createElementVNode as m, Fragment as $, renderList as me, createTextVNode as S, createBlock as x, renderSlot as he, createVNode as we, withCtx as K } from "vue";
+import { useUiText as je, useLocalizedDefaults as Ve } from "../../../i18n/text.js";
+import { Check as qe, TriangleAlert as Ge, X as Ue } from "@lucide/vue";
+import A from "../../primitives/button/Button.vue.js";
+import Re from "../../primitives/button/ButtonKindScope.vue.js";
+import { useElementWidth as Xe } from "../../../composables/elementWidth.js";
+import { useFitHeight as Je, useElementHeight as Qe } from "../../../composables/fitHeight.js";
+import { useScrollEdges as Ye } from "../../../composables/scrollEdges.js";
+import { focusLikeInput as Ze } from "../../../composables/inputModality.js";
+import { wizardKey as et } from "./wizardContext.js";
+const tt = ["aria-label", "data-stepper", "data-framed", "data-fit", "data-short", "data-in-dialog", "data-narrow"], at = ["data-scrolled"], ot = {
+  key: 0,
+  class: "ui-wizard-name",
+  "data-wizard-name": ""
+}, rt = { class: "ui-wizard-heading-row" }, st = ["id", "aria-describedby"], it = {
+  key: 1,
+  class: "ui-wizard-progress",
+  "data-wizard-progress": ""
+}, nt = ["aria-label"], lt = ["data-state", "aria-current"], ut = { class: "sr-only" }, dt = ["id"], ct = { class: "ui-wizard-middle" }, pt = {
+  key: 0,
+  class: "ui-wizard-rail",
+  "data-wizard-rail": ""
+}, vt = ["aria-label"], ft = ["data-state", "aria-current"], yt = {
+  class: "ui-wizard-marker",
+  "aria-hidden": "true"
+}, mt = { class: "ui-wizard-steps-label" }, ht = {
+  key: 0,
+  class: "sr-only"
+}, wt = { class: "ui-wizard-content" }, bt = ["data-scrolled"], kt = { class: "ui-wizard-footer-start" }, gt = { class: "ui-wizard-footer-end" }, Pt = /* @__PURE__ */ $e({
+  __name: "Wizard",
+  props: {
+    activeStepKey: {},
+    footer: { type: [Boolean, Object], default: !0 },
+    cancellable: { type: Boolean, default: !0 },
+    ariaLabel: {},
+    title: {},
+    description: {},
+    stepper: { default: "auto" },
+    showSteps: { type: Boolean, default: void 0 },
+    framed: { type: Boolean, default: !1 },
+    fit: { type: Boolean, default: !1 },
+    fitMinHeight: { default: 320 },
+    railMinWidth: { default: 600 },
+    progressText: {}
+  },
+  emits: ["update:activeStepKey", "next-step", "previous-step", "finished", "cancel", "navigation-error"],
+  setup(be, { expose: ke, emit: ge }) {
+    const c = je(), n = Ve(be, { ariaLabel: "Setup wizard" }), h = ge, u = T([]), p = T(!1), H = T(), ee = T(), te = ve(), ae = ve();
+    D(() => n.activeStepKey, (e) => {
+      e !== void 0 && (H.value = e);
+    }, { immediate: !0 });
+    const i = r(() => u.value.find((e) => e.key === H.value) ?? u.value[0]), k = r(() => i.value?.key), g = r(() => i.value ? u.value.indexOf(i.value) : -1), C = r(() => u.value.length), L = r(() => typeof n.footer == "object" ? n.footer : {}), oe = (e) => e?.props.type === "done" || e?.props.type === "result", M = r(() => oe(i.value)), re = (e) => e.props.type === "result" ? void 0 : le(e.props.nextStepKey), N = r(() => !!i.value && !re(i.value)), _e = r(() => {
+      const e = i.value;
+      return e ? e.props.nextLabel ? e.props.nextLabel : M.value && N.value ? L.value.finishLabel ?? c("Finish") : N.value ? L.value.applyLabel ?? c("Apply") : e.props.type === "welcome" ? L.value.startLabel ?? c("Start") : L.value.nextLabel ?? c("Next") : "";
+    }), ze = r(() => L.value.previousLabel ?? c("Back")), Se = r(() => L.value.cancelLabel ?? c("Cancel")), W = r(() => {
+      const e = i.value;
+      return !e || g.value <= 0 || e.props.type === "welcome" || oe(e) ? !1 : e.props.showBack ?? e.props.type !== "progress";
+    }), xe = r(() => {
+      const e = i.value;
+      return e?.props.showNext ?? e?.props.type !== "progress";
+    }), se = r(() => i.value?.props.type === "progress" ? i.value.props.stopLabel : void 0), Le = r(() => n.cancellable && !M.value), Be = r(() => n.footer !== !1 && i.value?.props.footer !== !1), O = r(
+      () => C.value > 1 && g.value >= 0 ? n.progressText?.(g.value + 1, C.value) ?? c("Step {step} of {total}", { step: g.value + 1, total: C.value }) : void 0
+    ), Ce = r(() => {
+      const e = i.value;
+      if (e?.props.type !== "result") return "done";
+      const t = e.props.resultTone;
+      return t === "warning" ? "warning" : t === "danger" ? "error" : "done";
+    }), b = (e) => e < g.value ? "done" : e === g.value ? M.value ? Ce.value : "current" : "upcoming", P = r(() => ({ done: c("Completed"), current: c("Current step"), upcoming: "", warning: c("Warning"), error: c("Failed") })), ie = (e) => e.props.label || e.props.headline || e.key, j = r(() => i.value?.props.headline), _ = fe("root"), E = Xe(_), V = r(() => n.showSteps === !1 || n.stepper === "none" || C.value < 2 ? "none" : n.stepper === "rail" ? E.value && E.value < n.railMinWidth ? "bar" : "rail" : "bar"), Te = r(() => !!(n.title || j.value || O.value)), { height: q, measure: Ke } = Je(_, () => n.fit, () => n.fitMinHeight);
+    D(() => n.fit, () => Ke());
+    const Ne = Qe(_), G = T(!1);
+    Ae(() => {
+      G.value = !!_.value?.closest('[role="dialog"]');
+    });
+    const Oe = r(() => {
+      const e = n.fit ? q.value : G.value ? Ne.value : 0;
+      return e > 0 && e < 560;
+    }), U = fe("body"), ne = Ye(U, () => "y");
+    function le(e) {
+      return typeof e == "function" ? e() : e;
+    }
+    function Pe(e) {
+      if (u.value.some((a) => a.key === e.key)) return;
+      const t = e.element(), o = t ? u.value.findIndex((a) => {
+        const f = a.element();
+        return !!(f && t.compareDocumentPosition(f) & Node.DOCUMENT_POSITION_FOLLOWING);
+      }) : -1;
+      o < 0 ? u.value.push(e) : u.value.splice(o, 0, e);
+    }
+    function Ee(e) {
+      u.value = u.value.filter((t) => t.key !== e);
+    }
+    function Ie(e) {
+      H.value = e, h("update:activeStepKey", e);
+    }
+    D(k, (e, t) => {
+      if (!e || !t) return;
+      const o = u.value.map((w) => w.key);
+      ee.value = o.indexOf(e) < o.indexOf(t) ? "back" : "forward";
+      const a = typeof document > "u" ? null : document.activeElement;
+      a && (a === document.body || _.value?.contains(a)) && ye(() => {
+        const w = _.value?.querySelector("[data-wizard-heading]") ?? _.value?.querySelector(`[data-wizard-step="${CSS.escape(e)}"]`);
+        w && (w.hasAttribute("tabindex") || (w.tabIndex = -1), Ze(w), U.value?.scrollTo?.({ top: 0 }));
+      });
+    }, { flush: "pre" });
+    let Fe = 0, z;
+    function R() {
+      return z?.controller.abort(), z = { id: ++Fe, controller: new AbortController() }, p.value = !0, z;
+    }
+    const B = (e) => z?.id === e.id;
+    function I(e) {
+      B(e) && (z = void 0, p.value = !1);
+    }
+    function X(e, t) {
+      I(e), Ie(t);
+    }
+    function J() {
+      z && (z.controller.abort(), z = void 0, p.value = !1);
+    }
+    D(k, () => J()), He(J);
+    const ue = (e) => typeof e == "object" && e !== null && typeof e.goTo == "string";
+    async function de(e, t, o) {
+      const a = o === "next" ? t.props.preEnterNextStep : t.props.preEnterPreviousStep, { signal: f } = e.controller, w = new Promise((F) => f.addEventListener("abort", () => F(void 0), { once: !0 }));
+      try {
+        const F = await Promise.race([Promise.resolve(a?.({ from: t.key, direction: o, signal: f })), w]);
+        return !B(e) || F === !1 ? void 0 : { result: F };
+      } catch {
+        B(e) && h("navigation-error", { from: t.key, direction: o, code: "guard-rejected" });
+        return;
+      }
+    }
+    async function ce(e, t, o, a) {
+      if (await ye(), !B(e)) return;
+      const f = a === t.key ? "same-step" : u.value.some((w) => w.key === a) ? void 0 : "unknown-step";
+      if (f) {
+        h("navigation-error", { from: t.key, direction: o, code: f, target: a });
+        return;
+      }
+      X(e, a), o === "next" ? h("next-step", { from: t.key, to: a }) : h("previous-step", { from: t.key, to: a });
+    }
+    async function Q() {
+      const e = i.value;
+      if (p.value || !e) return;
+      const t = R();
+      try {
+        const o = await de(t, e, "next");
+        if (!o) return;
+        if (ue(o.result) && e.props.type !== "result") return await ce(t, e, "next", o.result.goTo);
+        const a = re(e);
+        if (!a) {
+          await e.props.finished?.(), B(t) && h("finished");
+          return;
+        }
+        X(t, a), h("next-step", { from: e.key, to: a });
+      } finally {
+        I(t);
+      }
+    }
+    async function Y() {
+      const e = g.value;
+      if (p.value || e <= 0) return;
+      const t = u.value[e], o = R();
+      try {
+        const a = await de(o, t, "previous");
+        if (!a) return;
+        if (ue(a.result)) return await ce(o, t, "previous", a.result.goTo);
+        const f = le(t.props.previousStepKey) ?? u.value[e - 1].key;
+        X(o, f), h("previous-step", { from: t.key, to: f });
+      } finally {
+        I(o);
+      }
+    }
+    async function pe() {
+      const e = i.value;
+      if (p.value || !e) return;
+      const t = R();
+      try {
+        await e.props.finished?.(), B(t) && h("finished");
+      } finally {
+        I(t);
+      }
+    }
+    function Z() {
+      p.value || h("cancel");
+    }
+    const De = () => i.value?.slots.actions?.();
+    return Me(et, {
+      activeStepKey: k,
+      direction: ee,
+      steps: u,
+      busy: p,
+      headingId: te,
+      register: Pe,
+      unregister: Ee
+    }), ke({
+      activeStepKey: k,
+      currentStepIndex: g,
+      totalSteps: C,
+      canGoPrevious: W,
+      isLastStep: N,
+      busy: p,
+      toNextStep: Q,
+      toPreviousStep: Y,
+      finish: pe,
+      cancel: Z,
+      cancelPending: J
+    }), (e, t) => (s(), d("div", {
+      ref_key: "root",
+      ref: _,
+      class: "ui-wizard",
+      role: "group",
+      "aria-label": l(n).ariaLabel,
+      "data-wizard": "",
+      "data-syno-pkg-land-ui": "",
+      "data-stepper": V.value,
+      "data-framed": l(n).framed ? "" : void 0,
+      "data-fit": l(n).fit ? "" : void 0,
+      "data-short": Oe.value ? "" : void 0,
+      "data-in-dialog": G.value ? "" : void 0,
+      "data-narrow": l(E) && l(E) < 600 ? "" : void 0,
+      style: We(l(q) ? { height: `${l(q)}px` } : void 0)
+    }, [
+      Te.value ? (s(), d("header", {
+        key: 0,
+        class: "ui-wizard-header",
+        "data-scrolled": l(ne).top.value ? "" : void 0,
+        "data-wizard-header": ""
+      }, [
+        l(n).title ? (s(), d("div", ot, y(l(n).title), 1)) : v("", !0),
+        m("div", rt, [
+          j.value ? (s(), d("h2", {
+            id: l(te),
+            key: k.value,
+            class: "ui-wizard-heading",
+            tabindex: "-1",
+            "aria-describedby": O.value ? l(ae) : void 0,
+            "data-wizard-heading": ""
+          }, y(j.value), 9, st)) : v("", !0),
+          O.value ? (s(), d("div", it, [
+            V.value === "bar" ? (s(), d("ol", {
+              key: 0,
+              class: "ui-wizard-segments",
+              "aria-label": l(c)("Steps"),
+              "data-wizard-guide": ""
+            }, [
+              (s(!0), d($, null, me(u.value, (o, a) => (s(), d("li", {
+                key: o.key,
+                class: "ui-wizard-segment",
+                "data-state": b(a),
+                "aria-current": o.key === k.value ? "step" : void 0
+              }, [
+                m("span", ut, [
+                  S(y(ie(o)), 1),
+                  P.value[b(a)] ? (s(), d($, { key: 0 }, [
+                    S(", " + y(P.value[b(a)]), 1)
+                  ], 64)) : v("", !0)
+                ])
+              ], 8, lt))), 128))
+            ], 8, nt)) : v("", !0),
+            m("span", {
+              id: l(ae),
+              class: "ui-wizard-progress-text"
+            }, y(O.value), 9, dt)
+          ])) : v("", !0)
+        ])
+      ], 8, at)) : v("", !0),
+      m("div", ct, [
+        V.value === "rail" ? (s(), d("aside", pt, [
+          m("ol", {
+            class: "ui-wizard-steps",
+            "aria-label": l(c)("Steps"),
+            "data-wizard-guide": ""
+          }, [
+            (s(!0), d($, null, me(u.value, (o, a) => (s(), d("li", {
+              key: o.key,
+              class: "ui-wizard-steps-item",
+              "data-state": b(a),
+              "aria-current": o.key === k.value ? "step" : void 0
+            }, [
+              m("span", yt, [
+                b(a) === "done" ? (s(), x(l(qe), {
+                  key: 0,
+                  class: "size-3",
+                  "stroke-width": 3
+                })) : b(a) === "warning" ? (s(), x(l(Ge), {
+                  key: 1,
+                  class: "size-3",
+                  "stroke-width": 2.5
+                })) : b(a) === "error" ? (s(), x(l(Ue), {
+                  key: 2,
+                  class: "size-3",
+                  "stroke-width": 3
+                })) : (s(), d($, { key: 3 }, [
+                  S(y(a + 1), 1)
+                ], 64))
+              ]),
+              m("span", mt, [
+                S(y(ie(o)), 1),
+                P.value[b(a)] ? (s(), d("span", ht, ", " + y(P.value[b(a)]), 1)) : v("", !0)
+              ])
+            ], 8, ft))), 128))
+          ], 8, vt)
+        ])) : v("", !0),
+        m("div", {
+          ref_key: "body",
+          ref: U,
+          class: "ui-wizard-body",
+          "data-wizard-body": ""
+        }, [
+          m("div", wt, [
+            he(e.$slots, "default")
+          ])
+        ], 512)
+      ]),
+      Be.value ? (s(), d("footer", {
+        key: 1,
+        class: "ui-wizard-footer",
+        "data-scrolled": l(ne).bottom.value ? "" : void 0,
+        "data-wizard-footer": "",
+        "data-ui-footer-bar": ""
+      }, [
+        we(Re, { kind: "action" }, {
+          default: K(() => [
+            he(e.$slots, "footer", {
+              nextStep: Q,
+              previousStep: Y,
+              finish: pe,
+              cancel: Z,
+              canGoPrevious: W.value,
+              isLastStep: N.value,
+              busy: p.value,
+              stepKey: k.value
+            }, () => [
+              m("div", kt, [
+                we(De)
+              ]),
+              m("div", gt, [
+                Le.value ? (s(), x(A, {
+                  key: 0,
+                  variant: "secondary",
+                  disabled: p.value,
+                  "data-wizard-cancel": "",
+                  onClick: Z
+                }, {
+                  default: K(() => [
+                    S(y(Se.value), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])) : v("", !0),
+                W.value ? (s(), x(A, {
+                  key: 1,
+                  variant: "secondary",
+                  disabled: p.value,
+                  "data-wizard-back": "",
+                  onClick: Y
+                }, {
+                  default: K(() => [
+                    S(y(ze.value), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])) : v("", !0),
+                se.value ? (s(), x(A, {
+                  key: 2,
+                  variant: "secondary",
+                  disabled: i.value?.props.stopDisabled,
+                  "data-wizard-stop": "",
+                  onClick: t[0] || (t[0] = (o) => i.value?.stop())
+                }, {
+                  default: K(() => [
+                    S(y(se.value), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])) : v("", !0),
+                xe.value ? (s(), x(A, {
+                  key: 3,
+                  variant: "primary",
+                  loading: p.value,
+                  disabled: !i.value || i.value.props.nextDisabled,
+                  "data-wizard-next": "",
+                  onClick: Q
+                }, {
+                  default: K(() => [
+                    S(y(_e.value), 1)
+                  ]),
+                  _: 1
+                }, 8, ["loading", "disabled"])) : v("", !0)
+              ])
+            ])
+          ]),
+          _: 3
+        })
+      ], 8, bt)) : v("", !0)
+    ], 12, tt));
+  }
+});
+export {
+  Pt as default
+};

package/dist/modules/components/composite/wizard/Wizard2.vue.js

@@ -0,0 +1,4 @@
+import f from "./Wizard.vue.js";
+export {
+  f as default
+};

package/dist/modules/components/composite/wizard/WizardDialog.vue.js

@@ -0,0 +1,129 @@
+import { defineComponent as k, ref as m, computed as h, useTemplateRef as x, watch as D, openBlock as T, createBlock as F, createSlots as H, withCtx as i, createVNode as r, mergeProps as S, renderSlot as g, unref as d, createTextVNode as w, toDisplayString as v } from "vue";
+import z from "../../primitives/button/Button.vue.js";
+import y from "../../primitives/dialog/Dialog.vue.js";
+import { useUiText as U } from "../../../i18n/text.js";
+import W from "./Wizard.vue.js";
+const I = "clamp(min(560px, 100%), 75%, 860px)", L = "clamp(min(420px, 100%), calc(100% - 48px), 600px)", G = /* @__PURE__ */ k({
+  inheritAttrs: !1,
+  __name: "WizardDialog",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: !1 },
+    title: {},
+    description: {},
+    size: {},
+    width: {},
+    height: {},
+    closeLabel: {},
+    showClose: { type: Boolean, default: !0 },
+    closeOnFinish: { type: Boolean, default: !0 },
+    confirmClose: { type: Boolean, default: !1 },
+    presentation: { default: "modal" }
+  },
+  emits: ["update:open", "finished", "cancel"],
+  setup(C, { emit: _ }) {
+    const e = C, l = U(), n = m(!1), $ = h(() => e.width ?? (e.size ? void 0 : I)), a = _, p = m(e.defaultOpen);
+    function c(t) {
+      e.open === void 0 && (p.value = t), a("update:open", t);
+    }
+    const f = h({
+      get: () => e.open ?? p.value,
+      set: (t) => {
+        if (!t && e.confirmClose) {
+          n.value = !0;
+          return;
+        }
+        t || a("cancel"), c(t);
+      }
+    });
+    function B() {
+      n.value = !1, a("cancel"), c(!1);
+    }
+    function O() {
+      a("finished"), e.closeOnFinish && c(!1);
+    }
+    function b() {
+      f.value = !1;
+    }
+    const u = x("wizard");
+    return D(() => e.open ?? p.value, (t) => {
+      t || u.value?.cancelPending();
+    }), (t, o) => (T(), F(y, {
+      open: f.value,
+      "onUpdate:open": o[2] || (o[2] = (s) => f.value = s),
+      title: e.title,
+      description: e.description,
+      size: e.size,
+      width: $.value,
+      height: e.height ?? L,
+      "close-label": e.closeLabel,
+      "show-close": e.showClose,
+      "header-divider": !1,
+      "close-on-outside": !1,
+      presentation: e.presentation,
+      scrim: "light",
+      flush: "",
+      "data-wizard-dialog": ""
+    }, H({
+      default: i(() => [
+        r(W, S({
+          ref_key: "wizard",
+          ref: u,
+          cancellable: !1
+        }, t.$attrs, {
+          onFinished: O,
+          onCancel: b
+        }), {
+          default: i(() => [
+            g(t.$slots, "default")
+          ]),
+          _: 3
+        }, 16),
+        r(y, {
+          open: n.value,
+          "onUpdate:open": o[1] || (o[1] = (s) => n.value = s),
+          title: d(l)("Discard changes?"),
+          description: d(l)("What you entered will be lost"),
+          "show-close": !1,
+          "close-on-outside": !1,
+          presentation: "modal",
+          "data-wizard-confirm-close": ""
+        }, {
+          footer: i(() => [
+            r(z, {
+              onClick: o[0] || (o[0] = (s) => n.value = !1)
+            }, {
+              default: i(() => [
+                w(v(d(l)("Keep editing")), 1)
+              ]),
+              _: 1
+            }),
+            r(z, {
+              variant: "danger",
+              "data-wizard-discard": "",
+              onClick: B
+            }, {
+              default: i(() => [
+                w(v(d(l)("Discard")), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["open", "title", "description"])
+      ]),
+      _: 2
+    }, [
+      t.$slots.trigger ? {
+        name: "trigger",
+        fn: i(() => [
+          g(t.$slots, "trigger")
+        ]),
+        key: "0"
+      } : void 0
+    ]), 1032, ["open", "title", "description", "size", "width", "height", "close-label", "show-close", "presentation"]));
+  }
+});
+export {
+  G as default
+};

package/dist/modules/components/composite/wizard/WizardDialog2.vue.js

@@ -0,0 +1,4 @@
+import f from "./WizardDialog.vue.js";
+export {
+  f as default
+};

package/dist/modules/components/composite/wizard/WizardStep.vue.js

@@ -0,0 +1,144 @@
+import { defineComponent as U, useSlots as V, useTemplateRef as W, onMounted as $, onBeforeUnmount as F, computed as i, withDirectives as I, openBlock as a, createElementBlock as t, unref as s, Fragment as f, createElementVNode as c, createVNode as _, renderList as R, normalizeStyle as A, createBlock as b, resolveDynamicComponent as k, createCommentVNode as l, renderSlot as g, toDisplayString as x, vShow as H } from "vue";
+import { Info as M, X as P, TriangleAlert as X, Check as S } from "@lucide/vue";
+import j from "../../primitives/progress/Progress.vue.js";
+import { useUiText as q } from "../../../i18n/text.js";
+import { useWizardContext as G } from "./wizardContext.js";
+const J = ["aria-hidden", "aria-labelledby", "data-wizard-step", "data-type", "data-tone", "data-active", "data-direction"], O = ["data-hero", "data-done"], Q = ["data-wizard-hero"], Y = { class: "ui-wizard-celebrate-mark" }, Z = ["aria-label", "data-tone", "data-wizard-hero"], ee = { class: "ui-wizard-celebrate-mark" }, ae = {
+  key: 2,
+  class: "ui-wizard-stage",
+  "data-wizard-hero": ""
+}, te = {
+  key: 3,
+  class: "ui-wizard-tile",
+  "data-wizard-hero": "",
+  "aria-hidden": "true"
+}, oe = {
+  key: 4,
+  class: "ui-wizard-step-description"
+}, ie = {
+  key: 1,
+  class: "ui-wizard-work",
+  "data-wizard-work": ""
+}, re = {
+  class: "ui-wizard-work-status",
+  role: "status",
+  "aria-live": "polite",
+  "data-wizard-status": ""
+}, pe = /* @__PURE__ */ U({
+  __name: "WizardStep",
+  props: {
+    stepKey: {},
+    type: { default: "normal" },
+    headline: { default: "" },
+    label: {},
+    description: {},
+    icon: {},
+    nextStepKey: {},
+    previousStepKey: {},
+    preEnterNextStep: {},
+    preEnterPreviousStep: {},
+    finished: {},
+    footer: { type: Boolean, default: !0 },
+    nextLabel: {},
+    nextDisabled: { type: Boolean, default: !1 },
+    showNext: { type: Boolean, default: void 0 },
+    showBack: { type: Boolean, default: void 0 },
+    lazy: { type: Boolean, default: !1 },
+    progress: {},
+    resultTone: { default: "neutral" },
+    stopLabel: {},
+    stopDisabled: { type: Boolean, default: !1 }
+  },
+  emits: ["stop"],
+  setup(B, { expose: K, emit: T }) {
+    const e = B, D = T, C = q(), n = G(), d = V(), v = W("section");
+    $(() => {
+      n?.register({ key: e.stepKey, props: e, slots: d, element: () => v.value, stop: () => D("stop") });
+    }), F(() => n?.unregister(e.stepKey));
+    const r = i(() => n?.activeStepKey.value === e.stepKey), m = i(() => e.type === "done"), p = i(() => e.type === "result"), E = i(() => e.type === "progress"), h = {
+      success: { icon: S, text: "Succeeded" },
+      warning: { icon: X, text: "Warning" },
+      danger: { icon: P, text: "Failed" },
+      neutral: { icon: M, text: "Done" }
+    }, y = i(() => h[e.resultTone] ?? h.neutral), u = i(() => m.value || p.value), L = i(() => !!(e.description || e.icon || d.hero || u.value)), N = i(() => d.hero ? "stage" : u.value ? "done" : e.icon ? "icon" : void 0), o = i(() => e.progress ?? { mode: "indeterminate", label: e.headline || e.label || "" });
+    return K({ active: r }), (w, se) => I((a(), t("section", {
+      ref_key: "section",
+      ref: v,
+      class: "ui-wizard-step",
+      "aria-hidden": r.value ? void 0 : "true",
+      "aria-labelledby": r.value && e.headline ? s(n)?.headingId : void 0,
+      "data-wizard-step": e.stepKey,
+      "data-type": e.type,
+      "data-tone": p.value ? e.resultTone : void 0,
+      "data-active": r.value ? "" : void 0,
+      "data-direction": r.value ? s(n)?.direction.value : void 0
+    }, [
+      r.value || !e.lazy ? (a(), t(f, { key: 0 }, [
+        L.value ? (a(), t("header", {
+          key: 0,
+          class: "ui-wizard-step-head",
+          "data-hero": N.value,
+          "data-done": u.value ? "" : void 0
+        }, [
+          m.value ? (a(), t("div", {
+            key: 0,
+            class: "ui-wizard-celebrate",
+            "data-wizard-celebrate": "",
+            "data-wizard-hero": s(d).hero ? void 0 : "",
+            "aria-hidden": "true"
+          }, [
+            c("span", Y, [
+              _(s(S), {
+                class: "size-8",
+                "stroke-width": 2.75
+              })
+            ]),
+            (a(), t(f, null, R(8, (z) => c("span", {
+              key: z,
+              class: "ui-wizard-confetti",
+              style: A({ "--ui-wizard-confetti-i": z })
+            }, null, 4)), 64))
+          ], 8, Q)) : p.value ? (a(), t("div", {
+            key: 1,
+            class: "ui-wizard-celebrate ui-wizard-result",
+            role: "img",
+            "aria-label": s(C)(y.value.text),
+            "data-tone": e.resultTone,
+            "data-wizard-result": "",
+            "data-wizard-hero": s(d).hero ? void 0 : ""
+          }, [
+            c("span", ee, [
+              (a(), b(k(y.value.icon), {
+                class: "size-8",
+                "stroke-width": 2.75,
+                "aria-hidden": "true"
+              }))
+            ])
+          ], 8, Z)) : l("", !0),
+          s(d).hero ? (a(), t("div", ae, [
+            g(w.$slots, "hero")
+          ])) : e.icon && !u.value ? (a(), t("div", te, [
+            (a(), b(k(e.icon), { class: "size-6" }))
+          ])) : l("", !0),
+          e.description ? (a(), t("p", oe, x(e.description), 1)) : l("", !0)
+        ], 8, O)) : l("", !0),
+        E.value ? (a(), t("div", ie, [
+          _(j, {
+            label: o.value.label,
+            indeterminate: o.value.mode === "indeterminate",
+            value: o.value.mode === "determinate" ? o.value.value : void 0,
+            max: o.value.mode === "determinate" ? o.value.max : void 0,
+            "value-label": o.value.mode === "determinate" ? o.value.valueLabel : void 0
+          }, null, 8, ["label", "indeterminate", "value", "max", "value-label"]),
+          c("p", re, x(o.value.status), 1)
+        ])) : l("", !0),
+        g(w.$slots, "default")
+      ], 64)) : l("", !0)
+    ], 8, J)), [
+      [H, r.value]
+    ]);
+  }
+});
+export {
+  pe as default
+};

package/dist/modules/components/composite/wizard/WizardStep2.vue.js

@@ -0,0 +1,4 @@
+import f from "./WizardStep.vue.js";
+export {
+  f as default
+};