@tpc-mare/mare-ui-components-react 0.1.25 → 0.1.28

package/dist/shared/{SegmentedControl-Ct5ZLXpN.js → SegmentedControl-BfE3jNM6.js}

@@ -1,14 +1,15 @@
 import { jsxs as l, jsx as a } from "react/jsx-runtime";
-import { SegmentGroupRoot as g, SegmentGroupIndicator as f, SegmentGroupItem as h, SegmentGroupItemControl as v, SegmentGroupItemText as b, SegmentGroupItemHiddenInput as x } from "@ark-ui/react/segment-group";
-const k = `
+import { SegmentGroupRoot as f, SegmentGroupIndicator as h, SegmentGroupItem as v, SegmentGroupItemControl as b, SegmentGroupItemText as x, SegmentGroupItemHiddenInput as z } from "@ark-ui/react/segment-group";
+import { o as k } from "./index-ByQ37VXf.js";
+const S = ["small", "medium"], w = `
     mare:inline-flex mare:relative mare:isolate mare:select-none mare:rounded-tpc-segmented-control-container
     mare:bg-tpc-bg-neutral-weak mare:gap-1 mare:p-1
     mare:ark-disabled:opacity-40
-`, z = `
+`, y = `
     mare:absolute mare:z-0 mare:rounded-tpc-segmented-control-segment mare:bg-tpc-bg-default
     mare:w-[var(--width)] mare:h-[var(--height)] mare:top-[var(--top)] mare:left-[var(--left)]
     mare:transition-[width,left,top] mare:duration-150 mare:ease-out
-`, w = (r) => `
+`, G = (r) => `
     mare:inline-flex mare:items-center mare:justify-center mare:overflow-hidden mare:relative mare:z-[1]
     mare:cursor-pointer mare:select-none
     ${r === "equal" ? "mare:flex-1" : "mare:grow"}
