@definable/ui 0.1.31 → 0.1.35

package/dist/components/progress.js

@@ -1,19 +1,19 @@
-import { jsx as i } from "react/jsx-runtime";
-import * as a from "react";
-import * as o from "@radix-ui/react-progress";
-import { motion as e } from "framer-motion";
+import { jsx as o } from "react/jsx-runtime";
+import * as e from "react";
+import * as i from "@radix-ui/react-progress";
+import { motion as t } from "framer-motion";
 import { cn as l } from "../lib/utils.js";
-const f = a.forwardRef(({ className: m, value: r, ...s }, t) => /* @__PURE__ */ i(
-  o.Root,
+const f = e.forwardRef(({ className: s, value: r, ...m }, a) => /* @__PURE__ */ o(
+  i.Root,
   {
-    ref: t,
+    ref: a,
     className: l(
-      "relative h-2 w-full overflow-hidden rounded-full bg-muted",
-      m
+      "relative h-2 w-full overflow-hidden rounded-full bg-hover",
+      s
     ),
-    ...s,
-    children: /* @__PURE__ */ i(
-      e.div,
+    ...m,
+    children: /* @__PURE__ */ o(
+      t.div,
       {
         className: "h-full w-full bg-primary",
         initial: { x: "-100%" },
@@ -28,7 +28,7 @@ const f = a.forwardRef(({ className: m, value: r, ...s }, t) => /* @__PURE__ */
     )
   }
 ));
-f.displayName = o.Root.displayName;
+f.displayName = i.Root.displayName;
 export {
   f as Progress
 };

package/dist/components/radio-group.js

@@ -1,47 +1,47 @@
-import { jsx as r } from "react/jsx-runtime";
-import * as s from "react";
-import * as e from "@radix-ui/react-radio-group";
+import { jsx as e } from "react/jsx-runtime";
+import * as t from "react";
+import * as r from "@radix-ui/react-radio-group";
 import { cn as l } from "../lib/utils.js";
-import { Circle as m } from "lucide-react";
-import { motion as t } from "framer-motion";
-const n = s.forwardRef(({ className: i, ...a }, o) => /* @__PURE__ */ r(
-  e.Root,
+import { Circle as c } from "lucide-react";
+import { motion as s } from "framer-motion";
+const m = t.forwardRef(({ className: i, ...a }, o) => /* @__PURE__ */ e(
+  r.Root,
   {
     className: l("grid gap-2", i),
     ...a,
     ref: o
   }
 ));
-n.displayName = e.Root.displayName;
-const c = s.forwardRef(({ className: i, ...a }, o) => /* @__PURE__ */ r(
-  t.div,
+m.displayName = r.Root.displayName;
+const n = t.forwardRef(({ className: i, ...a }, o) => /* @__PURE__ */ e(
+  s.div,
   {
     whileHover: { scale: 1.05 },
     whileTap: { scale: 0.95 },
-    children: /* @__PURE__ */ r(
-      e.Item,
+    children: /* @__PURE__ */ e(
+      r.Item,
       {
         ref: o,
         className: l(
-          "aspect-square h-4 w-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+          "aspect-square h-4 w-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-black/20 dark:focus-visible:ring-white/20 disabled:cursor-not-allowed disabled:opacity-50",
           i
         ),
         ...a,
-        children: /* @__PURE__ */ r(e.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ r(
-          t.div,
+        children: /* @__PURE__ */ e(r.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ e(
+          s.div,
           {
             initial: { scale: 0 },
             animate: { scale: 1 },
             transition: { type: "spring", stiffness: 300, damping: 20 },
-            children: /* @__PURE__ */ r(m, { className: "h-2.5 w-2.5 fill-current text-current" })
+            children: /* @__PURE__ */ e(c, { className: "h-2.5 w-2.5 fill-current text-current" })
           }
         ) })
       }
     )
   }
 ));
-c.displayName = e.Item.displayName;
+n.displayName = r.Item.displayName;
 export {
-  n as RadioGroup,
-  c as RadioGroupItem
+  m as RadioGroup,
+  n as RadioGroupItem
 };

package/dist/components/scroll-area.js

@@ -1,46 +1,46 @@
-import { jsxs as i, jsx as l } from "react/jsx-runtime";
-import * as c from "react";
+import { jsxs as c, jsx as l } from "react/jsx-runtime";
+import * as i from "react";
 import * as r from "@radix-ui/react-scroll-area";
-import { cn as s } from "../lib/utils.js";
-const n = c.forwardRef(({ className: o, children: e, ...a }, t) => /* @__PURE__ */ i(
+import { cn as d } from "../lib/utils.js";
+const n = i.forwardRef(({ className: e, children: a, ...o }, t) => /* @__PURE__ */ c(
   r.Root,
   {
     ref: t,
-    className: s("relative overflow-hidden", o),
-    ...a,
+    className: d("relative overflow-hidden", e),
+    ...o,
     children: [
-      /* @__PURE__ */ l(r.Viewport, { className: "h-full w-full rounded-[inherit]", children: e }),
-      /* @__PURE__ */ l(d, {}),
+      /* @__PURE__ */ l(r.Viewport, { className: "h-full w-full rounded-[inherit]", children: a }),
+      /* @__PURE__ */ l(s, {}),
       /* @__PURE__ */ l(r.Corner, {})
     ]
   }
 ));
 n.displayName = r.Root.displayName;
-const d = c.forwardRef(({ className: o, orientation: e = "vertical", ...a }, t) => /* @__PURE__ */ l(
+const s = i.forwardRef(({ className: e, orientation: a = "vertical", ...o }, t) => /* @__PURE__ */ l(
   r.ScrollAreaScrollbar,
   {
     ref: t,
-    orientation: e,
-    className: s(
+    orientation: a,
+    className: d(
       "flex touch-none select-none transition-colors",
-      e === "vertical" && "h-full w-1.5 border-l border-l-transparent p-[1px] hover:w-2",
-      e === "horizontal" && "h-1.5 flex-col border-t border-t-transparent p-[1px] hover:h-2",
-      o
+      a === "vertical" && "h-full w-1.5 border-l border-l-transparent p-[1px] hover:w-2",
+      a === "horizontal" && "h-1.5 flex-col border-t border-t-transparent p-[1px] hover:h-2",
+      e
     ),
-    ...a,
+    ...o,
     children: /* @__PURE__ */ l(
       r.ScrollAreaThumb,
       {
-        className: s(
-          "relative flex-1 rounded-full bg-border/40 hover:bg-border/70 transition-all duration-150",
-          "data-[state=dragging]:bg-border/70"
+        className: d(
+          "relative flex-1 rounded-full bg-light/40 hover:bg-light/70 dark:bg-dark/40 dark:hover:bg-dark/70 transition-all duration-150",
+          "data-[state=dragging]:bg-light/70 dark:data-[state=dragging]:bg-dark/70"
         )
       }
     )
   }
 ));
-d.displayName = r.ScrollAreaScrollbar.displayName;
+s.displayName = r.ScrollAreaScrollbar.displayName;
 export {
   n as ScrollArea,
-  d as ScrollBar
+  s as ScrollBar
 };

package/dist/components/select.js

@@ -2,14 +2,14 @@ import { jsxs as c, jsx as t } from "react/jsx-runtime";
 import * as a from "react";
 import * as e from "@radix-ui/react-select";
 import { ChevronDown as N, Search as S, Check as v } from "lucide-react";
-import { cn as i } from "../lib/utils.js";
+import { cn as d } from "../lib/utils.js";
 import { Input as C } from "./input.js";
 const I = e.Root, E = e.Group, L = e.Value, R = a.forwardRef(({ className: o, children: s, ...r }, n) => /* @__PURE__ */ c(
   e.Trigger,
   {
     ref: n,
-    className: i(
-      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+    className: d(
+      "flex h-10 w-full items-center justify-between rounded-md border border-light bg-secondary px-3 py-2 text-sm ring-offset-white dark:ring-offset-[#1F1F20] placeholder:text-tertiary focus:outline-none focus:ring-2 focus:ring-black/20 dark:focus:ring-white/20 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
       o
     ),
     ...r,
@@ -20,8 +20,8 @@ const I = e.Root, E = e.Group, L = e.Value, R = a.forwardRef(({ className: o, ch
   }
 ));
 R.displayName = e.Trigger.displayName;
-const g = a.forwardRef(({ className: o, children: s, position: r = "popper", searchable: n, onSearch: m, searchPlaceholder: p = "Search...", ...f }, d) => {
-  const [b, y] = a.useState(""), u = a.useRef(null);
+const g = a.forwardRef(({ className: o, children: s, position: r = "popper", searchable: n, onSearch: m, searchPlaceholder: f = "Search...", ...p }, i) => {
+  const [y, b] = a.useState(""), u = a.useRef(null);
   a.useEffect(() => {
     n && u.current && setTimeout(() => {
       var l;
@@ -29,7 +29,7 @@ const g = a.forwardRef(({ className: o, children: s, position: r = "popper", sea
     }, 50);
   }, [n]);
   const w = (l) => {
-    y(l.target.value), m && m(l.target.value);
+    b(l.target.value), m && m(l.target.value);
   }, h = (l) => {
     l.stopPropagation();
   }, x = (l) => {
@@ -38,31 +38,31 @@ const g = a.forwardRef(({ className: o, children: s, position: r = "popper", sea
   return /* @__PURE__ */ t(e.Portal, { children: /* @__PURE__ */ c(
     e.Content,
     {
-      ref: d,
-      className: i(
-        "relative z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      ref: i,
+      className: d(
+        "relative z-50 min-w-[8rem] overflow-hidden rounded-md border bg-card text-primary shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         r === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
         o
       ),
       position: r,
-      ...f,
+      ...p,
       children: [
         n && /* @__PURE__ */ t(
           "div",
           {
-            className: "px-2 py-1.5 sticky top-0 bg-popover z-10 border-b",
+            className: "px-2 py-1.5 sticky top-0 bg-card z-10 border-b",
             onClick: h,
             children: /* @__PURE__ */ c("div", { className: "relative", children: [
-              /* @__PURE__ */ t(S, { className: "absolute left-2 top-1/2 transform -translate-y-1/2 h-3.5 w-3.5 text-muted-foreground" }),
+              /* @__PURE__ */ t(S, { className: "absolute left-2 top-1/2 transform -translate-y-1/2 h-3.5 w-3.5 text-tertiary" }),
               /* @__PURE__ */ t(
                 C,
                 {
                   ref: u,
-                  value: b,
+                  value: y,
                   onChange: w,
                   onClick: h,
                   onKeyDown: x,
-                  placeholder: p,
+                  placeholder: f,
                   className: "h-7 text-xs pl-7"
                 }
               )
@@ -72,7 +72,7 @@ const g = a.forwardRef(({ className: o, children: s, position: r = "popper", sea
         /* @__PURE__ */ t(
           e.Viewport,
           {
-            className: i(
+            className: d(
               "p-1",
               r === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
             ),
@@ -84,21 +84,21 @@ const g = a.forwardRef(({ className: o, children: s, position: r = "popper", sea
   ) });
 });
 g.displayName = e.Content.displayName;
-const V = a.forwardRef(({ className: o, ...s }, r) => /* @__PURE__ */ t(
+const k = a.forwardRef(({ className: o, ...s }, r) => /* @__PURE__ */ t(
   e.Label,
   {
     ref: r,
-    className: i("py-1.5 pl-8 pr-2 text-sm font-semibold", o),
+    className: d("py-1.5 pl-8 pr-2 text-sm font-semibold", o),
     ...s
   }
 ));
-V.displayName = e.Label.displayName;
-const k = a.forwardRef(({ className: o, children: s, ...r }, n) => /* @__PURE__ */ c(
+k.displayName = e.Label.displayName;
+const V = a.forwardRef(({ className: o, children: s, ...r }, n) => /* @__PURE__ */ c(
   e.Item,
   {
     ref: n,
-    className: i(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+    className: d(
+      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-hover focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       o
     ),
     ...r,
@@ -108,14 +108,14 @@ const k = a.forwardRef(({ className: o, children: s, ...r }, n) => /* @__PURE__
     ]
   }
 ));
-k.displayName = e.Item.displayName;
+V.displayName = e.Item.displayName;
 const T = a.forwardRef(({ children: o, searchPlaceholder: s, ...r }, n) => {
-  const [m, p] = a.useState(""), f = a.Children.map(o, (d) => a.isValidElement(d) && d.type === g ? a.cloneElement(d, {
+  const [m, f] = a.useState(""), p = a.Children.map(o, (i) => a.isValidElement(i) && i.type === g ? a.cloneElement(i, {
     searchable: !0,
-    onSearch: p,
+    onSearch: f,
     searchPlaceholder: s
-  }) : d);
-  return /* @__PURE__ */ t(I, { ...r, children: f });
+  }) : i);
+  return /* @__PURE__ */ t(I, { ...r, children: p });
 });
 T.displayName = "SearchableSelect";
 export {
@@ -123,8 +123,8 @@ export {
   I as Select,
   g as SelectContent,
   E as SelectGroup,
-  k as SelectItem,
-  V as SelectLabel,
+  V as SelectItem,
+  k as SelectLabel,
   R as SelectTrigger,
   L as SelectValue
 };

package/dist/components/selection-bar.js

@@ -1,13 +1,13 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
 import { AnimatePresence as o, motion as d } from "framer-motion";
-import { Check as h, X as p, Download as g, Trash as x } from "lucide-react";
-import { Button as r } from "./button.js";
-function w({
-  selectedCount: l,
+import { Check as h, X as g, Download as p, Trash as x } from "lucide-react";
+import { Button as t } from "./button.js";
+function y({
+  selectedCount: c,
   onEnable: a,
   onDisable: s,
-  onDelete: t,
-  onDownload: c,
+  onDelete: r,
+  onDownload: l,
   onCancel: m,
   show: n
 }) {
@@ -17,37 +17,37 @@ function w({
       initial: { y: 100, opacity: 0 },
       animate: { y: 0, opacity: 1 },
       exit: { y: 100, opacity: 0 },
-      className: "fixed bottom-4 left-1/2 -translate-x-1/2 w-fit bg-background rounded-lg border shadow-lg z-50",
+      className: "fixed bottom-4 left-1/2 -translate-x-1/2 w-fit bg-secondary rounded-lg border shadow-lg z-50",
       children: /* @__PURE__ */ i("div", { className: "flex items-center gap-6 px-4 py-2", children: [
         /* @__PURE__ */ i("div", { className: "flex items-center gap-2 text-sm font-medium", children: [
-          /* @__PURE__ */ e("span", { className: "bg-primary text-primary-foreground w-8 h-8 rounded-lg flex items-center justify-center", children: l }),
+          /* @__PURE__ */ e("span", { className: "bg-primary text-white w-8 h-8 rounded-lg flex items-center justify-center", children: c }),
           "Selected"
         ] }),
-        /* @__PURE__ */ e("div", { className: "h-4 w-px bg-border" }),
+        /* @__PURE__ */ e("div", { className: "h-4 w-px bg-light" }),
         /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
-          a && /* @__PURE__ */ i(r, { variant: "ghost", size: "sm", onClick: a, children: [
+          a && /* @__PURE__ */ i(t, { variant: "ghost", size: "sm", onClick: a, children: [
             /* @__PURE__ */ e(h, { className: "mr-2 h-4 w-4" }),
             "Enable"
           ] }),
-          s && /* @__PURE__ */ i(r, { variant: "ghost", size: "sm", onClick: s, children: [
-            /* @__PURE__ */ e(p, { className: "mr-2 h-4 w-4" }),
+          s && /* @__PURE__ */ i(t, { variant: "ghost", size: "sm", onClick: s, children: [
+            /* @__PURE__ */ e(g, { className: "mr-2 h-4 w-4" }),
             "Disable"
           ] }),
-          c && /* @__PURE__ */ i(r, { variant: "ghost", size: "sm", onClick: c, children: [
-            /* @__PURE__ */ e(g, { className: "mr-2 h-4 w-4" }),
+          l && /* @__PURE__ */ i(t, { variant: "ghost", size: "sm", onClick: l, children: [
+            /* @__PURE__ */ e(p, { className: "mr-2 h-4 w-4" }),
             "Download"
           ] }),
-          t && /* @__PURE__ */ i(r, { variant: "ghost", size: "sm", className: "text-destructive", onClick: t, children: [
+          r && /* @__PURE__ */ i(t, { variant: "ghost", size: "sm", className: "text-red-500", onClick: r, children: [
             /* @__PURE__ */ e(x, { className: "mr-2 h-4 w-4" }),
             "Delete"
           ] })
         ] }),
-        /* @__PURE__ */ e("div", { className: "h-4 w-px bg-border" }),
-        /* @__PURE__ */ e(r, { variant: "ghost", size: "sm", onClick: m, children: "Cancel" })
+        /* @__PURE__ */ e("div", { className: "h-4 w-px bg-light" }),
+        /* @__PURE__ */ e(t, { variant: "ghost", size: "sm", onClick: m, children: "Cancel" })
       ] })
     }
   ) });
 }
 export {
-  w as SelectionBar
+  y as SelectionBar
 };

package/dist/components/separator.js

@@ -1,16 +1,16 @@
-import { jsx as e } from "react/jsx-runtime";
-import * as i from "react";
+import { jsx as p } from "react/jsx-runtime";
+import * as l from "react";
 import * as o from "@radix-ui/react-separator";
-import { cn as l } from "../lib/utils.js";
-const s = i.forwardRef(
-  ({ className: a, orientation: r = "horizontal", decorative: t = !0, ...m }, p) => /* @__PURE__ */ e(
+import { cn as e } from "../lib/utils.js";
+const s = l.forwardRef(
+  ({ className: a, orientation: r = "horizontal", decorative: t = !0, ...m }, i) => /* @__PURE__ */ p(
     o.Root,
     {
-      ref: p,
+      ref: i,
       decorative: t,
       orientation: r,
-      className: l(
-        "shrink-0 bg-border",
+      className: e(
+        "shrink-0 bg-light dark:bg-dark",
         r === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
         a
       ),

package/dist/components/sheet.js

@@ -1,26 +1,26 @@
 import { jsxs as l, jsx as t, Fragment as R } from "react/jsx-runtime";
 import { Minimize2 as B, Maximize2 as I, X as M } from "lucide-react";
-import { Button as b } from "./button.js";
+import { Button as y } from "./button.js";
 import { useState as X, useRef as q, useEffect as m } from "react";
 import { cn as u } from "../lib/utils.js";
-import { AnimatePresence as D, motion as y } from "framer-motion";
+import { AnimatePresence as D, motion as g } from "framer-motion";
 import { createPortal as G } from "react-dom";
 let a = [];
 function W({
   isOpen: i,
   onClose: s,
-  children: g,
+  children: b,
   header: v,
   footer: f,
   className: N,
-  enableFullscreen: k = !0,
+  enableFullscreen: w = !0,
   position: c = "right",
-  headerClassName: w = "",
+  headerClassName: k = "",
   disableOutsideClose: h = !1
 }) {
-  const [n, P] = X(!1), r = q(null);
-  if (m(() => (i ? a.push(r) : a = a.filter((e) => e !== r), () => {
-    a = a.filter((e) => e !== r);
+  const [r, P] = X(!1), n = q(null);
+  if (m(() => (i ? a.push(n) : a = a.filter((e) => e !== n), () => {
+    a = a.filter((e) => e !== n);
   }), [i]), m(() => {
     const e = (o) => {
       var p;
@@ -28,14 +28,14 @@ function W({
       const A = a.some(
         (x) => x.current && x.current.contains(o.target)
       ), F = (p = o.target) == null ? void 0 : p.closest("[data-sheet-close]");
-      !A && !F && r.current && !r.current.contains(o.target) && s();
+      !A && !F && n.current && !n.current.contains(o.target) && s();
     };
-    return i && !n && document.addEventListener("mousedown", e), () => {
+    return i && !r && document.addEventListener("mousedown", e), () => {
       document.removeEventListener("mousedown", e);
     };
-  }, [i, n, h]), m(() => {
+  }, [i, r, h]), m(() => {
     const e = (o) => {
-      o.key === "Escape" && i && a[a.length - 1] === r && s();
+      o.key === "Escape" && i && a[a.length - 1] === n && s();
     };
     return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
   }, [i]), !i) return null;
@@ -43,25 +43,25 @@ function W({
     e.stopPropagation(), s();
   }, z = /* @__PURE__ */ l("div", { className: "flex flex-col h-full", children: [
     /* @__PURE__ */ l("div", { className: u(
-      "flex items-center bg-card justify-between py-4 px-4 h-header border-b border-border/50",
-      w
+      "flex items-center bg-card justify-between py-4 px-4 h-header border-b border-light",
+      k
     ), children: [
       /* @__PURE__ */ t("div", { className: "text-sm font-medium", children: v }),
       /* @__PURE__ */ l("div", { className: "flex items-center gap-1 ml-auto", children: [
-        k && /* @__PURE__ */ t(
-          b,
+        w && /* @__PURE__ */ t(
+          y,
           {
             variant: "ghost",
             size: "icon",
             className: "h-7 w-7",
             onClick: (e) => {
-              e.stopPropagation(), P(!n);
+              e.stopPropagation(), P(!r);
             },
-            children: n ? /* @__PURE__ */ t(B, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ t(I, { className: "h-3.5 w-3.5" })
+            children: r ? /* @__PURE__ */ t(B, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ t(I, { className: "h-3.5 w-3.5" })
           }
         ),
         /* @__PURE__ */ t(
-          b,
+          y,
           {
             variant: "ghost",
             size: "icon",
@@ -73,8 +73,8 @@ function W({
         )
       ] })
     ] }),
-    /* @__PURE__ */ t("div", { className: "flex-1 overflow-auto", children: g }),
-    f && /* @__PURE__ */ t("div", { className: "border-t border-border/50 bg-card py-2 px-3", children: /* @__PURE__ */ t("div", { className: "text-sm", children: f }) })
+    /* @__PURE__ */ t("div", { className: "flex-1 overflow-auto", children: b }),
+    f && /* @__PURE__ */ t("div", { className: "border-t border-light bg-card py-2 px-3", children: /* @__PURE__ */ t("div", { className: "text-sm", children: f }) })
   ] }), C = () => c === "left" ? {
     initial: { x: -100, opacity: 0 },
     animate: { x: 0, opacity: 1 },
@@ -87,9 +87,9 @@ function W({
     initial: { x: 100, opacity: 0 },
     animate: { x: 0, opacity: 1 },
     exit: { x: 100, opacity: 0 }
-  }, L = () => n ? "inset-4 rounded-lg" : c === "left" ? "inset-y-0 left-0 border-r" : c === "bottom" ? "inset-x-0 bottom-0 border-t" : "inset-y-0 right-0 border-l", d = C(), S = L(), j = /* @__PURE__ */ t(D, { children: i && /* @__PURE__ */ l(R, { children: [
+  }, L = () => r ? "inset-4 rounded-lg" : c === "left" ? "inset-y-0 left-0 border-r" : c === "bottom" ? "inset-x-0 bottom-0 border-t" : "inset-y-0 right-0 border-l", d = C(), S = L(), j = /* @__PURE__ */ t(D, { children: i && /* @__PURE__ */ l(R, { children: [
     /* @__PURE__ */ t(
-      y.div,
+      g.div,
       {
         initial: { opacity: 0 },
         animate: { opacity: 1 },
@@ -98,15 +98,15 @@ function W({
           e.stopPropagation(), s();
         },
         className: u(
-          "fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-          n ? "block" : "hidden"
+          "fixed inset-0 z-[100] bg-secondary/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+          r ? "block" : "hidden"
         )
       }
     ),
     /* @__PURE__ */ t(
-      y.div,
+      g.div,
       {
-        ref: r,
+        ref: n,
         initial: d.initial,
         animate: d.animate,
         exit: d.exit,
@@ -115,7 +115,7 @@ function W({
           ease: [0.32, 0.72, 0, 1]
         },
         className: u(
-          "fixed z-[100] bg-background shadow-lg flex flex-col border-border/50",
+          "fixed z-[100] bg-secondary shadow-lg flex flex-col border-light",
           S,
           N
         ),

package/dist/components/skeleton.js

@@ -1,17 +1,17 @@
-import { jsx as o } from "react/jsx-runtime";
-import { cn as r } from "../lib/utils.js";
-function d({
+import { jsx as r } from "react/jsx-runtime";
+import { cn as m } from "../lib/utils.js";
+function i({
   className: e,
-  ...m
+  ...o
 }) {
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ r(
     "div",
     {
-      className: r("animate-pulse rounded-md bg-muted/60", e),
-      ...m
+      className: m("animate-pulse rounded-md bg-hover/60", e),
+      ...o
     }
   );
 }
 export {
-  d as Skeleton
+  i as Skeleton
 };

package/dist/components/slider.js

@@ -1,32 +1,32 @@
-import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import { jsxs as a, jsx as i } from "react/jsx-runtime";
 import * as t from "react";
 import * as e from "@radix-ui/react-slider";
-import { cn as n } from "../lib/utils.js";
-const c = t.forwardRef(({ className: l, ...o }, a) => {
-  var i;
-  return /* @__PURE__ */ s(
+import { cn as c } from "../lib/utils.js";
+const n = t.forwardRef(({ className: l, ...r }, s) => {
+  var o;
+  return /* @__PURE__ */ a(
     e.Root,
     {
-      ref: a,
-      className: n(
+      ref: s,
+      className: c(
         "relative flex w-full touch-none select-none items-center",
         l
       ),
-      ...o,
+      ...r,
       children: [
-        /* @__PURE__ */ r(e.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-primary/20", children: /* @__PURE__ */ r(
+        /* @__PURE__ */ i(e.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-primary/20", children: /* @__PURE__ */ i(
           "div",
           {
             className: "absolute h-full bg-primary",
-            style: { width: `${(((i = o.value) == null ? void 0 : i[0]) || 0) * 100}%` }
+            style: { width: `${(((o = r.value) == null ? void 0 : o[0]) || 0) * 100}%` }
           }
         ) }),
-        /* @__PURE__ */ r(e.Thumb, { className: "block h-4 w-4 rounded-full border border-primary/50 bg-background shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 hover:scale-110 active:scale-90" })
+        /* @__PURE__ */ i(e.Thumb, { className: "block h-4 w-4 rounded-full border border-primary/50 bg-secondary shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-black/20 dark:focus-visible:ring-white/20 disabled:pointer-events-none disabled:opacity-50 hover:scale-110 active:scale-90" })
       ]
     }
   );
 });
-c.displayName = e.Root.displayName;
+n.displayName = e.Root.displayName;
 export {
-  c as Slider
+  n as Slider
 };

package/dist/components/stepper.js

@@ -1,4 +1,4 @@
-import { a as p, S as t, b as o } from "../stepper-modal-JXpOXOV2.js";
+import { a as p, S as t, b as o } from "../stepper-modal-Bh6gsg8o.js";
 export {
   p as StepLayout,
   t as Stepper,