@alfadocs/ui-kit 0.0.20 → 0.1.1

package/dist/_chunks/{stepper-calendar-BQMjrwzo.js → stepper-calendar-vtWwa2bY.js}

@@ -3,31 +3,31 @@ import { forwardRef as X, useMemo as C, useState as U, useEffect as W, useRef as
 import { c as N } from "./index-D2ZczOXr.js";
 import { useTranslation as Ce } from "react-i18next";
 import { s as Ne } from "./stepper-C-sIpRRU.js";
-import { S as De } from "./stepper-progress-Bwfl-0rV.js";
-import { B as H } from "./button-CXL8bA8G.js";
-import { I as re } from "./icon-button-C1vpylg3.js";
-import { p as F, S as ae } from "./slot-grid-DL_Tuj0p.js";
-import { S as te } from "./skeleton-vbTWUntB.js";
-import { E as le } from "./empty-state-DiG7vYBM.js";
-import { a as Me } from "./calendar-BIXVzhkL.js";
-import { a as J, s as ne, b as B, c as E, f as Q, i as oe } from "./isSameMonth-5wNF2f4I.js";
+import { S as De } from "./stepper-progress-DMZ5w5VR.js";
+import { B as H } from "./button-DmiGFnNA.js";
+import { I as re } from "./icon-button-C482ii4y.js";
+import { p as F, S as ae } from "./slot-grid-BRAkqChA.js";
+import { S as te } from "./skeleton-ClO1v5GE.js";
+import { E as de } from "./empty-state-DV96gCnp.js";
+import { a as Me } from "./calendar-BkDeDTaX.js";
+import { a as J, s as ne, b as B, c as E, f as Q, i as se } from "./isSameMonth-5wNF2f4I.js";
 import { C as Le } from "./chevron-left-CX1jqD2M.js";
 import { C as Te } from "./chevron-right-BrpYejk0.js";
 import { i as Ae } from "./isSameDay-ecuM8PBB.js";
-function ie(t, m, b) {
+function oe(t, m, b) {
   return J(t, -1, b);
 }
-const Ie = /^(\d{4}-\d{2}-\d{2})T(\d{2}:\d{2})$/, se = 4, Re = N(
-  "flex w-full flex-col gap-[var(--spacing-md)] text-[var(--foreground)]",
+const Ie = /^(\d{4}-\d{2}-\d{2})T(\d{2}:\d{2})$/, ie = 4, Re = N(
+  "ds:flex ds:w-full ds:flex-col ds:gap-[var(--spacing-md)] ds:text-[var(--foreground)]",
   {
     variants: {
       layout: {
-        vertical: "flex-col",
-        horizontal: "lg:flex-row lg:items-start"
+        vertical: "ds:flex-col",
+        horizontal: "ds:lg:flex-row ds:lg:items-start"
       },
       density: {
-        comfortable: "gap-[var(--spacing-md)]",
-        compact: "gap-[var(--spacing-sm)]"
+        comfortable: "ds:gap-[var(--spacing-md)]",
+        compact: "ds:gap-[var(--spacing-sm)]"
       }
     },
     defaultVariants: {
@@ -37,62 +37,62 @@ const Ie = /^(\d{4}-\d{2}-\d{2})T(\d{2}:\d{2})$/, se = 4, Re = N(
   }
 ), ze = N(
   [
-    "flex flex-col gap-[var(--spacing-md)]",
-    "rounded-[var(--radius-md)] border border-[var(--border)] bg-[var(--card)]",
-    "ps-[var(--spacing-md)] pe-[var(--spacing-md)]",
-    "pt-[var(--spacing-md)] pb-[var(--spacing-md)]"
+    "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]",
+    "ds:rounded-[var(--radius-md)] ds:border ds:border-[var(--border)] ds:bg-[var(--card)]",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]"
   ].join(" "),
   {
     variants: {
       density: {
-        comfortable: "gap-[var(--spacing-md)]",
-        compact: "gap-[var(--spacing-sm)]"
+        comfortable: "ds:gap-[var(--spacing-md)]",
+        compact: "ds:gap-[var(--spacing-sm)]"
       }
     },
     defaultVariants: { density: "comfortable" }
   }
 ), Se = N(
   [
-    "group/service flex flex-col items-start gap-[var(--spacing-xs)] text-start",
-    "rounded-[var(--radius-md)] border border-[var(--border)] bg-[var(--background)]",
-    "ps-[var(--spacing-md)] pe-[var(--spacing-md)]",
-    "pt-[var(--spacing-sm)] pb-[var(--spacing-sm)]",
-    "min-h-[var(--min-target-size)]",
-    "transition-[background-color,border-color] duration-[var(--animation-duration)] ease-[var(--ease-out)]",
-    "motion-reduce:transition-none",
-    "hover:enabled:bg-[var(--muted)]/40",
-    "focus-visible:outline-[length:var(--focus-ring-width)] focus-visible:outline-solid",
-    "focus-visible:outline-[var(--ring)] focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "aria-checked:border-[var(--primary)] aria-checked:bg-[var(--primary)]/5",
-    "disabled:opacity-50 disabled:cursor-not-allowed"
+    "ds:group/service ds:flex ds:flex-col ds:items-start ds:gap-[var(--spacing-xs)] ds:text-start",
+    "ds:rounded-[var(--radius-md)] ds:border ds:border-[var(--border)] ds:bg-[var(--background)]",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]",
+    "ds:min-h-[var(--min-target-size)]",
+    "ds:transition-[background-color,border-color] ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]",
+    "ds:motion-reduce:transition-none",
+    "ds:hover:enabled:bg-[var(--muted)]/40",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:aria-checked:border-[var(--primary)] ds:aria-checked:bg-[var(--primary)]/5",
+    "ds:disabled:opacity-50 ds:disabled:cursor-not-allowed"
   ].join(" ")
 ), je = N(
-  "flex items-center justify-between gap-[var(--spacing-sm)]"
+  "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)]"
 ), K = N(
-  "grid grid-cols-7 gap-[var(--spacing-xs)]"
+  "ds:grid ds:grid-cols-7 ds:gap-[var(--spacing-xs)]"
 ), Be = N(
   [
-    "inline-flex items-center justify-center",
+    "ds:inline-flex ds:items-center ds:justify-center",
     // `min-target-size` (44/48px) governs the rendered size — it always
     // exceeds the explicit floor below. Keeping the explicit floor for
     // grid layout stability when the cell content is empty (skeletons),
     // matching the precedent in `slot-grid`.
-    "min-h-[var(--min-target-size)] min-w-[var(--min-target-size)]",
-    "h-10 w-10 rounded-[var(--radius-sm)]",
-    "text-[var(--font-size-sm)] font-[var(--font-weight-medium)]",
-    "border border-transparent bg-[var(--background)] text-[var(--foreground)]",
-    "transition-[background-color,border-color,color] duration-[var(--animation-duration)] ease-[var(--ease-out)]",
-    "motion-reduce:transition-none",
-    "hover:enabled:bg-[var(--muted)]/40",
-    "focus-visible:outline-[length:var(--focus-ring-width)] focus-visible:outline-solid",
-    "focus-visible:outline-[var(--ring)] focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "disabled:opacity-40 disabled:cursor-not-allowed",
-    "aria-selected:bg-[var(--primary)] aria-selected:text-[var(--primary-foreground)]",
-    "aria-selected:border-[var(--primary)]",
-    "data-[outside=true]:text-[var(--muted-foreground)]"
+    "ds:min-h-[var(--min-target-size)] ds:min-w-[var(--min-target-size)]",
+    "ds:h-10 ds:w-10 ds:rounded-[var(--radius-sm)]",
+    "ds:text-[var(--font-size-sm)] ds:font-[var(--font-weight-medium)]",
+    "ds:border ds:border-transparent ds:bg-[var(--background)] ds:text-[var(--foreground)]",
+    "ds:transition-[background-color,border-color,color] ds:duration-[var(--animation-duration)] ds:ease-[var(--ease-out)]",
+    "ds:motion-reduce:transition-none",
+    "ds:hover:enabled:bg-[var(--muted)]/40",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:disabled:opacity-40 ds:disabled:cursor-not-allowed",
+    "ds:aria-selected:bg-[var(--primary)] ds:aria-selected:text-[var(--primary-foreground)]",
+    "ds:aria-selected:border-[var(--primary)]",
+    "ds:data-[outside=true]:text-[var(--muted-foreground)]"
   ].join(" ")
 ), Ee = N(
-  "flex items-center justify-between gap-[var(--spacing-sm)] mt-[var(--spacing-md)]"
+  "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)] ds:mt-[var(--spacing-md)]"
 );
 function O(t) {
   return Q(t, "yyyy-MM-dd");
@@ -100,25 +100,25 @@ function O(t) {
 function Fe(t) {
   return t.serviceId ? t.date ? t.time ? 3 : 2 : 1 : 0;
 }
-const ce = X(
-  ({ services: t, selectedId: m, onSelect: b, durationLabel: s, groupLabel: v }, u) => {
+const le = X(
+  ({ services: t, selectedId: m, onSelect: b, durationLabel: i, groupLabel: v }, u) => {
     const x = V([]), D = (() => {
-      const r = t.findIndex((o) => o.id === m);
+      const r = t.findIndex((s) => s.id === m);
       return r >= 0 ? r : 0;
     })(), f = (r) => {
-      const o = (r + t.length) % t.length, g = x.current[o];
+      const s = (r + t.length) % t.length, g = x.current[s];
       if (!g) return;
       g.focus();
-      const c = t[o];
-      c && b(c.id);
-    }, n = (r, o) => {
-      const g = typeof document < "u" && document.documentElement.dir === "rtl", c = g ? "ArrowLeft" : "ArrowRight", h = g ? "ArrowRight" : "ArrowLeft";
-      if (r.key === c || r.key === "ArrowDown") {
-        r.preventDefault(), f(o + 1);
+      const l = t[s];
+      l && b(l.id);
+    }, n = (r, s) => {
+      const g = typeof document < "u" && document.documentElement.dir === "rtl", l = g ? "ArrowLeft" : "ArrowRight", h = g ? "ArrowRight" : "ArrowLeft";
+      if (r.key === l || r.key === "ArrowDown") {
+        r.preventDefault(), f(s + 1);
         return;
       }
       if (r.key === h || r.key === "ArrowUp") {
-        r.preventDefault(), f(o - 1);
+        r.preventDefault(), f(s - 1);
         return;
       }
       if (r.key === "Home") {
@@ -133,26 +133,26 @@ const ce = X(
         ref: u,
         role: "radiogroup",
         "aria-label": v,
-        className: "grid gap-[var(--spacing-sm)] sm:grid-cols-2",
-        children: t.map((r, o) => {
+        className: "ds:grid ds:gap-[var(--spacing-sm)] ds:sm:grid-cols-2",
+        children: t.map((r, s) => {
           const g = r.id === m;
           return /* @__PURE__ */ w(
             "button",
             {
               ref: (h) => {
-                x.current[o] = h;
+                x.current[s] = h;
               },
               type: "button",
               role: "radio",
               "aria-checked": g,
-              tabIndex: o === D ? 0 : -1,
+              tabIndex: s === D ? 0 : -1,
               onClick: () => b(r.id),
-              onKeyDown: (h) => n(h, o),
+              onKeyDown: (h) => n(h, s),
               className: Se(),
               children: [
-                /* @__PURE__ */ a("span", { className: "type-body-sm font-[var(--font-weight-semibold)] text-[var(--foreground)]", children: r.label }),
-                r.description ? /* @__PURE__ */ a("span", { className: "type-meta text-[var(--muted-foreground)]", children: r.description }) : null,
-                /* @__PURE__ */ a("span", { className: "type-meta text-[var(--muted-foreground)]", children: s(r.durationMin) })
+                /* @__PURE__ */ a("span", { className: "type-body-sm ds:font-[var(--font-weight-semibold)] ds:text-[var(--foreground)]", children: r.label }),
+                r.description ? /* @__PURE__ */ a("span", { className: "type-meta ds:text-[var(--muted-foreground)]", children: r.description }) : null,
+                /* @__PURE__ */ a("span", { className: "type-meta ds:text-[var(--muted-foreground)]", children: i(r.durationMin) })
               ]
             },
             r.id
@@ -162,13 +162,13 @@ const ce = X(
     );
   }
 );
-ce.displayName = "StepperCalendar.ServiceGrid";
-const de = X(
+le.displayName = "StepperCalendar.ServiceGrid";
+const ce = X(
   ({
     availableDates: t,
     selectedDate: m,
     onSelectDate: b,
-    loading: s,
+    loading: i,
     locale: v,
     weekStartsOn: u,
     prevLabel: x,
@@ -179,77 +179,77 @@ const de = X(
       if (m) return F(m);
       const e = [...t].sort()[0];
       return e ? F(e) : /* @__PURE__ */ new Date();
-    }, [t, m]), [o, g] = U(r), [c, h] = U(
+    }, [t, m]), [s, g] = U(r), [l, h] = U(
       m ? F(m) : r
-    ), $ = ne(o), l = B($, { weekStartsOn: u }), G = C(() => {
+    ), $ = ne(s), d = B($, { weekStartsOn: u }), G = C(() => {
       const e = [];
-      for (let d = 0; d < 42; d += 1)
-        e.push(E(l, d));
+      for (let c = 0; c < 42; c += 1)
+        e.push(E(d, c));
       return e;
-    }, [l]), T = C(() => {
-      const e = B(/* @__PURE__ */ new Date(), { weekStartsOn: u }), d = new Intl.DateTimeFormat(v, { weekday: "short" });
-      return Array.from({ length: 7 }, (I, y) => d.format(E(e, y)));
+    }, [d]), T = C(() => {
+      const e = B(/* @__PURE__ */ new Date(), { weekStartsOn: u }), c = new Intl.DateTimeFormat(v, { weekday: "short" });
+      return Array.from({ length: 7 }, (I, y) => c.format(E(e, y)));
     }, [v, u]), S = C(() => {
       try {
         return new Intl.DateTimeFormat(v, {
           month: "long",
           year: "numeric"
-        }).format(o);
+        }).format(s);
       } catch {
-        return Q(o, "MMMM yyyy");
+        return Q(s, "MMMM yyyy");
       }
-    }, [v, o]), k = q(
+    }, [v, s]), k = q(
       (e) => t.has(O(e)),
       [t]
-    ), i = q(
+    ), o = q(
       (e) => {
-        h(e), oe(e, o) || g(ne(e));
+        h(e), se(e, s) || g(ne(e));
       },
-      [o]
+      [s]
     ), M = (e) => {
-      const d = {
+      const c = {
         ArrowLeft: -1,
         ArrowRight: 1,
         ArrowUp: -7,
         ArrowDown: 7
       };
-      if (e.key in d) {
-        e.preventDefault(), i(E(c, d[e.key]));
+      if (e.key in c) {
+        e.preventDefault(), o(E(l, c[e.key]));
         return;
       }
       if (e.key === "Home") {
-        e.preventDefault(), i(B(c, { weekStartsOn: u }));
+        e.preventDefault(), o(B(l, { weekStartsOn: u }));
         return;
       }
       if (e.key === "End") {
-        e.preventDefault(), i(E(B(c, { weekStartsOn: u }), 6));
+        e.preventDefault(), o(E(B(l, { weekStartsOn: u }), 6));
         return;
       }
       if (e.key === "PageUp") {
-        e.preventDefault(), i(ie(c));
+        e.preventDefault(), o(oe(l));
         return;
       }
       if (e.key === "PageDown") {
-        e.preventDefault(), i(J(c, 1));
+        e.preventDefault(), o(J(l, 1));
         return;
       }
-      (e.key === "Enter" || e.key === " ") && (e.preventDefault(), k(c) && b(O(c)));
+      (e.key === "Enter" || e.key === " ") && (e.preventDefault(), k(l) && b(O(l)));
     }, A = V(null);
     return W(() => {
       var e;
       (e = A.current) == null || e.focus();
-    }, [c.getTime()]), s ? /* @__PURE__ */ w("div", { ref: n, className: "flex flex-col gap-[var(--spacing-sm)]", children: [
+    }, [l.getTime()]), i ? /* @__PURE__ */ w("div", { ref: n, className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
       /* @__PURE__ */ a(te, { variant: "text", size: "md", width: "40%" }),
-      /* @__PURE__ */ a("div", { className: K(), children: Array.from({ length: 42 }, (e, d) => /* @__PURE__ */ a(
+      /* @__PURE__ */ a("div", { className: K(), children: Array.from({ length: 42 }, (e, c) => /* @__PURE__ */ a(
         te,
         {
           variant: "rounded",
           size: "md",
           height: "40px"
         },
-        `day-skeleton-${d}`
+        `day-skeleton-${c}`
       )) })
-    ] }) : t.size === 0 ? /* @__PURE__ */ a("div", { ref: n, children: /* @__PURE__ */ a(le, { variant: "no-results", title: f }) }) : /* @__PURE__ */ w("div", { ref: n, className: "flex flex-col gap-[var(--spacing-sm)]", children: [
+    ] }) : t.size === 0 ? /* @__PURE__ */ a("div", { ref: n, children: /* @__PURE__ */ a(de, { variant: "no-results", title: f }) }) : /* @__PURE__ */ w("div", { ref: n, className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: [
       /* @__PURE__ */ w("div", { className: je(), children: [
         /* @__PURE__ */ a(
           re,
@@ -259,13 +259,13 @@ const de = X(
             size: "sm",
             intent: "ghost",
             flipIconInRtl: !0,
-            onClick: () => g(ie(o))
+            onClick: () => g(oe(s))
           }
         ),
         /* @__PURE__ */ a(
           "span",
           {
-            className: "type-body-sm font-[var(--font-weight-semibold)]",
+            className: "type-body-sm ds:font-[var(--font-weight-semibold)]",
             "aria-live": "polite",
             children: S
           }
@@ -278,7 +278,7 @@ const de = X(
             size: "sm",
             intent: "ghost",
             flipIconInRtl: !0,
-            onClick: () => g(J(o, 1))
+            onClick: () => g(J(s, 1))
           }
         )
       ] }),
@@ -287,27 +287,27 @@ const de = X(
         {
           role: "grid",
           "aria-label": S,
-          className: "flex flex-col gap-[var(--spacing-xs)]",
+          className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]",
           onKeyDown: M,
           children: [
             /* @__PURE__ */ a("div", { className: K(), role: "row", children: T.map((e) => /* @__PURE__ */ a(
               "span",
               {
                 role: "columnheader",
-                className: "type-meta text-center text-[var(--muted-foreground)]",
+                className: "type-meta ds:text-center ds:text-[var(--muted-foreground)]",
                 children: e
               },
               e
             )) }),
-            Array.from({ length: 6 }, (e, d) => {
-              const I = G.slice(d * 7, d * 7 + 7);
+            Array.from({ length: 6 }, (e, c) => {
+              const I = G.slice(c * 7, c * 7 + 7);
               return /* @__PURE__ */ a(
                 "div",
                 {
                   role: "row",
                   className: K(),
                   children: I.map((y) => {
-                    const R = O(y), _ = !oe(y, o), L = k(y), P = m === R, j = Ae(y, c);
+                    const R = O(y), _ = !se(y, s), L = k(y), P = m === R, j = Ae(y, l);
                     return /* @__PURE__ */ a(
                       "button",
                       {
@@ -327,7 +327,7 @@ const de = X(
                     );
                   })
                 },
-                `week-${d}`
+                `week-${c}`
               );
             })
           ]
@@ -336,17 +336,17 @@ const de = X(
     ] });
   }
 );
-de.displayName = "StepperCalendar.MonthGrid";
+ce.displayName = "StepperCalendar.MonthGrid";
 function Ve({
   date: t,
   slots: m,
   selectedTime: b,
-  loading: s,
+  loading: i,
   emptyLabel: v,
   onSelect: u
 }) {
   if (!t) return null;
-  if (s)
+  if (i)
     return /* @__PURE__ */ a(
       ae,
       {
@@ -355,12 +355,12 @@ function Ve({
       }
     );
   if (m.length === 0)
-    return /* @__PURE__ */ a(le, { variant: "no-results", title: v });
+    return /* @__PURE__ */ a(de, { variant: "no-results", title: v });
   const x = m.map((f) => {
-    const [n, r] = f.split(":"), o = F(t);
-    return o.setHours(Number(n), Number(r), 0, 0), {
+    const [n, r] = f.split(":"), s = F(t);
+    return s.setHours(Number(n), Number(r), 0, 0), {
       id: `${t}T${f}`,
-      start: o,
+      start: s,
       label: f
     };
   });
@@ -381,7 +381,7 @@ const $e = X(
     services: t,
     availableDates: m,
     availableSlots: b,
-    value: s,
+    value: i,
     onChange: v,
     onSubmit: u,
     detailsFields: x,
@@ -389,19 +389,19 @@ const $e = X(
     loadingSlots: f = !1,
     stepStatuses: n,
     layout: r = "vertical",
-    density: o = "comfortable",
+    density: s = "comfortable",
     "aria-label": g,
-    className: c,
+    className: l,
     ...h
   }, $) => {
     var Z;
-    const { t: l, i18n: G } = Ce(), T = G.language ?? "en", S = C(
+    const { t: d, i18n: G } = Ce(), T = G.language ?? "en", S = C(
       () => Me(T),
       [T]
-    ), k = Fe(s), [i, M] = U(k);
+    ), k = Fe(i), [o, M] = U(k);
     W(() => {
-      i > k && M(k);
-    }, [i, k]);
+      o > k && M(k);
+    }, [o, k]);
     const A = V(null), e = V(!0);
     W(() => {
       var p;
@@ -410,57 +410,57 @@ const $e = X(
         return;
       }
       (p = A.current) == null || p.focus();
-    }, [i]);
-    const d = C(
+    }, [o]);
+    const c = C(
       () => [
         {
-          label: l("navigation.stepperCalendar.steps.service"),
+          label: d("navigation.stepperCalendar.steps.service"),
           status: n == null ? void 0 : n[0]
         },
         {
-          label: l("navigation.stepperCalendar.steps.date"),
+          label: d("navigation.stepperCalendar.steps.date"),
           status: n == null ? void 0 : n[1]
         },
         {
-          label: l("navigation.stepperCalendar.steps.time"),
+          label: d("navigation.stepperCalendar.steps.time"),
           status: n == null ? void 0 : n[2]
         },
         {
-          label: l("navigation.stepperCalendar.steps.details"),
+          label: d("navigation.stepperCalendar.steps.details"),
           status: n == null ? void 0 : n[3]
         }
       ],
-      [n, l]
-    ), I = g ?? l("navigation.stepperCalendar.label"), y = l("navigation.stepperCalendar.actions.back"), R = l("navigation.stepperCalendar.actions.next"), _ = l("navigation.stepperCalendar.actions.submit"), L = l("navigation.stepperCalendar.time.empty"), P = l("navigation.stepperCalendar.date.previousMonth"), j = l("navigation.stepperCalendar.date.nextMonth"), me = l("navigation.stepperCalendar.steps.service"), fe = q(
-      (p) => l("navigation.stepperCalendar.service.duration", { minutes: p }),
-      [l]
-    ), pe = i === 0 ? !!s.serviceId : i === 1 ? !!s.date : i === 2 ? !!s.time : !1, ue = (p) => {
-      v({ ...s, serviceId: p }), setTimeout(() => {
+      [n, d]
+    ), I = g ?? d("navigation.stepperCalendar.label"), y = d("navigation.stepperCalendar.actions.back"), R = d("navigation.stepperCalendar.actions.next"), _ = d("navigation.stepperCalendar.actions.submit"), L = d("navigation.stepperCalendar.time.empty"), P = d("navigation.stepperCalendar.date.previousMonth"), j = d("navigation.stepperCalendar.date.nextMonth"), me = d("navigation.stepperCalendar.steps.service"), fe = q(
+      (p) => d("navigation.stepperCalendar.service.duration", { minutes: p }),
+      [d]
+    ), pe = o === 0 ? !!i.serviceId : o === 1 ? !!i.date : o === 2 ? !!i.time : !1, ue = (p) => {
+      v({ ...i, serviceId: p }), setTimeout(() => {
         M((ee) => ee === 0 ? 1 : ee);
       }, 120);
     }, ge = (p) => {
-      v({ ...s, date: p, time: void 0 });
+      v({ ...i, date: p, time: void 0 });
     }, be = (p) => {
-      v({ ...s, time: p });
-    }, ve = () => M((p) => Math.max(0, p - 1)), he = () => M((p) => Math.min(se - 1, p + 1)), ye = () => u == null ? void 0 : u(s), Y = `stepper-calendar-step-${i}-heading`, xe = C(
+      v({ ...i, time: p });
+    }, ve = () => M((p) => Math.max(0, p - 1)), he = () => M((p) => Math.min(ie - 1, p + 1)), ye = () => u == null ? void 0 : u(i), Y = `stepper-calendar-step-${o}-heading`, xe = C(
       () => new Set(m),
       [m]
     );
     let z = null;
-    i === 0 ? z = /* @__PURE__ */ a(
-      ce,
+    o === 0 ? z = /* @__PURE__ */ a(
+      le,
       {
         services: t,
-        selectedId: s.serviceId,
+        selectedId: i.serviceId,
         onSelect: ue,
         durationLabel: fe,
         groupLabel: me
       }
-    ) : i === 1 ? z = /* @__PURE__ */ a(
-      de,
+    ) : o === 1 ? z = /* @__PURE__ */ a(
+      ce,
       {
         availableDates: xe,
-        selectedDate: s.date,
+        selectedDate: i.date,
         onSelectDate: ge,
         loading: D,
         locale: T,
@@ -469,21 +469,21 @@ const $e = X(
         nextLabel: j,
         emptyLabel: L
       }
-    ) : i === 2 ? z = /* @__PURE__ */ a(
+    ) : o === 2 ? z = /* @__PURE__ */ a(
       Ve,
       {
-        date: s.date,
-        slots: s.date ? b[s.date] ?? [] : [],
-        selectedTime: s.time,
+        date: i.date,
+        slots: i.date ? b[i.date] ?? [] : [],
+        selectedTime: i.time,
         loading: f,
         emptyLabel: L,
         onSelect: be
       }
-    ) : z = /* @__PURE__ */ a("div", { className: "flex flex-col gap-[var(--spacing-sm)]", children: x });
-    const we = i === se - 1, ke = Ne(
-      i,
-      i,
-      n == null ? void 0 : n[i]
+    ) : z = /* @__PURE__ */ a("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]", children: x });
+    const we = o === ie - 1, ke = Ne(
+      o,
+      o,
+      n == null ? void 0 : n[o]
     );
     return /* @__PURE__ */ w(
       "div",
@@ -491,14 +491,14 @@ const $e = X(
         ref: $,
         role: "region",
         "aria-label": I,
-        className: Re({ layout: r, density: o, className: c }),
+        className: Re({ layout: r, density: s, className: l }),
         ...h,
         children: [
           /* @__PURE__ */ a(
             De,
             {
-              activeStep: i,
-              steps: d,
+              activeStep: o,
+              steps: c,
               "aria-label": I
             }
           ),
@@ -506,8 +506,8 @@ const $e = X(
             "section",
             {
               "aria-labelledby": Y,
-              className: ze({ density: o }),
-              "data-step": i,
+              className: ze({ density: s }),
+              "data-step": o,
               "data-state": ke,
               children: [
                 /* @__PURE__ */ a(
@@ -516,8 +516,8 @@ const $e = X(
                     ref: A,
                     id: Y,
                     tabIndex: -1,
-                    className: "type-body-sm font-[var(--font-weight-semibold)] focus:outline-none",
-                    children: (Z = d[i]) == null ? void 0 : Z.label
+                    className: "type-body-sm ds:font-[var(--font-weight-semibold)] ds:focus:outline-none",
+                    children: (Z = c[o]) == null ? void 0 : Z.label
                   }
                 ),
                 z,
@@ -529,7 +529,7 @@ const $e = X(
                       intent: "ghost",
                       size: "md",
                       onClick: ve,
-                      disabled: i === 0,
+                      disabled: o === 0,
                       children: y
                     }
                   ),
@@ -566,4 +566,4 @@ $e.displayName = "StepperCalendar";
 export {
   $e as S
 };
-//# sourceMappingURL=stepper-calendar-BQMjrwzo.js.map
+//# sourceMappingURL=stepper-calendar-vtWwa2bY.js.map