orange-core-ui 0.1.0 → 0.1.1

package/dist/index.js

@@ -1,5 +1,5 @@
 import { jsx as n, jsxs as T } from "react/jsx-runtime";
-import * as c from "react";
+import * as d from "react";
 import { appendErrors as Le, useForm as Ge, FormProvider as Ee, useFormContext as Be, Controller as Fe } from "react-hook-form";
 import { validateFieldsNatively as We, toNestErrors as He } from "@hookform/resolvers";
 import { z } from "zod";
@@ -2670,10 +2670,10 @@ const v = (e) => {
     }
   };
 }, $r = /* @__PURE__ */ Cr(Ur);
-function d(...e) {
+function c(...e) {
   return $r(br(e));
 }
-const _r = c.forwardRef(
+const _r = d.forwardRef(
   ({
     className: e,
     variant: r = "primary",
@@ -2714,7 +2714,7 @@ const _r = c.forwardRef(
       "button",
       {
         ref: b,
-        className: d(
+        className: c(
           g,
           p[r],
           f[t],
@@ -2731,7 +2731,7 @@ const _r = c.forwardRef(
   }
 );
 _r.displayName = "Button";
-const qr = c.forwardRef(
+const qr = d.forwardRef(
   ({ className: e, type: r = "text", size: t = "base", error: o = !1, ...a }, s) => {
     const i = "block w-full font-sans border border-black bg-white text-[var(--body-color)] transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2", l = {
       sm: "px-2 py-1 text-sm leading-[1.25]",
@@ -2742,7 +2742,7 @@ const qr = c.forwardRef(
       "input",
       {
         type: r,
-        className: d(i, l[t], b, e),
+        className: c(i, l[t], b, e),
         ref: s,
         ...a
       }
@@ -2750,12 +2750,12 @@ const qr = c.forwardRef(
   }
 );
 qr.displayName = "Input";
-const Dr = c.forwardRef(
+const Dr = d.forwardRef(
   ({ className: e, variant: r = "default", children: t, ...o }, a) => /* @__PURE__ */ n(
     "div",
     {
       ref: a,
-      className: d("flex flex-col", {
+      className: c("flex flex-col", {
         default: "bg-white",
         outline: "border border-black bg-white"
       }[r], e),
@@ -2765,31 +2765,31 @@ const Dr = c.forwardRef(
   )
 );
 Dr.displayName = "Card";
-const Or = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const Or = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "div",
   {
     ref: t,
-    className: d("flex flex-col space-y-1.5 p-5", e),
+    className: c("flex flex-col space-y-1.5 p-5", e),
     ...r
   }
 ));
 Or.displayName = "CardHeader";
-const Xr = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const Xr = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "h3",
   {
     ref: t,
-    className: d("text-2xl font-semibold leading-none tracking-tight", e),
+    className: c("text-2xl font-semibold leading-none tracking-tight", e),
     ...r
   }
 ));
 Xr.displayName = "CardTitle";
-const Jr = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("p", { ref: t, className: d("text-sm text-body-secondary-color", e), ...r }));
+const Jr = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("p", { ref: t, className: c("text-sm text-body-secondary-color", e), ...r }));
 Jr.displayName = "CardDescription";
-const Zr = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: d("p-5 pt-0", e), ...r }));
+const Zr = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: c("p-5 pt-0", e), ...r }));
 Zr.displayName = "CardContent";
-const Kr = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: d("flex items-center p-5 pt-0", e), ...r }));
+const Kr = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: c("flex items-center p-5 pt-0", e), ...r }));
 Kr.displayName = "CardFooter";