@@ -24,67 +25,68 @@ const k = `
 
     mare:tpc-typography-label-s
     mare:transition-colors mare:duration-200
-`, y = `
+`, I = `
     mare:relative mare:flex-auto mare:inline-flex mare:items-center mare:justify-center mare:gap-2
     mare:data-size-small:py-1 mare:data-size-small:px-3
     mare:data-size-medium:py-2.5 mare:data-size-medium:px-3.5
     mare:transition-colors mare:duration-200 mare:h-full
-`, S = "mare:px-0.5", G = "mare:sr-only";
-function j({
+`, N = "mare:px-0.5", j = "mare:sr-only";
+function H({
   items: r,
   value: o,
   defaultValue: n,
   onValueChange: s,
-  size: t = "small",
+  size: i = "small",
   optionWidth: d = "auto",
-  disabled: i = !1,
-  renderOption: m,
-  name: c,
-  form: u,
-  id: p
+  disabled: c = !1,
+  renderOption: t,
+  name: u,
+  form: p,
+  id: g
 }) {
+  const m = k(i, S, "small");
   return /* @__PURE__ */ l(
-    g,
+    f,
     {
       value: o,
       defaultValue: n,
       onValueChange: (e) => {
         e.value && s?.(e.value);
       },
-      disabled: i,
-      name: c,
-      form: u,
-      id: p,
-      className: k,
+      disabled: c,
+      name: u,
+      form: p,
+      id: g,
+      className: w,
       children: [
-        /* @__PURE__ */ a(f, { className: z }),
+        /* @__PURE__ */ a(h, { className: y }),
         r.map((e) => /* @__PURE__ */ l(
-          h,
+          v,
           {
             value: e.value,
             disabled: e.disabled,
-            className: w(d),
-            "data-size": t,
+            className: G(d),
+            "data-size": m,
             children: [
               /* @__PURE__ */ a(
-                v,
+                b,
                 {
-                  className: y,
-                  "data-size": t,
-                  children: m ? m(e) : /* @__PURE__ */ a(
-                    b,
+                  className: I,
+                  "data-size": m,
+                  children: t ? t(e) : /* @__PURE__ */ a(
+                    x,
                     {
-                      className: S,
-                      "data-size": t,
+                      className: N,
+                      "data-size": m,
                       children: e.label
                     }
                   )
                 }
               ),
               /* @__PURE__ */ a(
-                x,
+                z,
                 {
-                  className: G
+                  className: j
                 }
               )
             ]
@@ -96,5 +98,5 @@ function j({
   );
 }
 export {
-  j as S
+  H as S
 };

package/dist/shared/{SelectField-B-g52vHx.js → SelectField-CcnbnPEi.js}

@@ -1,40 +1,41 @@
 import { jsxs as m, jsx as e } from "react/jsx-runtime";
 import { useMemo as w } from "react";
-import { createListCollection as S, SelectRoot as y, SelectLabel as v, SelectControl as I, SelectTrigger as N, SelectContext as C, SelectValueText as T, SelectClearTrigger as z, SelectIndicator as j, SelectPositioner as _, SelectContent as D, SelectItem as L, SelectItemText as V, SelectItemIndicator as $ } from "@ark-ui/react/select";
-import { I as F } from "./IconX-CpPADKjZ.js";
-import { I as M } from "./IconChevronDown-ev2ML7Ex.js";
-import { I as P } from "./IconCheck-DzZA6b2U.js";
-const R = {
+import { createListCollection as y, SelectRoot as v, SelectLabel as I, SelectControl as N, SelectTrigger as C, SelectContext as z, SelectValueText as T, SelectClearTrigger as j, SelectIndicator as _, SelectPositioner as $, SelectContent as D, SelectItem as L, SelectItemText as V, SelectItemIndicator as F } from "@ark-ui/react/select";
+import { o as M } from "./index-ByQ37VXf.js";
+import { I as P } from "./IconX-CpPADKjZ.js";
+import { I as R } from "./IconChevronDown-ev2ML7Ex.js";
+import { I as X } from "./IconCheck-DzZA6b2U.js";
+const q = ["small", "medium"], A = {
   small: "mare:h-10",
   medium: "mare:h-12"
-}, X = {
+}, B = {
   small: "mare:tpc-typography-body-s",
   medium: "mare:tpc-typography-body-m"
-}, q = (r) => `
+}, E = (r) => `
 	mare:group mare:w-full mare:flex mare:items-center mare:justify-between mare:gap-3
-	${R[r]}
+	${A[r]}
 	mare:px-3 mare:cursor-pointer
 	mare:rounded-input mare:border mare:border-strong mare:bg-default
-	mare:text-default ${X[r]}
+	mare:text-default ${B[r]}
 	mare:ark-open:outline-solid mare:ark-open:outline-2 mare:ark-open:outline-accent mare:ark-open:-outline-offset-2
 	mare:ark-disabled:text-disabled mare:ark-disabled:border-disabled-default mare:ark-disabled:cursor-not-allowed
 	mare:data-[invalid]:outline-solid mare:data-[invalid]:outline-2 mare:data-[invalid]:outline-danger mare:data-[invalid]:-outline-offset-2
-`, l = "mare:flex-auto mare:text-left mare:truncate mare:data-[placeholder-shown]:text-weak", A = "mare:flex mare:items-center mare:shrink-0 mare:text-lg mare:transition-transform mare:ark-open:rotate-180 mare:text-default", B = "mare:flex mare:items-center mare:shrink-0 mare:text-base mare:cursor-pointer mare:text-default mare:hover:text-weak", E = "mare:flex mare:items-center mare:shrink-0 mare:text-weak mare:[&>svg]:size-5", G = `
+`, l = "mare:flex-auto mare:text-left mare:truncate mare:data-[placeholder-shown]:text-weak", G = "mare:flex mare:items-center mare:shrink-0 mare:text-lg mare:transition-transform mare:ark-open:rotate-180 mare:text-default", H = "mare:flex mare:items-center mare:shrink-0 mare:text-base mare:cursor-pointer mare:text-default mare:hover:text-weak", J = "mare:flex mare:items-center mare:shrink-0 mare:text-weak mare:[&>svg]:size-5", K = `
 	mare:flex mare:flex-col mare:gap-0.5 mare:p-1
 	mare:rounded-input mare:border mare:border-default mare:bg-raised
 	mare:shadow-[0_2px_6px_0_rgba(0,0,0,0.16)]
 	mare:max-h-72 mare:overflow-y-auto
 	mare:min-w-[var(--reference-width)]
 	mare:z-50
-`, H = `
+`, Q = `
 	mare:group/option mare:flex mare:items-center mare:justify-between mare:gap-2
 	mare:w-full mare:min-h-8 mare:py-2 mare:px-3 mare:cursor-pointer mare:rounded-menu-item
 	mare:tpc-typography-body-s mare:text-default
 	mare:ark-highlighted:bg-hover
 	mare:ark-selected:bg-accent-weak mare:ark-selected:text-accent
 	mare:ark-disabled:text-disabled mare:ark-disabled:cursor-not-allowed
-`, J = "mare:flex mare:items-center mare:text-accent", K = "mare:tpc-typography-label-s mare:text-default mare:mb-1.5 mare:block";
-function ee({
+`, U = "mare:flex mare:items-center mare:text-accent", W = "mare:tpc-typography-label-s mare:text-default mare:mb-1.5 mare:block";
+function me({
   value: r = null,
   onValueChange: d,
   options: t,
@@ -51,8 +52,8 @@ function ee({
   renderValue: n,
   renderOption: c
 }) {
-  const k = w(
-    () => S({
+  const k = M(u, q, "medium"), S = w(
+    () => y({
       items: t,
       itemToValue: (a) => a.value,
       itemToString: (a) => a.label,
@@ -61,18 +62,18 @@ function ee({
     [t]
   );
   return /* @__PURE__ */ m(
-    y,
+    v,
     {
-      collection: k,
+      collection: S,
       value: r == null ? [] : [r],
       disabled: p,
       invalid: f,
       onValueChange: (a) => d?.(a.value[0] ?? null),
       children: [
-        s && /* @__PURE__ */ e(v, { className: K, children: s }),
-        /* @__PURE__ */ e(I, { children: /* @__PURE__ */ m(N, { className: q(u), children: [
-          i && /* @__PURE__ */ e("span", { className: E, children: i }),
-          n ? /* @__PURE__ */ e(C, { children: (a) => a.selectedItems.length > 0 ? /* @__PURE__ */ e("span", { className: l, children: n(
+        s && /* @__PURE__ */ e(I, { className: W, children: s }),
+        /* @__PURE__ */ e(N, { children: /* @__PURE__ */ m(C, { className: E(k), children: [
+          i && /* @__PURE__ */ e("span", { className: J, children: i }),
+          n ? /* @__PURE__ */ e(z, { children: (a) => a.selectedItems.length > 0 ? /* @__PURE__ */ e("span", { className: l, children: n(
             a.selectedItems[0]
           ) }) : /* @__PURE__ */ e(
             "span",
@@ -90,21 +91,21 @@ function ee({
               placeholder: o
             }
           ),
-          h && /* @__PURE__ */ e(z, { className: B, children: b ?? /* @__PURE__ */ e(F, { size: "1em" }) }),
-          /* @__PURE__ */ e(j, { className: A, children: x ?? /* @__PURE__ */ e(M, { size: "1em" }) })
+          h && /* @__PURE__ */ e(j, { className: H, children: b ?? /* @__PURE__ */ e(P, { size: "1em" }) }),
+          /* @__PURE__ */ e(_, { className: G, children: x ?? /* @__PURE__ */ e(R, { size: "1em" }) })
         ] }) }),
-        /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(D, { className: G, children: t.map((a) => /* @__PURE__ */ m(
+        /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(D, { className: K, children: t.map((a) => /* @__PURE__ */ m(
           L,
           {
             item: a,
-            className: H,
+            className: Q,
             children: [
               /* @__PURE__ */ e(V, { children: c ? c(a) : a.label }),
               /* @__PURE__ */ e(
-                $,
+                F,
                 {
-                  className: J,
-                  children: g ?? /* @__PURE__ */ e(P, { size: "1em" })
+                  className: U,
+                  children: g ?? /* @__PURE__ */ e(X, { size: "1em" })
                 }
               )
             ]
@@ -116,5 +117,5 @@ function ee({
   );
 }
 export {
-  ee as S
+  me as S
 };

package/dist/shared/Skeleton-DpWtYSz4.js

@@ -0,0 +1,30 @@
+import { jsx as m } from "react/jsx-runtime";
+import { o as i } from "./index-ByQ37VXf.js";
+const s = ["rectangle", "circle"], d = (e) => `
+	mare:overflow-hidden mare:animate-pulse mare:bg-neutral-weak
+	${e === "circle" ? "mare:rounded-full" : "mare:rounded-tpc-container-s"}
+`, o = (e) => e === void 0 ? void 0 : typeof e == "number" ? `${e}px` : e;
+function f({
+  shape: e = "rectangle",
+  width: t = "100%",
+  height: n = "1rem",
+  size: r,
+  ...c
+}) {
+  const a = i(e, s, "rectangle"), l = {
+    width: o(r ?? t),
+    height: o(r ?? n)
+  };
+  return /* @__PURE__ */ m(
+    "div",
+    {
+      className: d(a),
+      "data-shape": a,
+      style: l,
+      ...c
+    }
+  );
+}
+export {
+  f as S
+};

package/dist/shared/{Slider-CXFkperZ.js → Slider-Cl9PyH2q.js}

@@ -1,15 +1,16 @@
 import { jsx as l, jsxs as g } from "react/jsx-runtime";
 import { Slider as a } from "@ark-ui/react/slider";
-const u = `
+import { o as u } from "./index-ByQ37VXf.js";
+const k = `
 	mare:flex mare:items-center mare:gap-2
 	mare:ark-horizontal:w-full mare:ark-horizontal:min-w-64
 	mare:ark-vertical:flex-col mare:ark-vertical:h-50
 	mare:ark-disabled:opacity-50 mare:ark-disabled:pointer-events-none
-`, h = `
+`, p = `
 	mare:relative mare:flex mare:flex-1 mare:items-center
 	mare:h-8 mare:w-full
 	mare:ark-vertical:flex-col mare:ark-vertical:w-8 mare:ark-vertical:h-full
-`, k = `
+`, x = `
 	mare:relative mare:flex-1 mare:overflow-hidden
 	mare:bg-neutral-weak mare:rounded-xs
 
@@ -23,7 +24,7 @@ const u = `
 	mare:ark-vertical:w-[3px] mare:ark-vertical:h-full
 	mare:ark-vertical:before:bg-[image:linear-gradient(to_bottom,transparent_calc(100%-1px),var(--color-border-default)_0%)]
 	mare:ark-vertical:before:bg-[length:100%_var(--step-tick-size)]
-`, p = `
+`, v = `
 	mare:bg-accent mare:rounded-xs
 
 	mare:ark-horizontal:h-full
@@ -31,7 +32,7 @@ const u = `
 
 	mare:ark-disabled:bg-neutral!
 	mare:ark-invalid:border mare:ark-invalid:border-danger
-`, x = `
+`, _ = `
 	mare:flex mare:items-center mare:justify-center
 	mare:h-8 mare:w-8 mare:rounded-full
 	mare:bg-raised mare:border mare:border-default
@@ -40,50 +41,55 @@ const u = `
 	mare:cursor-grab mare:touch-none
 	mare:hover:scale-110
 	mare:ark-dragging:cursor-grabbing
-`, v = `
+`, z = `
 	mare:sr-only
-`, _ = (e, t = 0, m = 100) => {
-  const r = m - t;
+`, w = (e, t = 0, o = 100) => {
+  const r = o - t;
   if (!(!e || e <= 0 || r <= 0) && !(r / e > 20))
     return `${Number((e / r * 100).toFixed(4))}%`;
-};
-function N({
+}, N = ["horizontal", "vertical"];
+function $({
   value: e = [0],
   onValueChange: t,
-  min: m = 0,
+  min: o = 0,
   max: r = 100,
-  step: o = 1,
+  step: m = 1,
   orientation: c = "horizontal",
   disabled: s = !1,
   invalid: d = !1,
   id: b,
   name: f
 }) {
+  const h = u(
+    c,
+    N,
+    "horizontal"
+  );
   return /* @__PURE__ */ l(
     a.Root,
     {
       value: e,
       onValueChange: (i) => t?.(i.value),
-      min: m,
+      min: o,
       max: r,
-      step: o,
-      orientation: c,
+      step: m,
+      orientation: h,
       disabled: s,
       invalid: d,
       id: b,
       name: f,
-      className: u,
+      className: k,
       style: {
-        "--step-tick-size": _(o, m, r)
+        "--step-tick-size": w(m, o, r)
       },
-      children: /* @__PURE__ */ g(a.Control, { className: h, children: [
-        /* @__PURE__ */ l(a.Track, { className: k, children: /* @__PURE__ */ l(a.Range, { className: p }) }),
+      children: /* @__PURE__ */ g(a.Control, { className: p, children: [
+        /* @__PURE__ */ l(a.Track, { className: x, children: /* @__PURE__ */ l(a.Range, { className: v }) }),
         e.map((i, n) => /* @__PURE__ */ l(
           a.Thumb,
           {
             index: n,
-            className: x,
-            children: /* @__PURE__ */ l(a.HiddenInput, { className: v })
+            className: _,
+            children: /* @__PURE__ */ l(a.HiddenInput, { className: z })
           },
           n
         ))
@@ -92,5 +98,5 @@ function N({
   );
 }
 export {
-  N as S
+  $ as S
 };

package/dist/shared/Snackbar-3BxmqK8x.js

@@ -0,0 +1,105 @@
+import { jsx as o, jsxs as y } from "react/jsx-runtime";
+import { Portal as u } from "@ark-ui/react/portal";
+import { Toaster as b, Toast as m, createToaster as h } from "@ark-ui/react/toast";
+import { o as i } from "./index-ByQ37VXf.js";
+import { B as k } from "./Button-C2ULmKj3.js";
+const f = `
+	mare:group mare:w-full mare:min-w-[20rem] mare:max-w-[429px]
+	mare:relative mare:overflow-hidden mare:rounded-tpc-snackbar
+	mare:flex mare:items-center mare:gap-3 mare:p-3 mare:pr-4 mare:min-h-13
+	mare:shadow-[0px_10px_15px_-3px_rgba(0,0,0,0.10),0px_4px_6px_-2px_rgba(0,0,0,0.05)]
+	mare:outline-none
+	mare:[translate:var(--x)_var(--y)] mare:[scale:var(--scale)]
+	mare:[z-index:var(--z-index)] mare:[height:var(--height)]
+	mare:[opacity:var(--opacity)] mare:[will-change:translate,opacity,scale]
+	mare:[transition:translate_400ms,scale_400ms,opacity_400ms,height_400ms]
+	mare:ark-closed:[transition:translate_400ms,scale_400ms,opacity_200ms]
+	mare:ark-type-contrast:bg-inverse mare:ark-type-contrast:text-on-inverse
+	mare:ark-type-secondary:bg-raised mare:ark-type-secondary:text-default mare:ark-type-secondary:border mare:ark-type-secondary:border-default
+	mare:ark-type-error:bg-danger mare:ark-type-error:text-on-danger
+`, x = `
+	mare:flex mare:max-w-13 mare:min-w-6 mare:aspect-square mare:shrink-0
+	mare:items-center mare:justify-center mare:rounded-tpc-container-s
+`, _ = (a) => `
+	mare:tpc-typography-body-s ${a ? "" : "mare:ps-1"}
+`, v = "mare:ml-auto mare:shrink-0", w = `
+	mare:absolute mare:bottom-0 mare:left-0 mare:h-1 mare:w-0
+	mare:[background-color:currentColor]
+	mare:[animation:mare-snackbar-progress_var(--mare-snackbar-life)_linear_forwards]
+`, B = {
+  "top-left": "top-start",
+  "top-center": "top",
+  "top-right": "top-end",
+  "bottom-left": "bottom-start",
+  "bottom-center": "bottom",
+  "bottom-right": "bottom-end"
+}, T = (a) => B[a], c = 3e3, l = (a) => Math.max(a ?? c, c), d = ["contrast", "secondary", "error"], p = /* @__PURE__ */ new WeakMap(), S = {
+  error: [1, 2],
+  secondary: [3, 6],
+  contrast: [6, 8]
+}, N = (a, t) => {
+  const [s, r] = S[a];
+  return t ? s : r;
+};
+function A(a = {}) {
+  const t = h({
+    placement: T(a.placement ?? "bottom-center")
+  }), s = {
+    show(r) {
+      const e = i(
+        r.severity ?? "contrast",
+        d,
+        "contrast"
+      );
+      return t.create({
+        description: r.detail,
+        type: e,
+        priority: N(e, !!r.action),
+        duration: l(r.life),
+        action: r.action,
+        meta: { leading: r.leading, progressBar: r.progressBar }
+      });
+    },
+    dismiss(r) {
+      t.dismiss(r);
+    },
+    update(r, e) {
+      const n = t.getVisibleToasts().find((g) => g.id === r);
+      t.update(r, {
+        description: e.detail ?? n?.description,
+        type: e.severity ? i(e.severity, d, "contrast") : n?.type,
+        duration: e.life != null ? l(e.life) : n?.duration,
+        action: e.action ?? n?.action,
+        meta: {
+          leading: e.leading ?? n?.meta?.leading,
+          progressBar: e.progressBar ?? n?.meta?.progressBar
+        }
+      });
+    }
+  };
+  return p.set(s, t), s;
+}
+function C({ controller: a, portalContainer: t }) {
+  const s = p.get(a);
+  if (!s)
+    throw new Error("Snackbar: controller was not created by createSnackbar().");
+  return /* @__PURE__ */ o(u, { container: t, children: /* @__PURE__ */ o(b, { toaster: s, children: (r) => {
+    const e = r.meta?.leading, n = !!r.meta?.progressBar;
+    return /* @__PURE__ */ y(m.Root, { className: f, children: [
+      e ? /* @__PURE__ */ o("div", { className: x, children: e }) : null,
+      /* @__PURE__ */ o(m.Description, { className: _(!!e), children: r.description }),
+      r.action ? /* @__PURE__ */ o("div", { className: v, children: /* @__PURE__ */ o(m.ActionTrigger, { asChild: !0, children: /* @__PURE__ */ o(k, { severity: "ghost", link: !0, size: "xsmall", children: r.action.label }) }) }) : null,
+      n ? /* @__PURE__ */ o(
+        "div",
+        {
+          className: w,
+          style: { "--mare-snackbar-life": `${r.duration}ms` }
+        }
+      ) : null
+    ] }, r.id);
+  } }) });
+}
+export {
+  C as S,
+  A as c
+};

package/dist/shared/{Stepper-By8M5bs0.js → Stepper-DrKKSn_j.js}

@@ -1,103 +1,108 @@
-import { jsxs as m, jsx as e, Fragment as g } from "react/jsx-runtime";
+import { jsxs as m, jsx as e, Fragment as b } from "react/jsx-runtime";
 import { Steps as a } from "@ark-ui/react/steps";
-import { I as k } from "./IconCheck-DzZA6b2U.js";
-import { I as b, a as v } from "./IconChevronRight-DEIDRsvg.js";
-const y = "mare:flex mare:ark-horizontal:flex-col mare:ark-vertical:flex-row mare:gap-4 mare:w-full", N = `
+import { o as k } from "./index-ByQ37VXf.js";
+import { I as v } from "./IconCheck-DzZA6b2U.js";
+import { I as y, a as N } from "./IconChevronRight-DEIDRsvg.js";
+const w = ["horizontal", "vertical"], z = "mare:flex mare:ark-horizontal:flex-col mare:ark-vertical:flex-row mare:gap-4 mare:w-full", j = `
 	mare:hidden mare:sm:flex mare:gap-2 mare:overflow-x-auto
 	mare:ark-horizontal:flex-row mare:ark-horizontal:items-center mare:ark-horizontal:justify-between
 	mare:ark-vertical:flex-col mare:ark-vertical:items-start
-`, w = "mare:relative mare:flex mare:items-center mare:ark-vertical:items-start mare:gap-3 mare:flex-1 mare:last:flex-none", z = `
+`, C = "mare:relative mare:flex mare:items-center mare:ark-vertical:items-start mare:gap-3 mare:flex-1 mare:last:flex-none", I = `
 	mare:group mare:flex mare:items-center mare:gap-3 mare:bg-transparent mare:border-none
 	mare:text-left mare:cursor-pointer mare:rounded-md mare:outline-none
 	mare:disabled:cursor-not-allowed mare:disabled:opacity-50
-`, j = (t) => `
+`, S = (t) => `
 	mare:group mare:flex mare:items-center mare:justify-center mare:shrink-0 mare:relative
 	mare:size-8 mare:rounded-full mare:tpc-typography-label-s
 	mare:ark-incomplete:bg-neutral-weak mare:ark-incomplete:text-weak
 	mare:ark-current:bg-accent mare:ark-current:text-on-accent
 	${t === "strong" ? "mare:ark-complete:bg-accent mare:ark-complete:text-on-accent" : "mare:ark-complete:bg-accent-weak mare:ark-complete:text-accent"}
-`, C = "mare:flex mare:items-center mare:justify-center mare:[&>svg]:size-4", I = "mare:flex mare:items-center mare:justify-center mare:group-[[data-complete]]:hidden", S = "mare:hidden mare:group-[[data-complete]]:flex mare:items-center mare:justify-center mare:absolute mare:inset-0 mare:[&>svg]:size-4", T = `
+`, T = "mare:flex mare:items-center mare:justify-center mare:[&>svg]:size-4", L = "mare:flex mare:items-center mare:justify-center mare:group-[[data-complete]]:hidden", R = "mare:hidden mare:group-[[data-complete]]:flex mare:items-center mare:justify-center mare:absolute mare:inset-0 mare:[&>svg]:size-4", $ = `
 	mare:flex-1 mare:h-[1.5px] mare:bg-neutral-weak mare:transition-colors mare:duration-300
 	mare:ark-complete:bg-accent
 	mare:ark-vertical:absolute mare:ark-vertical:flex-none mare:ark-vertical:w-[1.5px] mare:ark-vertical:h-auto
 	mare:ark-vertical:top-8 mare:ark-vertical:bottom-[-0.5rem] mare:ark-vertical:start-[calc(1rem-0.75px)]
-`, L = "mare:flex mare:flex-col mare:items-start mare:gap-0.5", R = "mare:tpc-typography-label-s mare:text-default mare:group-[[data-incomplete]]:text-weak", B = "mare:block mare:tpc-typography-body-xs mare:text-weak", F = `
+`, B = "mare:flex mare:flex-col mare:items-start mare:gap-0.5", F = "mare:tpc-typography-label-s mare:text-default mare:group-[[data-incomplete]]:text-weak", M = "mare:block mare:tpc-typography-body-xs mare:text-weak", O = `
 	mare:p-4 mare:min-h-24 mare:rounded-input mare:border mare:border-default
 	mare:bg-default mare:text-default mare:tpc-typography-body-s
-`, M = `
+`, P = `
 	mare:flex mare:sm:hidden mare:items-center mare:justify-between mare:gap-3
 	mare:px-3 mare:py-2 mare:rounded-input mare:border mare:border-default mare:bg-default
-`, P = "mare:flex-1 mare:text-center mare:truncate mare:tpc-typography-body-s mare:text-default", c = `
+`, q = "mare:flex-1 mare:text-center mare:truncate mare:tpc-typography-body-s mare:text-default", o = `
 	mare:flex mare:items-center mare:justify-center mare:size-8 mare:rounded-full mare:text-default
 	mare:hover:bg-hover mare:disabled:opacity-40 mare:disabled:cursor-not-allowed mare:disabled:pointer-events-none
 `;
-function $({ items: t }) {
-  return /* @__PURE__ */ m("div", { className: M, children: [
-    /* @__PURE__ */ e(a.PrevTrigger, { className: c, children: /* @__PURE__ */ e(b, { size: "1em" }) }),
-    /* @__PURE__ */ e(a.Context, { children: (n) => /* @__PURE__ */ m("span", { className: P, children: [
+function A({ items: t }) {
+  return /* @__PURE__ */ m("div", { className: P, children: [
+    /* @__PURE__ */ e(a.PrevTrigger, { className: o, children: /* @__PURE__ */ e(y, { size: "1em" }) }),
+    /* @__PURE__ */ e(a.Context, { children: (n) => /* @__PURE__ */ m("span", { className: q, children: [
       t[n.value]?.title,
       " · ",
       n.value + 1,
       "/",
       n.count
     ] }) }),
-    /* @__PURE__ */ e(a.NextTrigger, { className: c, children: /* @__PURE__ */ e(v, { size: "1em" }) })
+    /* @__PURE__ */ e(a.NextTrigger, { className: o, children: /* @__PURE__ */ e(N, { size: "1em" }) })
   ] });
 }
-function G({
+function K({
   items: t,
   step: n,
-  defaultStep: o,
+  defaultStep: c,
   onStepChange: s,
   onStepComplete: i,
-  linear: d = !1,
-  orientation: p = "horizontal",
+  linear: p = !1,
+  orientation: d = "horizontal",
   indicatorVariant: u = "default",
   isStepValid: f,
   isStepSkippable: h
 }) {
-  const x = j(u);
+  const x = S(u), g = k(
+    d,
+    w,
+    "horizontal"
+  );
   return /* @__PURE__ */ m(
     a.Root,
     {
-      className: y,
+      className: z,
       count: t.length,
       step: n,
-      defaultStep: o,
-      linear: d,
-      orientation: p,
+      defaultStep: c,
+      linear: p,
+      orientation: g,
       isStepValid: f,
       isStepSkippable: h,
       onStepChange: (r) => s?.(r.step),
       onStepComplete: i,
       children: [
-        /* @__PURE__ */ e(a.List, { className: N, children: t.map((r, l) => /* @__PURE__ */ m(
+        /* @__PURE__ */ e(a.List, { className: j, children: t.map((r, l) => /* @__PURE__ */ m(
           a.Item,
           {
             index: l,
-            className: w,
+            className: C,
             children: [
-              /* @__PURE__ */ m(a.Trigger, { className: z, children: [
-                /* @__PURE__ */ e(a.Indicator, { className: x, children: r.icon ? /* @__PURE__ */ e("span", { className: C, children: r.icon }) : /* @__PURE__ */ m(g, { children: [
-                  /* @__PURE__ */ e("span", { className: S, children: /* @__PURE__ */ e(k, {}) }),
-                  /* @__PURE__ */ e("span", { className: I, children: l + 1 })
+              /* @__PURE__ */ m(a.Trigger, { className: I, children: [
+                /* @__PURE__ */ e(a.Indicator, { className: x, children: r.icon ? /* @__PURE__ */ e("span", { className: T, children: r.icon }) : /* @__PURE__ */ m(b, { children: [
+                  /* @__PURE__ */ e("span", { className: R, children: /* @__PURE__ */ e(v, {}) }),
+                  /* @__PURE__ */ e("span", { className: L, children: l + 1 })
                 ] }) }),
-                /* @__PURE__ */ m("span", { className: L, children: [
-                  /* @__PURE__ */ e("span", { className: R, children: r.title }),
-                  r.description && /* @__PURE__ */ e("span", { className: B, children: r.description })
+                /* @__PURE__ */ m("span", { className: B, children: [
+                  /* @__PURE__ */ e("span", { className: F, children: r.title }),
+                  r.description && /* @__PURE__ */ e("span", { className: M, children: r.description })
                 ] })
               ] }),
-              /* @__PURE__ */ e(a.Separator, { className: T })
+              /* @__PURE__ */ e(a.Separator, { className: $ })
             ]
           },
           l
         )) }),
-        /* @__PURE__ */ e($, { items: t }),
+        /* @__PURE__ */ e(A, { items: t }),
         t.map((r, l) => /* @__PURE__ */ e(
           a.Content,
           {
             index: l,
-            className: F,
+            className: O,
             children: r.content
           },
           l
@@ -107,5 +112,5 @@ function G({
   );
 }
 export {
-  G as S
+  K as S
 };