@definable/ui 0.1.32 → 0.1.35

package/dist/components/table.js

@@ -1,51 +1,51 @@
-import { jsx as r, jsxs as n } from "react/jsx-runtime";
-import { cn as d } from "../lib/utils.js";
+import { jsx as i, jsxs as n } from "react/jsx-runtime";
+import { cn as t } from "../lib/utils.js";
 import { Checkbox as N } from "./checkbox.js";
 import { Tooltip as w } from "./tooltip.js";
 import { useState as z } from "react";
 import { TableEmpty as V } from "./table-empty.js";
-const u = ({ children: t, className: l }) => /* @__PURE__ */ r("div", { className: d("border border-light rounded-lg overflow-hidden bg-secondary shadow-sm", l), children: t });
+const g = ({ children: d, className: l }) => /* @__PURE__ */ i("div", { className: t("border border-light rounded-lg overflow-hidden bg-secondary shadow-sm", l), children: d });
 function q({
-  data: t,
+  data: d,
   columns: l,
-  showCheckbox: s = !0,
-  onRowClick: c,
-  className: v,
-  selectedItems: a,
-  onSelect: o,
+  showCheckbox: o = !0,
+  onRowClick: p,
+  className: c,
+  selectedItems: e,
+  onSelect: s,
   emptyState: x,
   isLoading: b = !1,
   loadingRows: T = 5,
   tableHeightOffset: f
 }) {
-  const [j, g] = z(null), m = { height: f ? `calc(100vh - ${f})` : "calc(100vh - 8rem)" }, p = [
-    s ? "40px" : null,
-    ...l.map((i) => i.width || "1fr")
-  ].filter(Boolean).join(" "), $ = () => /* @__PURE__ */ r(
+  const [j, y] = z(null), m = { height: f ? `calc(100vh - ${f})` : "calc(100vh - 8rem)" }, v = [
+    o ? "40px" : null,
+    ...l.map((r) => r.width || "1fr")
+  ].filter(Boolean).join(" "), $ = () => /* @__PURE__ */ i(
     "div",
     {
-      className: d("divide-y divide-border/50 overflow-y-auto"),
+      className: t("divide-y divide-light/50 overflow-y-auto"),
       style: m,
-      children: Array(T).fill(0).map((i, h) => /* @__PURE__ */ n(
+      children: Array(T).fill(0).map((r, h) => /* @__PURE__ */ n(
         "div",
         {
           className: "grid items-center px-6 py-4 text-sm",
-          style: { gridTemplateColumns: p },
+          style: { gridTemplateColumns: v },
           children: [
-            s && /* @__PURE__ */ r("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r("div", { className: "h-4 w-4 rounded bg-muted animate-pulse" }) }),
-            l.map((e) => /* @__PURE__ */ r(
+            o && /* @__PURE__ */ i("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "h-4 w-4 rounded bg-hover animate-pulse" }) }),
+            l.map((a) => /* @__PURE__ */ i(
               "div",
               {
-                className: d("px-2 relative min-w-0", e.className),
-                children: /* @__PURE__ */ r(
+                className: t("px-2 relative min-w-0", a.className),
+                children: /* @__PURE__ */ i(
                   "div",
                   {
-                    className: "h-4 bg-muted rounded animate-pulse",
+                    className: "h-4 bg-hover rounded animate-pulse",
                     style: { width: Math.random() * 40 + 40 + "%" }
                   }
                 )
               },
-              `skeleton-col-${e.id}`
+              `skeleton-col-${a.id}`
             ))
           ]
         },
@@ -53,91 +53,91 @@ function q({
       ))
     }
   );
-  return b ? /* @__PURE__ */ r(u, { className: v, children: /* @__PURE__ */ n("div", { className: "relative bg-card", children: [
+  return b ? /* @__PURE__ */ i(g, { className: c, children: /* @__PURE__ */ n("div", { className: "relative bg-card", children: [
     /* @__PURE__ */ n(
       "div",
       {
-        className: d(
-          "grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-light sticky top-0 z-10"
+        className: t(
+          "grid items-center px-6 py-3 text-xs font-medium text-tertiary/80 bg-hover/30 border-b border-light sticky top-0 z-10"
         ),
-        style: { gridTemplateColumns: p },
+        style: { gridTemplateColumns: v },
         children: [
-          s && /* @__PURE__ */ r("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r("div", { className: "h-4 w-4 rounded bg-muted animate-pulse" }) }),
-          l.map((i) => /* @__PURE__ */ r("div", { className: d("px-2 font-medium", i.className), children: i.header }, i.id))
+          o && /* @__PURE__ */ i("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "h-4 w-4 rounded bg-hover animate-pulse" }) }),
+          l.map((r) => /* @__PURE__ */ i("div", { className: t("px-2 font-medium", r.className), children: r.header }, r.id))
         ]
       }
     ),
-    /* @__PURE__ */ r($, {})
-  ] }) }) : t.length === 0 ? /* @__PURE__ */ r(u, { className: v, children: /* @__PURE__ */ r("div", { className: "relative bg-card", children: /* @__PURE__ */ r(V, { ...x }) }) }) : /* @__PURE__ */ r(u, { className: v, children: /* @__PURE__ */ n("div", { className: "relative bg-card", children: [
+    /* @__PURE__ */ i($, {})
+  ] }) }) : d.length === 0 ? /* @__PURE__ */ i(g, { className: c, children: /* @__PURE__ */ i("div", { className: "relative bg-card", children: /* @__PURE__ */ i(V, { ...x }) }) }) : /* @__PURE__ */ i(g, { className: c, children: /* @__PURE__ */ n("div", { className: "relative bg-card", children: [
     /* @__PURE__ */ n(
       "div",
       {
-        className: d(
-          "grid items-center px-6 py-3 text-xs font-medium text-muted-foreground/80 bg-muted/30 border-b border-light sticky top-0 z-10"
+        className: t(
+          "grid items-center px-6 py-3 text-xs font-medium text-tertiary/80 bg-hover/30 border-b border-light sticky top-0 z-10"
         ),
-        style: { gridTemplateColumns: p },
+        style: { gridTemplateColumns: v },
         children: [
-          s && /* @__PURE__ */ r("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r(
+          o && /* @__PURE__ */ i("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ i(
             N,
             {
-              checked: t.length > 0 && (a == null ? void 0 : a.size) === t.length,
-              onClick: (i) => {
-                i.stopPropagation();
-                const e = !((a == null ? void 0 : a.size) === t.length);
-                t.forEach((y) => {
-                  (a == null ? void 0 : a.has(y.id)) !== e && (o == null || o(y.id, e));
+              checked: d.length > 0 && (e == null ? void 0 : e.size) === d.length,
+              onClick: (r) => {
+                r.stopPropagation();
+                const a = !((e == null ? void 0 : e.size) === d.length);
+                d.forEach((u) => {
+                  (e == null ? void 0 : e.has(u.id)) !== a && (s == null || s(u.id, a));
                 });
               }
             }
           ) }),
-          l.map((i) => /* @__PURE__ */ r("div", { className: d("px-2 font-medium", i.className), children: i.header }, i.id))
+          l.map((r) => /* @__PURE__ */ i("div", { className: t("px-2 font-medium", r.className), children: r.header }, r.id))
         ]
       }
     ),
-    /* @__PURE__ */ r(
+    /* @__PURE__ */ i(
       "div",
       {
-        className: d("divide-y divide-border/30 overflow-y-auto"),
+        className: t("divide-y divide-light/30 overflow-y-auto"),
         style: m,
-        children: t.map((i, h) => /* @__PURE__ */ n(
+        children: d.map((r, h) => /* @__PURE__ */ n(
           "div",
           {
-            className: d(
-              "grid items-center px-6 py-4 text-sm text-foreground hover:bg-muted/30 transition-colors duration-150 group cursor-pointer"
+            className: t(
+              "grid items-center px-6 py-4 text-sm text-primary hover:bg-hover/30 transition-colors duration-150 group cursor-pointer"
             ),
-            style: { gridTemplateColumns: p },
-            onClick: () => c == null ? void 0 : c(i),
+            style: { gridTemplateColumns: v },
+            onClick: () => p == null ? void 0 : p(r),
             children: [
-              s && /* @__PURE__ */ r("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ r(
+              o && /* @__PURE__ */ i("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ i(
                 N,
                 {
-                  checked: a == null ? void 0 : a.has(i.id),
-                  onClick: (e) => {
-                    e.stopPropagation(), o == null || o(i.id, !(a != null && a.has(i.id)));
+                  checked: e == null ? void 0 : e.has(r.id),
+                  onClick: (a) => {
+                    a.stopPropagation(), s == null || s(r.id, !(e != null && e.has(r.id)));
                   }
                 }
               ) }),
-              l.map((e) => /* @__PURE__ */ n(
+              l.map((a) => /* @__PURE__ */ n(
                 "div",
                 {
-                  className: d(
+                  className: t(
                     "px-2 relative min-w-0",
-                    e.className
+                    a.className
                   ),
-                  onMouseEnter: () => e.tooltipValue && g(`${h}-${e.id}`),
-                  onMouseLeave: () => g(null),
+                  onMouseEnter: () => a.tooltipValue && y(`${h}-${a.id}`),
+                  onMouseLeave: () => y(null),
                   children: [
-                    /* @__PURE__ */ r("div", { className: d(
+                    /* @__PURE__ */ i("div", { className: t(
                       "flex items-center gap-2",
-                      e.truncate && "overflow-hidden"
-                    ), children: /* @__PURE__ */ r("div", { className: d(
+                      a.truncate && "overflow-hidden"
+                    ), children: /* @__PURE__ */ i("div", { className: t(
                       "w-full",
-                      e.truncate && "truncate"
-                    ), children: e.cell(i) }) }),
-                    e.tooltipValue && j === `${h}-${e.id}` && /* @__PURE__ */ r(
+                      a.truncate && "truncate"
+                    ), children: a.cell(r) }) }),
+                    a.tooltipValue && j === `${h}-${a.id}` && /* @__PURE__ */ i(
                       w,
                       {
-                        content: e.tooltipValue(i),
+                        content: a.tooltipValue(r),
                         side: "bottom",
                         align: "start",
                         isVisible: !0
@@ -145,11 +145,11 @@ function q({
                     )
                   ]
                 },
-                e.id
+                a.id
               ))
             ]
           },
-          i.id
+          r.id
         ))
       }
     )

package/dist/components/tabs.js

@@ -1,46 +1,46 @@
-import { jsx as o } from "react/jsx-runtime";
-import * as a from "react";
+import { jsx as a } from "react/jsx-runtime";
+import * as r from "react";
 import * as e from "@radix-ui/react-tabs";
-import { cn as n } from "../lib/utils.js";
-const m = e.Root, r = a.forwardRef(({ className: i, ...t }, s) => /* @__PURE__ */ o(
+import { cn as o } from "../lib/utils.js";
+const m = e.Root, n = r.forwardRef(({ className: i, ...t }, s) => /* @__PURE__ */ a(
   e.List,
   {
     ref: s,
-    className: n(
-      "inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
+    className: o(
+      "inline-flex h-9 items-center justify-center rounded-lg bg-hover p-1 text-tertiary",
       i
     ),
     ...t
   }
 ));
-r.displayName = e.List.displayName;
-const f = a.forwardRef(({ className: i, ...t }, s) => /* @__PURE__ */ o(
+n.displayName = e.List.displayName;
+const f = r.forwardRef(({ className: i, ...t }, s) => /* @__PURE__ */ a(
   e.Trigger,
   {
     ref: s,
-    className: n(
-      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-secondary data-[state=active]:text-foreground data-[state=active]:shadow",
+    className: o(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-white dark:ring-offset-[#1F1F20] transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-black/20 dark:focus-visible:ring-white/20 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-secondary data-[state=active]:text-primary data-[state=active]:shadow",
       i
     ),
     ...t
   }
 ));
 f.displayName = e.Trigger.displayName;
-const d = a.forwardRef(({ className: i, ...t }, s) => /* @__PURE__ */ o(
+const l = r.forwardRef(({ className: i, ...t }, s) => /* @__PURE__ */ a(
   e.Content,
   {
     ref: s,
-    className: n(
-      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    className: o(
+      "mt-2 ring-offset-white dark:ring-offset-[#1F1F20] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-black/20 dark:focus-visible:ring-white/20 focus-visible:ring-offset-2",
       i
     ),
     ...t
   }
 ));
-d.displayName = e.Content.displayName;
+l.displayName = e.Content.displayName;
 export {
   m as Tabs,
-  d as TabsContent,
-  r as TabsList,
+  l as TabsContent,
+  n as TabsList,
   f as TabsTrigger
 };

package/dist/components/textarea.js

@@ -1,15 +1,15 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
 import * as t from "react";
 import { cn as s } from "../lib/utils.js";
 const a = t.forwardRef(
-  ({ className: e, ...r }, o) => /* @__PURE__ */ i(
+  ({ className: e, ...r }, i) => /* @__PURE__ */ o(
     "textarea",
     {
       className: s(
-        "flex min-h-[80px] w-full rounded-md border border-input bg-secondary px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        "flex min-h-[80px] w-full rounded-md border border-light bg-secondary px-3 py-2 text-sm ring-offset-white dark:ring-offset-[#1F1F20] placeholder:text-tertiary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-black/20 dark:focus-visible:ring-white/20 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
         e
       ),
-      ref: o,
+      ref: i,
       ...r
     }
   )

package/dist/components/use-toast.js

@@ -1,5 +1,5 @@
-import { jsx as o, jsxs as c } from "react/jsx-runtime";
-import { useState as l, useCallback as u } from "react";
+import { jsx as o, jsxs as l } from "react/jsx-runtime";
+import { useState as c, useCallback as u } from "react";
 let s = [], a = [];
 const d = () => {
   a.forEach((t) => t([...s]));
@@ -18,7 +18,7 @@ const d = () => {
     }
   };
 }, g = () => {
-  const [t, i] = l(s), e = u(() => {
+  const [t, i] = c(s), e = u(() => {
     const r = (n) => {
       i(n);
     };
@@ -26,21 +26,21 @@ const d = () => {
       a = a.filter((n) => n !== r);
     };
   }, []);
-  return l(() => e()), {
+  return c(() => e()), {
     toast: m,
     toasts: t,
     dismiss: (r) => {
       s = s.filter((n) => n.id !== r), d();
     }
   };
-}, b = () => {
+}, h = () => {
   const { toasts: t, dismiss: i } = g();
-  return t.length === 0 ? null : /* @__PURE__ */ o("div", { className: "fixed top-4 right-4 z-50 flex flex-col gap-2 w-[350px]", children: t.map((e) => /* @__PURE__ */ c(
+  return t.length === 0 ? null : /* @__PURE__ */ o("div", { className: "fixed top-4 right-4 z-50 flex flex-col gap-2 w-[350px]", children: t.map((e) => /* @__PURE__ */ l(
     "div",
     {
-      className: `p-4 rounded-lg shadow-lg border border-light transition-all duration-300 ease-in-out ${e.type === "error" ? "bg-destructive text-destructive-foreground" : e.type === "success" ? "bg-green-50 text-green-800 border-green-200" : e.type === "warning" ? "bg-amber-50 text-amber-800 border-amber-200" : "bg-secondary text-foreground"}`,
+      className: `p-4 rounded-lg shadow-lg border border-light transition-all duration-300 ease-in-out ${e.type === "error" ? "bg-red-500 text-white" : e.type === "success" ? "bg-green-50 text-green-800 border-green-200" : e.type === "warning" ? "bg-amber-50 text-amber-800 border-amber-200" : "bg-secondary text-primary"}`,
       children: [
-        /* @__PURE__ */ c("div", { className: "flex justify-between items-start", children: [
+        /* @__PURE__ */ l("div", { className: "flex justify-between items-start", children: [
           /* @__PURE__ */ o("div", { className: "font-medium", children: e.title }),
           /* @__PURE__ */ o(
             "button",
@@ -58,7 +58,7 @@ const d = () => {
   )) });
 };
 export {
-  b as ToastContainer,
+  h as ToastContainer,
   m as toast,
   g as useToast
 };

package/dist/index.js

@@ -35,7 +35,7 @@ import { Separator as V1 } from "./components/separator.js";
 import { Sheet as X1 } from "./components/sheet.js";
 import { Skeleton as q1 } from "./components/skeleton.js";
 import { Slider as K1 } from "./components/slider.js";
-import { a as W1, S as Y1, b as Z1 } from "./stepper-modal-JXpOXOV2.js";
+import { a as W1, S as Y1, b as Z1 } from "./stepper-modal-Bh6gsg8o.js";
 import { Switch as e2 } from "./components/switch.js";
 import { Table as r2 } from "./components/table.js";
 import { TableEmpty as t2 } from "./components/table-empty.js";

package/dist/{stepper-modal-JXpOXOV2.js → stepper-modal-Bh6gsg8o.js}

@@ -1,38 +1,38 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { cn as l } from "./lib/utils.js";
-import { motion as a, AnimatePresence as L } from "framer-motion";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { cn as s } from "./lib/utils.js";
+import { motion as r, AnimatePresence as L } from "framer-motion";
 import { Modal as O } from "./components/modal.js";
 import { Button as m } from "./components/button.js";
-function H({ steps: n, className: o }) {
-  return /* @__PURE__ */ e("div", { className: l("py-6 space-y-5", o), children: n.map((i, r) => /* @__PURE__ */ t(
-    a.div,
+function H({ steps: o, className: l }) {
+  return /* @__PURE__ */ e("div", { className: s("py-6 space-y-5", l), children: o.map((i, t) => /* @__PURE__ */ a(
+    r.div,
     {
       className: "relative",
       initial: { opacity: 0, y: 10 },
       animate: { opacity: 1, y: 0 },
-      transition: { delay: r * 0.1, duration: 0.3 },
+      transition: { delay: t * 0.1, duration: 0.3 },
       children: [
-        r !== 0 && /* @__PURE__ */ e(
-          a.div,
+        t !== 0 && /* @__PURE__ */ e(
+          r.div,
           {
-            className: l(
+            className: s(
               "absolute left-[15px] -top-[26px] w-[2px] h-[24px] origin-top",
-              i.isCompleted || i.isCurrent ? "bg-primary/60" : "bg-border"
+              i.isCompleted || i.isCurrent ? "bg-primary/60" : "bg-light"
             ),
             initial: { scaleY: 0 },
             animate: { scaleY: 1 },
-            transition: { delay: r * 0.1 + 0.2, duration: 0.2 }
+            transition: { delay: t * 0.1 + 0.2, duration: 0.2 }
           }
         ),
-        /* @__PURE__ */ t("div", { className: "flex gap-4 items-start", children: [
+        /* @__PURE__ */ a("div", { className: "flex gap-4 items-start", children: [
           /* @__PURE__ */ e(
-            a.div,
+            r.div,
             {
-              className: l(
+              className: s(
                 "w-[30px] h-[30px] rounded-full flex items-center justify-center text-xs font-medium shrink-0 transition-all",
-                i.isCompleted && "bg-primary text-primary-foreground shadow-sm shadow-primary/20",
+                i.isCompleted && "bg-primary text-white shadow-sm shadow-primary/20",
                 i.isCurrent && "border-2 border-primary bg-primary/10 text-primary",
-                !i.isCompleted && !i.isCurrent && "border-2 border-muted-foreground/30 text-muted-foreground"
+                !i.isCompleted && !i.isCurrent && "border-2 border-tertiary/30 text-tertiary"
               ),
               whileHover: { scale: 1.05 },
               whileTap: { scale: 0.98 },
@@ -46,19 +46,19 @@ function H({ steps: n, className: o }) {
                   strokeLinecap: "round",
                   strokeLinejoin: "round"
                 }
-              ) }) : r + 1
+              ) }) : t + 1
             }
           ),
-          /* @__PURE__ */ t("div", { className: "space-y-0.5 pt-0.5", children: [
-            /* @__PURE__ */ e("h3", { className: l(
+          /* @__PURE__ */ a("div", { className: "space-y-0.5 pt-0.5", children: [
+            /* @__PURE__ */ e("h3", { className: s(
               "text-sm font-medium transition-colors",
               i.isCurrent && "text-primary",
-              i.isCompleted && "text-foreground",
-              !i.isCurrent && !i.isCompleted && "text-muted-foreground"
+              i.isCompleted && "text-primary",
+              !i.isCurrent && !i.isCompleted && "text-tertiary"
             ), children: i.title }),
-            i.description && /* @__PURE__ */ e("p", { className: l(
-              "text-xs text-muted-foreground leading-relaxed",
-              i.isCurrent && "text-muted-foreground/90"
+            i.description && /* @__PURE__ */ e("p", { className: s(
+              "text-xs text-tertiary leading-relaxed",
+              i.isCurrent && "text-tertiary/90"
             ), children: i.description })
           ] })
         ] })
@@ -68,114 +68,114 @@ function H({ steps: n, className: o }) {
   )) });
 }
 function z({
-  children: n,
-  title: o,
+  children: o,
+  title: l,
   sidebar: i,
-  subclassName: r
+  subclassName: t
 }) {
-  return /* @__PURE__ */ t("div", { className: "flex h-scroll-xl overflow-hidden", children: [
+  return /* @__PURE__ */ a("div", { className: "flex h-scroll-xl overflow-hidden", children: [
     /* @__PURE__ */ e(
-      a.div,
+      r.div,
       {
-        className: "border-r bg-gradient-to-b from-muted/30 to-muted/60 sticky top-0 self-start h-full max-h-[calc(100vh-10rem)]",
+        className: "border-r bg-gradient-to-b from-hover/30 to-hover/60 sticky top-0 self-start h-full max-h-[calc(100vh-10rem)]",
         initial: { opacity: 0, x: -10 },
         animate: { opacity: 1, x: 0 },
         transition: { duration: 0.3, ease: "easeInOut" },
         children: i
       }
     ),
-    /* @__PURE__ */ t(
-      a.div,
+    /* @__PURE__ */ a(
+      r.div,
       {
-        className: l("flex-1 px-5 py-4 overflow-y-auto", r),
+        className: s("flex-1 px-5 py-4 overflow-y-auto", t),
         initial: { opacity: 0, x: 5 },
         animate: { opacity: 1, x: 0 },
         transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" },
         children: [
-          o && /* @__PURE__ */ e("div", { className: "flex items-center mb-5", children: /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-foreground", children: o }) }),
-          /* @__PURE__ */ e("div", { className: "h-full", children: n })
+          l && /* @__PURE__ */ e("div", { className: "flex items-center mb-5", children: /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-primary", children: l }) }),
+          /* @__PURE__ */ e("div", { className: "h-full", children: o })
         ]
       }
     )
   ] });
 }
 function P({
-  isOpen: n,
-  onClose: o,
+  isOpen: o,
+  onClose: l,
   title: i,
-  description: r,
+  description: t,
   icon: c,
-  currentStep: s,
+  currentStep: n,
   totalSteps: d,
-  onBack: h,
-  onNext: p,
-  onComplete: x,
-  sidebar: y,
-  children: g,
-  continueText: v = "Continue",
-  completeText: b = "Complete",
-  isNextDisabled: u = !1,
-  isNextLoading: f = !1,
-  size: N = "2xl",
+  onBack: y,
+  onNext: x,
+  onComplete: u,
+  sidebar: f,
+  children: v,
+  continueText: b = "Continue",
+  completeText: N = "Complete",
+  isNextDisabled: h = !1,
+  isNextLoading: p = !1,
+  size: g = "2xl",
   stepLayoutSubclassName: w,
   isShowBackButton: C = !0,
   isModelContentScrollable: k = !1
 }) {
-  const j = (s + 1) / d * 100;
-  return /* @__PURE__ */ t(
+  const j = (n + 1) / d * 100;
+  return /* @__PURE__ */ a(
     O,
     {
-      isOpen: n,
-      onClose: o,
-      size: N,
+      isOpen: o,
+      onClose: l,
+      size: g,
       showClose: !0,
       title: i,
       isContentScrollable: k,
-      description: r,
+      description: t,
       icon: c && /* @__PURE__ */ e("div", { className: "bg-primary/10 p-2 rounded-full", children: /* @__PURE__ */ e(c, { className: "h-5 w-5 text-primary" }) }),
       contentClassName: "px-0 pt-0 pb-0",
-      footer: /* @__PURE__ */ t("div", { className: "w-full flex items-center justify-between", children: [
-        /* @__PURE__ */ e("div", { className: "flex-1", children: s > 0 && C && /* @__PURE__ */ e(
+      footer: /* @__PURE__ */ a("div", { className: "w-full flex items-center justify-between", children: [
+        /* @__PURE__ */ e("div", { className: "flex-1", children: n > 0 && C && /* @__PURE__ */ e(
           m,
           {
             variant: "ghost",
-            onClick: h,
+            onClick: y,
             size: "sm",
-            className: "text-muted-foreground hover:text-foreground transition-colors",
+            className: "text-tertiary hover:text-primary transition-colors",
             children: "Back"
           }
         ) }),
-        /* @__PURE__ */ t("div", { className: "flex-1 flex justify-center text-xs text-muted-foreground", children: [
+        /* @__PURE__ */ a("div", { className: "flex-1 flex justify-center text-xs text-tertiary", children: [
           "Step ",
-          s + 1,
+          n + 1,
           " of ",
           d
         ] }),
-        /* @__PURE__ */ e("div", { className: "flex-1 flex justify-end", children: s < d - 1 ? /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: "flex-1 flex justify-end", children: n < d - 1 ? /* @__PURE__ */ e(
           m,
           {
-            onClick: p,
-            disabled: u,
-            isLoading: f,
+            onClick: x,
+            disabled: h,
+            isLoading: p,
             size: "sm",
-            className: "bg-primary text-primary-foreground hover:bg-primary/90",
-            children: v
+            className: "bg-primary text-white hover:bg-primary/90",
+            children: b
           }
         ) : /* @__PURE__ */ e(
           m,
           {
-            onClick: x,
-            disabled: u,
-            isLoading: f,
+            onClick: u,
+            disabled: h,
+            isLoading: p,
             size: "sm",
-            className: "bg-primary text-primary-foreground hover:bg-primary/90",
-            children: b
+            className: "bg-primary text-white hover:bg-primary/90",
+            children: N
           }
         ) })
       ] }),
       children: [
-        /* @__PURE__ */ e("div", { className: "w-full h-0.5 bg-muted relative mb-1", children: /* @__PURE__ */ e(
-          a.div,
+        /* @__PURE__ */ e("div", { className: "w-full h-0.5 bg-hover relative mb-1", children: /* @__PURE__ */ e(
+          r.div,
           {
             className: "absolute top-0 left-0 h-full bg-primary",
             initial: { width: 0 },
@@ -186,19 +186,19 @@ function P({
         /* @__PURE__ */ e(
           z,
           {
-            sidebar: y,
+            sidebar: f,
             subclassName: w,
             children: /* @__PURE__ */ e(L, { mode: "wait", children: /* @__PURE__ */ e(
-              a.div,
+              r.div,
               {
                 initial: { opacity: 0, y: 10 },
                 animate: { opacity: 1, y: 0 },
                 exit: { opacity: 0, y: -10 },
                 transition: { duration: 0.25, ease: "easeInOut" },
                 className: "h-full",
-                children: g
+                children: v
               },
-              s
+              n
             ) })
           }
         )