-const Qr = c.forwardRef(
+const Qr = d.forwardRef(
   ({ as: e, variant: r = "body", className: t, children: o, ...a }, s) => {
     const i = {
       h1: "text-h1 leading-h1 tracking-h1 font-normal",
@@ -2806,11 +2806,11 @@ const Qr = c.forwardRef(
       display3: "text-display-3 leading-display tracking-display-3 font-normal",
       display4: "text-display-4 leading-display tracking-display-4 font-normal"
     }, l = r.startsWith("h") ? r : r === "lead" || r === "small" ? "p" : "div", b = e || l;
-    return c.createElement(
+    return d.createElement(
       b,
       {
         ref: s,
-        className: d(i[r], t),
+        className: c(i[r], t),
         ...a
       },
       o
@@ -2818,7 +2818,7 @@ const Qr = c.forwardRef(
   }
 );
 Qr.displayName = "Typography";
-const Yr = c.forwardRef(
+const Yr = d.forwardRef(
   ({ className: e, fluid: r = !1, size: t, children: o, ...a }, s) => {
     const i = "w-full mx-auto px-5", l = {
       xs: "max-w-[312px]",
@@ -2828,11 +2828,11 @@ const Yr = c.forwardRef(
       xl: "max-w-[1200px]",
       xxl: "max-w-[1320px]"
     };
-    return r ? /* @__PURE__ */ n("div", { ref: s, className: d(i, e), ...a, children: o }) : /* @__PURE__ */ n(
+    return r ? /* @__PURE__ */ n("div", { ref: s, className: c(i, e), ...a, children: o }) : /* @__PURE__ */ n(
       "div",
       {
         ref: s,
-        className: d(i, l[t || "xxl"], e),
+        className: c(i, l[t || "xxl"], e),
         ...a,
         children: o
       }
@@ -2840,7 +2840,7 @@ const Yr = c.forwardRef(
   }
 );
 Yr.displayName = "Container";
-const et = c.forwardRef(
+const et = d.forwardRef(
   ({ className: e, cols: r = 12, gap: t = 3, children: o, ...a }, s) => {
     const i = "grid", l = {
       1: "grid-cols-1",
@@ -2867,7 +2867,7 @@ const et = c.forwardRef(
       "div",
       {
         ref: s,
-        className: d(i, l[r], b[t], e),
+        className: c(i, l[r], b[t], e),
         ...a,
         children: o
       }
@@ -2875,7 +2875,7 @@ const et = c.forwardRef(
   }
 );
 et.displayName = "Grid";
-const rt = c.forwardRef(
+const rt = d.forwardRef(
   ({ className: e, span: r, children: t, ...o }, a) => {
     const s = r ? {
       1: "col-span-1",
@@ -2891,7 +2891,7 @@ const rt = c.forwardRef(
       11: "col-span-11",
       12: "col-span-12"
     }[r] : "";
-    return /* @__PURE__ */ n("div", { ref: a, className: d(s, e), ...o, children: t });
+    return /* @__PURE__ */ n("div", { ref: a, className: c(s, e), ...o, children: t });
   }
 );
 rt.displayName = "GridItem";
@@ -2950,7 +2950,7 @@ function Yt({
   }), l = i.handleSubmit(async (b) => {
     await t(b);
   });
-  return /* @__PURE__ */ n(Ee, { ...i, children: /* @__PURE__ */ n("form", { onSubmit: l, className: d("space-y-4", a), ...s, children: o(i) }) });
+  return /* @__PURE__ */ n(Ee, { ...i, children: /* @__PURE__ */ n("form", { onSubmit: l, className: c("space-y-4", a), ...s, children: o(i) }) });
 }
 function eo({ name: e, control: r, render: t, children: o, className: a, ...s }) {
   const i = Be();
@@ -2962,21 +2962,21 @@ function eo({ name: e, control: r, render: t, children: o, className: a, ...s })
       ...s,
       render: (l) => {
         const b = t ? t(l) : o ? o(l) : null;
-        return /* @__PURE__ */ n("div", { className: d("space-y-1", a), children: b });
+        return /* @__PURE__ */ n("div", { className: c("space-y-1", a), children: b });
       }
     }
   );
 }
-const at = c.forwardRef(
-  ({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: d("space-y-1", e), ...r })
+const at = d.forwardRef(
+  ({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: c("space-y-1", e), ...r })
 );
 at.displayName = "FormItem";
-const st = c.forwardRef(
+const st = d.forwardRef(
   ({ className: e, required: r, children: t, ...o }, a) => /* @__PURE__ */ T(
     "label",
     {
       ref: a,
-      className: d(
+      className: c(
         "block text-base font-normal leading-[1.25] text-[var(--body-color)]",
         e
       ),
@@ -2989,12 +2989,12 @@ const st = c.forwardRef(
   )
 );
 st.displayName = "FormLabel";
-const nt = c.forwardRef(
+const nt = d.forwardRef(
   ({ className: e, error: r, children: t, ...o }, a) => !r && !t ? null : /* @__PURE__ */ n(
     "p",
     {
       ref: a,
-      className: d(
+      className: c(
         "text-sm leading-sm text-danger",
         e
       ),
@@ -3006,12 +3006,12 @@ const nt = c.forwardRef(
   )
 );
 nt.displayName = "FormMessage";
-const it = c.forwardRef(
+const it = d.forwardRef(
   ({ className: e, ...r }, t) => /* @__PURE__ */ n(
     "p",
     {
       ref: t,
-      className: d("text-sm leading-sm text-body-secondary-color", e),
+      className: c("text-sm leading-sm text-body-secondary-color", e),
       ...r
     }
   )
@@ -3023,9 +3023,9 @@ const ro = z.string().email("Invalid email address"), to = z.string().min(1, "Th
   message: "Date must be in the future"
 }), bo = z.date().refine((e) => e < /* @__PURE__ */ new Date(), {
   message: "Date must be in the past"
-}), lt = c.forwardRef(
+}), lt = d.forwardRef(
   ({ className: e, variant: r = "info", dismissible: t = !1, onDismiss: o, children: a, ...s }, i) => {
-    const [l, b] = c.useState(!0), g = () => {
+    const [l, b] = d.useState(!0), g = () => {
       b(!1), o == null || o();
     };
     return l ? /* @__PURE__ */ T(
@@ -3033,7 +3033,7 @@ const ro = z.string().email("Invalid email address"), to = z.string().min(1, "Th
       {
         ref: i,
         role: "alert",
-        className: d(
+        className: c(
           "relative px-5 py-4 mb-4 border rounded",
           {
             success: "bg-success text-[var(--highlight-color)] border-success",
@@ -3062,10 +3062,10 @@ const ro = z.string().email("Invalid email address"), to = z.string().min(1, "Th
   }
 );
 lt.displayName = "Alert";
-const ct = c.forwardRef(
+const ct = d.forwardRef(
   ({ className: e, open: r = !1, onClose: t, size: o = "md", children: a, ...s }, i) => {
-    const [l, b] = c.useState(r);
-    c.useEffect(() => {
+    const [l, b] = d.useState(r);
+    d.useEffect(() => {
       b(r);
     }, [r]);
     const g = (f) => {
@@ -3082,7 +3082,7 @@ const ct = c.forwardRef(
           "div",
           {
             ref: i,
-            className: d(
+            className: c(
               "relative bg-white rounded p-5 w-full mx-4",
               {
                 sm: "max-w-sm",
@@ -3102,28 +3102,28 @@ const ct = c.forwardRef(
   }
 );
 ct.displayName = "Modal";
-const dt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: d("mb-4", e), ...r }));
+const dt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: c("mb-4", e), ...r }));
 dt.displayName = "ModalHeader";
-const bt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("h2", { ref: t, className: d("text-2xl font-semibold", e), ...r }));
+const bt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("h2", { ref: t, className: c("text-2xl font-semibold", e), ...r }));
 bt.displayName = "ModalTitle";
-const pt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: d("mb-4", e), ...r }));
+const pt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: c("mb-4", e), ...r }));
 pt.displayName = "ModalBody";
-const mt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: d("flex justify-end gap-2", e), ...r }));
+const mt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: c("flex justify-end gap-2", e), ...r }));
 mt.displayName = "ModalFooter";
-const gt = c.forwardRef(
+const gt = d.forwardRef(
   ({ className: e, trigger: r, open: t, onOpenChange: o, children: a, ...s }, i) => {
-    const [l, b] = c.useState(!1), g = c.useRef(null), p = t ?? l, f = () => {
+    const [l, b] = d.useState(!1), g = d.useRef(null), p = t ?? l, f = () => {
       const h = !p;
       b(h), o == null || o(h);
     };
-    return c.useEffect(() => {
+    return d.useEffect(() => {
       const h = (w) => {
         g.current && !g.current.contains(w.target) && (b(!1), o == null || o(!1));
       };
       return p && document.addEventListener("mousedown", h), () => {
         document.removeEventListener("mousedown", h);
       };
-    }, [p, o]), /* @__PURE__ */ T("div", { ref: g, className: d("relative inline-block", e), ...s, children: [
+    }, [p, o]), /* @__PURE__ */ T("div", { ref: g, className: c("relative inline-block", e), ...s, children: [
       /* @__PURE__ */ n("div", { onClick: f, role: "button", tabIndex: 0, children: r }),
       p && /* @__PURE__ */ n(
         "div",
@@ -3138,11 +3138,11 @@ const gt = c.forwardRef(
   }
 );
 gt.displayName = "Dropdown";
-const ut = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const ut = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "button",
   {
     ref: t,
-    className: d(
+    className: c(
       "block w-full text-left px-4 py-2 text-base hover:bg-gray-200 focus:bg-gray-200 focus:outline-none",
       e
     ),
@@ -3151,12 +3151,12 @@ const ut = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   }
 ));
 ut.displayName = "DropdownItem";
-const ft = c.forwardRef(
+const ft = d.forwardRef(
   ({ className: e, brand: r, children: t, ...o }, a) => /* @__PURE__ */ T(
     "nav",
     {
       ref: a,
-      className: d(
+      className: c(
         "relative flex flex-wrap items-center justify-between px-5 py-4 bg-white border-b border-black",
         e
       ),
@@ -3169,15 +3169,15 @@ const ft = c.forwardRef(
   )
 );
 ft.displayName = "Navbar";
-const ht = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("ul", { ref: t, className: d("flex flex-row space-x-4 list-none", e), ...r }));
+const ht = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("ul", { ref: t, className: c("flex flex-row space-x-4 list-none", e), ...r }));
 ht.displayName = "NavbarNav";
-const vt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("li", { ref: t, className: d("", e), ...r }));
+const vt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("li", { ref: t, className: c("", e), ...r }));
 vt.displayName = "NavbarItem";
-const xt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const xt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "a",
   {
     ref: t,
-    className: d(
+    className: c(
       "block px-2 py-2 text-base text-black no-underline hover:text-primary focus:outline-none",
       e
     ),
@@ -3185,18 +3185,22 @@ const xt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   }
 ));
 xt.displayName = "NavbarLink";
-const yt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
+const yt = d.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   const a = {
-    sm: "h-4 w-4",
-    base: "h-5 w-5",
-    lg: "h-6 w-6"
+    sm: "h-3.5 w-3.5",
+    base: "h-4 w-4",
+    lg: "h-5 w-5"
+  }, s = {
+    sm: "h-2.5 w-2.5",
+    base: "h-3 w-3",
+    lg: "h-4 w-4"
   };
   return /* @__PURE__ */ n(
     ae.Root,
     {
       ref: o,
-      className: d(
-        "peer h-5 w-5 shrink-0 rounded border-2 border-black bg-white transition-colors",
+      className: c(
+        "peer shrink-0 rounded border-2 border-black bg-white transition-colors",
         "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
         "disabled:cursor-not-allowed disabled:opacity-50",
         "data-[state=checked]:bg-primary data-[state=checked]:border-primary data-[state=checked]:text-white",
@@ -3207,11 +3211,11 @@ const yt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
       children: /* @__PURE__ */ n(
         ae.Indicator,
         {
-          className: d("flex items-center justify-center text-current"),
+          className: c("flex items-center justify-center text-current"),
           children: /* @__PURE__ */ n(
             "svg",
             {
-              className: "h-4 w-4",
+              className: s[r],
               viewBox: "0 0 12 12",
               fill: "none",
               xmlns: "http://www.w3.org/2000/svg",
@@ -3233,26 +3237,30 @@ const yt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   );
 });
 yt.displayName = ae.Root.displayName;
-const wt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => /* @__PURE__ */ n(
+const wt = d.forwardRef(({ className: e, size: r = "base", ...t }, o) => /* @__PURE__ */ n(
   _.Root,
   {
-    className: d("grid gap-2", e),
+    className: c("grid gap-2", e),
     ...t,
     ref: o
   }
 ));
 wt.displayName = _.Root.displayName;
-const Nt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
+const Nt = d.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   const a = {
-    sm: "h-4 w-4",
-    base: "h-5 w-5",
-    lg: "h-6 w-6"
+    sm: "h-3.5 w-3.5",
+    base: "h-4 w-4",
+    lg: "h-5 w-5"
+  }, s = {
+    sm: "h-1.5 w-1.5",
+    base: "h-2 w-2",
+    lg: "h-2.5 w-2.5"
   };
   return /* @__PURE__ */ n(
     _.Item,
     {
       ref: o,
-      className: d(
+      className: c(
         "aspect-square rounded-full border-2 border-black bg-white transition-colors",
         "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
         "disabled:cursor-not-allowed disabled:opacity-50",
@@ -3261,12 +3269,12 @@ const Nt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
         e
       ),
       ...t,
-      children: /* @__PURE__ */ n(_.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ n("div", { className: "h-2.5 w-2.5 rounded-full bg-primary" }) })
+      children: /* @__PURE__ */ n(_.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ n("div", { className: c("rounded-full bg-primary", s[r]) }) })
     }
   );
 });
 Nt.displayName = _.Item.displayName;
-const kt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
+const kt = d.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   const a = {
     sm: "h-4 w-7",
     base: "h-5 w-9",
@@ -3279,7 +3287,7 @@ const kt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   return /* @__PURE__ */ n(
     se.Root,
     {
-      className: d(
+      className: c(
         "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-black bg-white transition-colors",
         "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
         "disabled:cursor-not-allowed disabled:opacity-50",
@@ -3292,7 +3300,7 @@ const kt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
       children: /* @__PURE__ */ n(
         se.Thumb,
         {
-          className: d(
+          className: c(
             "pointer-events-none block rounded-full bg-black transition-transform",
             "translate-x-0.5 will-change-transform",
             "data-[state=checked]:translate-x-[calc(100%-0.125rem)] data-[state=checked]:bg-white",
@@ -3304,7 +3312,7 @@ const kt = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   );
 });
 kt.displayName = se.Root.displayName;
-const po = C.Root, mo = C.Group, go = C.Value, Ct = c.forwardRef(({ className: e, children: r, size: t = "base", error: o = !1, ...a }, s) => {
+const po = C.Root, mo = C.Group, go = C.Value, Ct = d.forwardRef(({ className: e, children: r, size: t = "base", error: o = !1, ...a }, s) => {
   const i = {
     sm: "h-8 px-2 text-sm",
     base: "h-10 px-3 text-base",
@@ -3314,7 +3322,7 @@ const po = C.Root, mo = C.Group, go = C.Value, Ct = c.forwardRef(({ className: e
     C.Trigger,
     {
       ref: s,
-      className: d(
+      className: c(
         "flex w-full items-center justify-between rounded border-2 border-black bg-white",
         "placeholder:text-gray-500",
         "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary",
@@ -3350,11 +3358,11 @@ const po = C.Root, mo = C.Group, go = C.Value, Ct = c.forwardRef(({ className: e
   );
 });
 Ct.displayName = C.Trigger.displayName;
-const Rt = c.forwardRef(({ className: e, children: r, position: t = "popper", ...o }, a) => /* @__PURE__ */ n(C.Portal, { children: /* @__PURE__ */ n(
+const Rt = d.forwardRef(({ className: e, children: r, position: t = "popper", ...o }, a) => /* @__PURE__ */ n(C.Portal, { children: /* @__PURE__ */ n(
   C.Content,
   {
     ref: a,
-    className: d(
+    className: c(
       "relative z-50 min-w-[8rem] overflow-hidden rounded border-2 border-black bg-white shadow-lg",
       t === "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",
       e
@@ -3364,7 +3372,7 @@ const Rt = c.forwardRef(({ className: e, children: r, position: t = "popper", ..
     children: /* @__PURE__ */ n(
       C.Viewport,
       {
-        className: d(
+        className: c(
           "p-1",
           t === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
         ),
@@ -3374,12 +3382,12 @@ const Rt = c.forwardRef(({ className: e, children: r, position: t = "popper", ..
   }
 ) }));
 Rt.displayName = C.Content.displayName;
-const St = c.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ n(
+const St = d.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ n(
   C.Item,
   {
     ref: o,
-    className: d(
-      "relative flex w-full cursor-pointer select-none items-center rounded px-3 py-2 text-base outline-none",
+    className: c(
+      "relative flex w-full cursor-pointer select-none items-center rounded px-2.5 py-1.5 text-sm outline-none",
       "focus:bg-primary focus:text-white",
       "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       e
@@ -3389,20 +3397,20 @@ const St = c.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__
   }
 ));
 St.displayName = C.Item.displayName;
-const zt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const zt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   C.Separator,
   {
     ref: t,
-    className: d("-mx-1 my-1 h-px bg-gray-300", e),
+    className: c("-mx-1 my-1 h-px bg-gray-300", e),
     ...r
   }
 ));
 zt.displayName = C.Separator.displayName;
-const Mt = c.forwardRef(
+const Mt = d.forwardRef(
   ({ className: e, error: r = !1, size: t = "base", ...o }, a) => /* @__PURE__ */ n(
     "textarea",
     {
-      className: d(
+      className: c(
         "flex min-h-[80px] w-full rounded border-2 border-black bg-white px-3 py-2 text-base",
         "placeholder:text-gray-500",
         "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
@@ -3421,7 +3429,7 @@ const Mt = c.forwardRef(
   )
 );
 Mt.displayName = "Textarea";
-const It = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
+const It = d.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   const a = {
     sm: "h-1",
     base: "h-2",
@@ -3435,7 +3443,7 @@ const It = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
     U.Root,
     {
       ref: o,
-      className: d(
+      className: c(
         "relative flex w-full touch-none select-none items-center",
         a[r],
         e
@@ -3446,7 +3454,7 @@ const It = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
         /* @__PURE__ */ n(
           U.Thumb,
           {
-            className: d(
+            className: c(
               "block rounded-full border-2 border-black bg-white transition-colors",
               "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
               "disabled:pointer-events-none disabled:opacity-50",
@@ -3459,17 +3467,17 @@ const It = c.forwardRef(({ className: e, size: r = "base", ...t }, o) => {
   );
 });
 It.displayName = U.Root.displayName;
-const Tt = c.forwardRef(
+const Tt = d.forwardRef(
   ({ className: e, separator: r = "/", children: t, ...o }, a) => {
-    const s = c.Children.toArray(t);
+    const s = d.Children.toArray(t);
     return /* @__PURE__ */ n(
       "nav",
       {
         ref: a,
         "aria-label": "Breadcrumb",
-        className: d("flex items-center space-x-2", e),
+        className: c("flex items-center space-x-2", e),
         ...o,
-        children: /* @__PURE__ */ n("ol", { className: "flex items-center space-x-2", children: c.Children.map(t, (i, l) => {
+        children: /* @__PURE__ */ n("ol", { className: "flex items-center space-x-2", children: d.Children.map(t, (i, l) => {
           const b = l === s.length - 1;
           return /* @__PURE__ */ T("li", { className: "flex items-center", children: [
             i,
@@ -3481,12 +3489,12 @@ const Tt = c.forwardRef(
   }
 );
 Tt.displayName = "Breadcrumbs";
-const At = c.forwardRef(
+const At = d.forwardRef(
   ({ className: e, active: r = !1, ...t }, o) => r ? /* @__PURE__ */ n(
     "span",
     {
       ref: o,
-      className: d("text-gray-500", e),
+      className: c("text-gray-500", e),
       "aria-current": "page",
       ...t,
       children: t.children
@@ -3495,7 +3503,7 @@ const At = c.forwardRef(
     "a",
     {
       ref: o,
-      className: d(
+      className: c(
         "text-black hover:text-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
         e
       ),
@@ -3504,7 +3512,7 @@ const At = c.forwardRef(
   )
 );
 At.displayName = "BreadcrumbItem";
-const Pt = c.forwardRef(
+const Pt = d.forwardRef(
   ({
     className: e,
     currentPage: r,
@@ -3527,7 +3535,7 @@ const Pt = c.forwardRef(
       {
         ref: l,
         "aria-label": "Pagination",
-        className: d("flex items-center justify-center gap-1", e),
+        className: c("flex items-center justify-center gap-1", e),
         ...i,
         children: [
           /* @__PURE__ */ n(
@@ -3565,11 +3573,11 @@ const Pt = c.forwardRef(
   }
 );
 Pt.displayName = "Pagination";
-const K = c.forwardRef(({ className: e, active: r = !1, ...t }, o) => /* @__PURE__ */ n(
+const K = d.forwardRef(({ className: e, active: r = !1, ...t }, o) => /* @__PURE__ */ n(
   "button",
   {
     ref: o,
-    className: d(
+    className: c(
       "min-h-[2.75rem] min-w-[2.75rem] rounded border-2 border-black px-3 py-2 text-base font-medium transition-colors",
       "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
       r ? "bg-primary text-white border-primary" : "bg-white text-black hover:bg-gray-200",
@@ -3580,11 +3588,11 @@ const K = c.forwardRef(({ className: e, active: r = !1, ...t }, o) => /* @__PURE
   }
 ));
 K.displayName = "PaginationButton";
-const uo = G.Root, jt = c.forwardRef(({ className: e, variant: r = "default", ...t }, o) => /* @__PURE__ */ n(
+const uo = G.Root, jt = d.forwardRef(({ className: e, variant: r = "default", ...t }, o) => /* @__PURE__ */ n(
   G.List,
   {
     ref: o,
-    className: d(
+    className: c(
       "inline-flex items-center justify-center rounded",
       r === "default" && "border-2 border-black",
       r === "pills" && "bg-gray-200 p-1",
@@ -3594,11 +3602,11 @@ const uo = G.Root, jt = c.forwardRef(({ className: e, variant: r = "default", ..
   }
 ));
 jt.displayName = G.List.displayName;
-const Lt = c.forwardRef(({ className: e, variant: r = "default", ...t }, o) => /* @__PURE__ */ n(
+const Lt = d.forwardRef(({ className: e, variant: r = "default", ...t }, o) => /* @__PURE__ */ n(
   G.Trigger,
   {
     ref: o,
-    className: d(
+    className: c(
       "inline-flex items-center justify-center whitespace-nowrap rounded px-4 py-2 text-base font-medium transition-colors",
       "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
       "disabled:pointer-events-none disabled:opacity-50",
@@ -3610,11 +3618,11 @@ const Lt = c.forwardRef(({ className: e, variant: r = "default", ...t }, o) => /
   }
 ));
 Lt.displayName = G.Trigger.displayName;
-const Gt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const Gt = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   G.Content,
   {
     ref: t,
-    className: d(
+    className: c(
       "mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
       e
     ),
@@ -3622,20 +3630,20 @@ const Gt = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   }
 ));
 Gt.displayName = G.Content.displayName;
-const fo = L.Root, Et = c.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const fo = L.Root, Et = d.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   L.Item,
   {
     ref: t,
-    className: d("border-b-2 border-black", e),
+    className: c("border-b-2 border-black", e),
     ...r
   }
 ));
 Et.displayName = "AccordionItem";
-const Bt = c.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ n(L.Header, { className: "flex", children: /* @__PURE__ */ T(
+const Bt = d.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ n(L.Header, { className: "flex", children: /* @__PURE__ */ T(
   L.Trigger,
   {
     ref: o,
-    className: d(
+    className: c(
       "flex flex-1 items-center justify-between py-4 text-left text-base font-medium transition-all",
       "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary",
       "[&[data-state=open]>svg]:rotate-180",
@@ -3667,23 +3675,23 @@ const Bt = c.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__
   }
 ) }));
 Bt.displayName = L.Trigger.displayName;
-const Ft = c.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ n(
+const Ft = d.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ n(
   L.Content,
   {
     ref: o,
     className: "overflow-hidden text-base transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
     ...t,
-    children: /* @__PURE__ */ n("div", { className: d("pb-4 pt-0", e), children: r })
+    children: /* @__PURE__ */ n("div", { className: c("pb-4 pt-0", e), children: r })
   }
 ));
 Ft.displayName = L.Content.displayName;
-const ho = q.Root, vo = q.Trigger, Wt = c.forwardRef(({ className: e, align: r = "center", sideOffset: t = 4, ...o }, a) => /* @__PURE__ */ n(q.Portal, { children: /* @__PURE__ */ n(
+const ho = q.Root, vo = q.Trigger, Wt = d.forwardRef(({ className: e, align: r = "center", sideOffset: t = 4, ...o }, a) => /* @__PURE__ */ n(q.Portal, { children: /* @__PURE__ */ n(
   q.Content,
   {
     ref: a,
     align: r,
     sideOffset: t,
-    className: d(
+    className: c(
       "z-50 w-72 rounded border-2 border-black bg-white p-4 shadow-lg",
       "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",
       e
@@ -3692,12 +3700,12 @@ const ho = q.Root, vo = q.Trigger, Wt = c.forwardRef(({ className: e, align: r =
   }
 ) }));
 Wt.displayName = q.Content.displayName;
-const xo = D.Provider, yo = D.Root, wo = D.Trigger, Ht = c.forwardRef(({ className: e, sideOffset: r = 4, ...t }, o) => /* @__PURE__ */ n(
+const xo = D.Provider, yo = D.Root, wo = D.Trigger, Ht = d.forwardRef(({ className: e, sideOffset: r = 4, ...t }, o) => /* @__PURE__ */ n(
   D.Content,
   {
     ref: o,
     sideOffset: r,
-    className: d(
+    className: c(
       "z-50 overflow-hidden rounded border-2 border-black bg-black px-3 py-1.5 text-sm text-white shadow-md",
       "animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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",
       e
@@ -3706,7 +3714,7 @@ const xo = D.Provider, yo = D.Root, wo = D.Trigger, Ht = c.forwardRef(({ classNa
   }
 ));
 Ht.displayName = D.Content.displayName;
-const Vt = c.forwardRef(
+const Vt = d.forwardRef(
   ({ className: e, variant: r = "primary", size: t = "base", ...o }, a) => {
     const s = {
       primary: "bg-primary text-white",
@@ -3726,7 +3734,7 @@ const Vt = c.forwardRef(
       "span",
       {
         ref: a,
-        className: d(
+        className: c(
           "inline-flex items-center rounded font-medium",
           s[r],
           i[t],
@@ -3738,18 +3746,18 @@ const Vt = c.forwardRef(
   }
 );
 Vt.displayName = "Badge";
-const Ut = c.forwardRef(
+const Ut = d.forwardRef(
   ({ className: e, src: r, alt: t, fallback: o, size: a = "base", ...s }, i) => {
     const l = {
       sm: "h-8 w-8 text-xs",
       base: "h-10 w-10 text-sm",
       lg: "h-12 w-12 text-base"
-    }, [b, g] = c.useState(!1);
+    }, [b, g] = d.useState(!1);
     return /* @__PURE__ */ n(
       "div",
       {
         ref: i,
-        className: d(
+        className: c(
           "relative flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-gray-300",
           l[a],
           e
@@ -3769,12 +3777,12 @@ const Ut = c.forwardRef(
   }
 );
 Ut.displayName = "Avatar";
-const $t = c.forwardRef(
+const $t = d.forwardRef(
   ({ className: e, orientation: r = "horizontal", variant: t = "solid", ...o }, a) => r === "vertical" ? /* @__PURE__ */ n(
     "div",
     {
       ref: a,
-      className: d(
+      className: c(
         "w-px bg-black",
         t === "dashed" && "border-dashed",
         e
@@ -3787,7 +3795,7 @@ const $t = c.forwardRef(
     "hr",
     {
       ref: a,
-      className: d(
+      className: c(
         "border-0 border-t-2 border-black",
         t === "dashed" && "border-dashed",
         e
@@ -3799,7 +3807,7 @@ const $t = c.forwardRef(
   )
 );
 $t.displayName = "Divider";
-const _t = c.forwardRef(
+const _t = d.forwardRef(
   ({
     className: e,
     variant: r = "rectangular",
@@ -3811,7 +3819,7 @@ const _t = c.forwardRef(
     "div",
     {
       ref: i,
-      className: d(
+      className: c(
         "animate-pulse bg-gray-300",
         {
           text: "rounded",
@@ -3830,7 +3838,7 @@ const _t = c.forwardRef(
   )
 );
 _t.displayName = "Skeleton";
-const qt = c.forwardRef(({ className: e, variant: r = "primary", size: t = "base", value: o, ...a }, s) => {
+const qt = d.forwardRef(({ className: e, variant: r = "primary", size: t = "base", value: o, ...a }, s) => {
   const i = {
     primary: "bg-primary",
     success: "bg-success",
@@ -3846,7 +3854,7 @@ const qt = c.forwardRef(({ className: e, variant: r = "primary", size: t = "base
     ne.Root,
     {
       ref: s,
-      className: d(
+      className: c(
         "relative h-2 w-full overflow-hidden rounded-full bg-gray-300",
         l[t],
         e
@@ -3855,7 +3863,7 @@ const qt = c.forwardRef(({ className: e, variant: r = "primary", size: t = "base
       children: /* @__PURE__ */ n(
         ne.Indicator,
         {
-          className: d(
+          className: c(
             "h-full w-full flex-1 transition-all",
             i[r]
           ),
@@ -3866,7 +3874,7 @@ const qt = c.forwardRef(({ className: e, variant: r = "primary", size: t = "base
   );
 });
 qt.displayName = ne.Root.displayName;
-const Dt = c.forwardRef(
+const Dt = d.forwardRef(
   ({ className: e, size: r = "base", variant: t = "primary", ...o }, a) => {
     const s = {
       sm: "h-4 w-4 border-2",
@@ -3881,7 +3889,7 @@ const Dt = c.forwardRef(
       "div",
       {
         ref: a,
-        className: d(
+        className: c(
           "animate-spin rounded-full",
           s[r],
           i[t],
@@ -3896,14 +3904,14 @@ const Dt = c.forwardRef(
   }
 );
 Dt.displayName = "Spinner";
-const Ot = c.forwardRef(
+const Ot = d.forwardRef(
   ({ className: e, orientation: r = "horizontal", decorative: t = !0, ...o }, a) => /* @__PURE__ */ n(
     Ne.Root,
     {
       ref: a,
       decorative: t,
       orientation: r,
-      className: d(
+      className: c(
         "shrink-0 bg-black",
         r === "horizontal" ? "h-px w-full" : "h-full w-px",
         e