siesa-ui-kit 1.0.8 → 1.0.9

package/dist/siesa-ui-kit.mjs

@@ -1,5 +1,5 @@
-import { jsxs as l, Fragment as S, jsx as e } from "react/jsx-runtime";
-import { forwardRef as A, cloneElement as ae, useRef as K, useEffect as W, useState as V, useMemo as ge, createContext as ue, useContext as xe } from "react";
+import { jsxs as l, Fragment as z, jsx as e } from "react/jsx-runtime";
+import { forwardRef as E, cloneElement as ae, useRef as G, useEffect as U, useState as H, useCallback as ge, useMemo as ue, createContext as xe, useContext as fe } from "react";
 const Y = ({
   type: t = "default",
   size: a = "base",
@@ -10,27 +10,27 @@ const Y = ({
   disabled: c = !1,
   className: d = "",
   onClick: b,
-  htmlType: u = "button",
+  htmlType: g = "button",
   fullWidth: i = !1,
-  ariaLabel: p,
-  badge: m = !1,
-  badgeCount: x,
-  badgeColor: g = "red",
-  ...y
+  ariaLabel: m,
+  badge: p = !1,
+  badgeCount: f,
+  badgeColor: u = "red",
+  ...k
 }) => {
-  const f = {
+  const x = {
     xs: o ? "h-6 w-6 p-1" : "h-6 py-1 px-2 gap-2",
     sm: o ? "h-7 w-7 p-1.5" : "h-7 py-1 px-2 gap-2",
     base: o ? "h-8 w-8 p-2" : "h-8 py-1.5 px-2.5 gap-2",
     l: o ? "h-9 w-9 p-2.5" : "h-9 py-2 px-3 gap-3",
     xl: o ? "h-10 w-10 p-3" : "h-10 py-2 px-4 gap-3"
-  }, k = {
+  }, h = {
     xs: "w-4 h-4",
     sm: "w-4 h-4",
     base: "w-4 h-4",
     l: "w-4 h-4",
     xl: "w-4 h-4"
-  }, w = {
+  }, C = {
     xs: "text-xs",
     // Label Tiny - 12px
     sm: "text-sm",
@@ -41,7 +41,7 @@ const Y = ({
     // Label Small - 14px (corregido según Figma)
     xl: "text-sm"
     // Label Small - 14px (corregido según Figma)
-  }, h = {
+  }, N = {
     default: `
       bg-primary-custom-600
       text-primary-inverse-content
@@ -97,7 +97,7 @@ const Y = ({
       dark:text-dark-content-custom
       dark:hover:bg-hover-overlay-dark
     `
-  }, v = `
+  }, y = `
     inline-flex
     items-center
     justify-center
@@ -114,17 +114,17 @@ const Y = ({
     disabled:opacity-50
     disabled:cursor-not-allowed
     disabled:pointer-events-none
-  `, C = i ? "w-full" : "", N = [
-    v,
-    f[a],
-    h[t],
-    C,
+  `, w = i ? "w-full" : "", $ = [
+    y,
+    x[a],
+    N[t],
+    w,
     d
-  ].join(" ").replace(/\s+/g, " ").trim(), B = (I) => I ? /* @__PURE__ */ e("span", { className: `inline-flex items-center justify-center ${k[a]}`, children: I }) : null, R = () => o ? B(r) : /* @__PURE__ */ l(S, { children: [
+  ].join(" ").replace(/\s+/g, " ").trim(), B = (I) => I ? /* @__PURE__ */ e("span", { className: `inline-flex items-center justify-center ${h[a]}`, children: I }) : null, v = () => o ? B(r) : /* @__PURE__ */ l(z, { children: [
     r && B(r),
-    s && /* @__PURE__ */ e("span", { className: w[a], children: s }),
+    s && /* @__PURE__ */ e("span", { className: C[a], children: s }),
     n && B(n)
-  ] }), _ = {
+  ] }), j = {
     zinc: { bg: "bg-zinc-600", text: "text-white" },
     red: { bg: "bg-red-700", text: "text-white" },
     orange: { bg: "bg-orange-700", text: "text-white" },
@@ -146,7 +146,7 @@ const Y = ({
     primary: { bg: "bg-primary-custom-600", text: "text-white" },
     secondary: { bg: "bg-zinc-600", text: "text-white" },
     tertiary: { bg: "bg-zinc-600", text: "text-white" }
-  }, D = _[g] || _.red, E = () => !m && x === void 0 ? null : x !== void 0 ? /* @__PURE__ */ e(
+  }, R = j[u] || j.red, T = () => !p && f === void 0 ? null : f !== void 0 ? /* @__PURE__ */ e(
     "span",
     {
       className: `
@@ -163,12 +163,12 @@ const Y = ({
             text-[10px]
             font-bold
             leading-none
-            ${D.bg}
-            ${D.text}
+            ${R.bg}
+            ${R.text}
             pointer-events-none
           `.trim().replace(/\s+/g, " "),
-      "aria-label": `${x} notificaciones`,
-      children: x > 99 ? "99+" : x
+      "aria-label": `${f} notificaciones`,
+      children: f > 99 ? "99+" : f
     }
   ) : /* @__PURE__ */ e(
     "span",
@@ -180,7 +180,7 @@ const Y = ({
           w-2
           h-2
           rounded-full
-          ${D.bg}
+          ${R.bg}
           pointer-events-none
         `.trim().replace(/\s+/g, " "),
       "aria-label": "Notificación"
@@ -189,19 +189,19 @@ const Y = ({
   return /* @__PURE__ */ l(
     "button",
     {
-      type: u,
-      className: `${N} ${m || x !== void 0 ? "relative" : ""}`,
+      type: g,
+      className: `${$} ${p || f !== void 0 ? "relative" : ""}`,
       disabled: c,
       onClick: b,
-      "aria-label": p,
-      ...y,
+      "aria-label": m,
+      ...k,
       children: [
-        R(),
-        E()
+        v(),
+        T()
       ]
     }
   );
-}, fe = A(
+}, he = E(
   ({
     label: t,
     labelSecondary: a,
@@ -212,11 +212,11 @@ const Y = ({
     rightIcon: c,
     fullWidth: d = !1,
     className: b = "",
-    disabled: u = !1,
+    disabled: g = !1,
     id: i,
-    ...p
-  }, m) => {
-    const x = i || `input-${Math.random().toString(36).substr(2, 9)}`, g = `
+    ...m
+  }, p) => {
+    const f = i || `input-${Math.random().toString(36).substr(2, 9)}`, u = `
       w-full
       px-3
       py-1.5
@@ -236,7 +236,7 @@ const Y = ({
       dark:border-dark-border-primary
       dark:text-dark-content-primary
       dark:placeholder:text-dark-content-tertiary
-    `, y = u ? `
+    `, k = g ? `
         opacity-50
         cursor-not-allowed
         bg-bg-secondary
@@ -251,25 +251,25 @@ const Y = ({
         dark:focus:border-dark-border-custom
         dark:focus:ring-dark-border-custom
         dark:focus:ring-offset-dark-bg-primary
-      `, f = r ? `
+      `, x = r ? `
         border-error-border!
         focus:ring-error-border/30!
         focus:ring-offset-2!
         dark:border-error-border!
         dark:focus:ring-error-border/30!
         dark:focus:ring-offset-dark-bg-primary!
-      ` : "", k = d ? "w-full" : "w-[265px]", w = (h) => {
-      if (!h) return null;
-      const v = h.props.className || "";
-      return ae(h, {
-        className: `w-4 h-4 text-content-tertiary dark:text-dark-content-tertiary ${v}`
+      ` : "", h = d ? "w-full" : "w-[265px]", C = (N) => {
+      if (!N) return null;
+      const y = N.props.className || "";
+      return ae(N, {
+        className: `w-4 h-4 text-content-tertiary dark:text-dark-content-tertiary ${y}`
       });
     };
-    return /* @__PURE__ */ l("div", { className: `flex flex-col gap-2 ${k} ${b}`, children: [
+    return /* @__PURE__ */ l("div", { className: `flex flex-col gap-2 ${h} ${b}`, children: [
       t && /* @__PURE__ */ l(
         "label",
         {
-          htmlFor: x,
+          htmlFor: f,
           className: "flex items-center w-full font-bold text-sm leading-5 text-content-primary dark:text-dark-content-primary",
           children: [
             /* @__PURE__ */ e("span", { className: "flex-1", children: t }),
@@ -278,24 +278,24 @@ const Y = ({
         }
       ),
       /* @__PURE__ */ l("div", { className: "relative flex items-center", children: [
-        s && /* @__PURE__ */ e("div", { className: "absolute left-3 pointer-events-none", children: w(s) }),
+        s && /* @__PURE__ */ e("div", { className: "absolute left-3 pointer-events-none", children: C(s) }),
         /* @__PURE__ */ e(
           "input",
           {
-            ref: m,
-            id: x,
-            disabled: u,
+            ref: p,
+            id: f,
+            disabled: g,
             className: `
-              ${g}
-              ${y}
-              ${f}
+              ${u}
+              ${k}
+              ${x}
               ${s ? "pl-9" : ""}
               ${c ? "pr-9" : ""}
             `.trim().replace(/\s+/g, " "),
-            ...p
+            ...m
           }
         ),
-        c && /* @__PURE__ */ e("div", { className: "absolute right-3 pointer-events-none", children: w(c) })
+        c && /* @__PURE__ */ e("div", { className: "absolute right-3 pointer-events-none", children: C(c) })
       ] }),
       (o || n) && /* @__PURE__ */ e(
         "p",
@@ -311,8 +311,8 @@ const Y = ({
     ] });
   }
 );
-fe.displayName = "Input";
-const he = A(
+he.displayName = "Input";
+const ke = E(
   ({
     label: t,
     description: a,
@@ -323,11 +323,11 @@ const he = A(
     resize: c = "vertical",
     className: d = "",
     disabled: b = !1,
-    id: u,
+    id: g,
     rows: i = 4,
-    ...p
-  }, m) => {
-    const x = u || `textarea-${Math.random().toString(36).substr(2, 9)}`, g = `
+    ...m
+  }, p) => {
+    const f = g || `textarea-${Math.random().toString(36).substr(2, 9)}`, u = `
       w-full
       px-3
       pr-1.5
@@ -347,7 +347,7 @@ const he = A(
       dark:border-dark-border-primary
       dark:text-dark-content-primary
       dark:placeholder:text-dark-content-tertiary
-    `, y = b ? `
+    `, k = b ? `
         opacity-50
         cursor-not-allowed
         bg-bg-secondary
@@ -359,20 +359,20 @@ const he = A(
         dark:hover:border-zinc-500
         dark:focus:border-2
         dark:focus:border-dark-border-custom
-      `, f = r ? `
+      `, x = r ? `
         border-error-border!
         focus:border-2!
         focus:border-error-border!
         dark:border-error-border!
         dark:focus:border-2!
         dark:focus:border-error-border!
-      ` : "", k = c === "none" ? "resize-none" : c === "vertical" ? "resize-y" : c === "horizontal" ? "resize-x" : "resize";
+      ` : "", h = c === "none" ? "resize-none" : c === "vertical" ? "resize-y" : c === "horizontal" ? "resize-x" : "resize";
     return /* @__PURE__ */ l("div", { className: `flex flex-col gap-2 ${s ? "w-full" : "w-[312px]"} ${d}`, children: [
       (t || a) && /* @__PURE__ */ l("div", { className: "flex flex-col gap-1 w-full", children: [
         t && /* @__PURE__ */ e(
           "label",
           {
-            htmlFor: x,
+            htmlFor: f,
             className: "font-bold text-sm leading-5 text-content-primary dark:text-dark-content-primary",
             children: t
           }
@@ -382,17 +382,17 @@ const he = A(
       /* @__PURE__ */ e(
         "textarea",
         {
-          ref: m,
-          id: x,
+          ref: p,
+          id: f,
           disabled: b,
           rows: i,
           className: `
-            ${g}
-            ${y}
-            ${f}
+            ${u}
             ${k}
+            ${x}
+            ${h}
           `.trim().replace(/\s+/g, " "),
-          ...p
+          ...m
         }
       ),
       (o || n) && /* @__PURE__ */ e(
@@ -410,8 +410,8 @@ const he = A(
     ] });
   }
 );
-he.displayName = "Textarea";
-const ke = A(
+ke.displayName = "Textarea";
+const ve = E(
   ({
     label: t,
     description: a,
@@ -422,12 +422,12 @@ const ke = A(
     id: c,
     onChange: d,
     ...b
-  }, u) => {
-    const i = K(null), p = u || i, m = c || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
-    W(() => {
-      p.current && (p.current.indeterminate = r);
-    }, [r, p]);
-    const f = [
+  }, g) => {
+    const i = G(null), m = g || i, p = c || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
+    U(() => {
+      m.current && (m.current.indeterminate = r);
+    }, [r, m]);
+    const x = [
       `
       w-4
       h-4
@@ -477,9 +477,9 @@ const ke = A(
         /* @__PURE__ */ e(
           "input",
           {
-            ref: p,
+            ref: m,
             type: "checkbox",
-            id: m,
+            id: p,
             checked: o,
             disabled: n,
             onChange: d,
@@ -487,7 +487,7 @@ const ke = A(
             ...b
           }
         ),
-        /* @__PURE__ */ l("label", { htmlFor: m, className: f, children: [
+        /* @__PURE__ */ l("label", { htmlFor: p, className: x, children: [
           o && !r && /* @__PURE__ */ e(
             "svg",
             {
@@ -530,7 +530,7 @@ const ke = A(
       (t || a) && /* @__PURE__ */ l(
         "label",
         {
-          htmlFor: m,
+          htmlFor: p,
           className: `flex-1 flex flex-col gap-1 text-sm leading-5 ${n ? "cursor-not-allowed opacity-50" : "cursor-pointer"}`,
           children: [
             t && /* @__PURE__ */ e("span", { className: "font-bold text-content-primary dark:text-dark-content-primary", children: t }),
@@ -541,8 +541,8 @@ const ke = A(
     ] });
   }
 );
-ke.displayName = "Checkbox";
-const ve = A(
+ve.displayName = "Checkbox";
+const ye = E(
   ({
     label: t,
     description: a,
@@ -553,9 +553,9 @@ const ve = A(
     onChange: c,
     value: d,
     name: b,
-    ...u
+    ...g
   }, i) => {
-    const p = s || `radio-${Math.random().toString(36).substr(2, 9)}`, m = `
+    const m = s || `radio-${Math.random().toString(36).substr(2, 9)}`, p = `
       w-4
       h-4
       rounded-full
@@ -569,7 +569,7 @@ const ve = A(
       justify-center
       dark:bg-dark-bg-primary
       dark:border-dark-border-primary
-    `, x = r ? `
+    `, f = r ? `
         opacity-50
         cursor-not-allowed
       ` : `
@@ -580,7 +580,7 @@ const ve = A(
         dark:peer-hover:border-dark-border-custom
         dark:peer-focus:ring-dark-border-custom
         dark:peer-focus:border-dark-border-custom
-      `, g = o ? `
+      `, u = o ? `
         bg-primary-custom-600!
         border-primary-inverse-border!
         shadow-button-inset
@@ -594,24 +594,24 @@ const ve = A(
           {
             ref: i,
             type: "radio",
-            id: p,
+            id: m,
             checked: o,
             disabled: r,
             onChange: c,
             value: d,
             name: b,
             className: "peer sr-only",
-            ...u
+            ...g
           }
         ),
         /* @__PURE__ */ e(
           "label",
           {
-            htmlFor: p,
+            htmlFor: m,
             className: `
-              ${m}
-              ${x}
-              ${g}
+              ${p}
+              ${f}
+              ${u}
               ${r ? "cursor-not-allowed" : "cursor-pointer"}
             `.trim().replace(/\s+/g, " "),
             children: o && /* @__PURE__ */ e("div", { className: "w-1.5 h-1.5 bg-white rounded-full dark:bg-dark-content-inverse" })
@@ -621,7 +621,7 @@ const ve = A(
       (t || a) && /* @__PURE__ */ l(
         "label",
         {
-          htmlFor: p,
+          htmlFor: m,
           className: `flex-1 flex flex-col gap-1 text-sm leading-5 ${r ? "cursor-not-allowed opacity-50" : "cursor-pointer"}`,
           children: [
             t && /* @__PURE__ */ e("span", { className: "font-bold text-content-primary dark:text-dark-content-primary", children: t }),
@@ -632,8 +632,8 @@ const ve = A(
     ] });
   }
 );
-ve.displayName = "Radio";
-const ye = A(
+ye.displayName = "Radio";
+const we = E(
   ({
     label: t,
     description: a,
@@ -644,9 +644,9 @@ const ye = A(
     id: c,
     onChange: d,
     ariaLabel: b,
-    ...u
+    ...g
   }, i) => {
-    const p = c || `switch-${Math.random().toString(36).substr(2, 9)}`, m = `
+    const m = c || `switch-${Math.random().toString(36).substr(2, 9)}`, p = `
       w-8
       h-5
       rounded-xl
@@ -655,7 +655,7 @@ const ye = A(
       relative
       transition-all
       duration-200
-    `, x = () => n ? r ? `
+    `, f = () => n ? r ? `
             bg-primary-custom-600
             border-primary-inverse-border
             opacity-50
@@ -689,8 +689,8 @@ const ye = A(
           dark:border-dark-border-primary
           dark:peer-hover:border-[#b6b6b9]
           dark:peer-focus:shadow-[0px_0px_0px_2px_#dbeefe,0px_1px_2px_0px_rgba(0,0,0,0.05),0px_0px_0px_4px_#60b6fa]
-        `, g = () => {
-      const h = `
+        `, u = () => {
+      const N = `
         absolute
         w-4
         h-4
@@ -701,8 +701,8 @@ const ye = A(
         -translate-y-1/2
         transition-all
         duration-200
-      `, v = r ? "left-[13px]" : "left-px";
-      return n ? `${h} ${v} ${r ? "border-primary-inverse-border dark:border-primary-inverse-border" : "border-border-primary dark:border-dark-border-primary"}` : `${h} ${v} ${r ? `
+      `, y = r ? "left-[13px]" : "left-px";
+      return n ? `${N} ${y} ${r ? "border-primary-inverse-border dark:border-primary-inverse-border" : "border-border-primary dark:border-dark-border-primary"}` : `${N} ${y} ${r ? `
           border-primary-inverse-border
           peer-hover:border-[#307cc5]
           dark:border-primary-inverse-border
@@ -713,55 +713,55 @@ const ye = A(
           dark:border-dark-border-primary
           dark:peer-hover:border-[#b6b6b9]
         `}`;
-    }, y = [
-      m,
-      x()
-    ].join(" ").replace(/\s+/g, " ").trim(), f = g().replace(/\s+/g, " ").trim(), k = t || a ? /* @__PURE__ */ l(
+    }, k = [
+      p,
+      f()
+    ].join(" ").replace(/\s+/g, " ").trim(), x = u().replace(/\s+/g, " ").trim(), h = t || a ? /* @__PURE__ */ l(
       "label",
       {
-        htmlFor: p,
+        htmlFor: m,
         className: `flex-1 flex flex-col gap-1 text-sm leading-5 ${n ? "cursor-not-allowed opacity-50" : "cursor-pointer"}`,
         children: [
           t && /* @__PURE__ */ e("span", { className: "font-bold text-content-primary dark:text-dark-content-primary", children: t }),
           a && /* @__PURE__ */ e("span", { className: "font-normal text-content-secondary dark:text-content-secondary", children: a })
         ]
       }
-    ) : null, w = /* @__PURE__ */ l("div", { className: "flex items-center justify-center shrink-0", children: [
+    ) : null, C = /* @__PURE__ */ l("div", { className: "flex items-center justify-center shrink-0", children: [
       /* @__PURE__ */ e(
         "input",
         {
           ref: i,
           type: "checkbox",
-          id: p,
+          id: m,
           checked: r,
           disabled: n,
           onChange: d,
           className: "peer sr-only",
           "aria-label": b || t,
-          ...u
+          ...g
         }
       ),
       /* @__PURE__ */ e(
         "label",
         {
-          htmlFor: p,
-          className: y,
+          htmlFor: m,
+          className: k,
           "aria-hidden": "true",
-          children: /* @__PURE__ */ e("div", { className: f })
+          children: /* @__PURE__ */ e("div", { className: x })
         }
       )
     ] });
-    return /* @__PURE__ */ e("div", { className: `flex gap-2 items-center w-[344px] ${s}`, children: o === "leading" ? /* @__PURE__ */ l(S, { children: [
-      k,
-      w
-    ] }) : /* @__PURE__ */ l(S, { children: [
-      w,
-      k
+    return /* @__PURE__ */ e("div", { className: `flex gap-2 items-center w-[344px] ${s}`, children: o === "leading" ? /* @__PURE__ */ l(z, { children: [
+      h,
+      C
+    ] }) : /* @__PURE__ */ l(z, { children: [
+      C,
+      h
     ] }) });
   }
 );
-ye.displayName = "Switch";
-const we = A(
+we.displayName = "Switch";
+const Ce = E(
   ({
     size: t = "10",
     type: a = "circular",
@@ -776,7 +776,7 @@ const we = A(
       6: "w-6 h-6",
       8: "w-8 h-8",
       10: "w-10 h-10"
-    }, u = {
+    }, g = {
       4: "text-xs",
       // 12px - Paragraph Tiny
       6: "text-xs",
@@ -788,7 +788,7 @@ const we = A(
     }, i = {
       circular: "rounded-full",
       rounded: "rounded-md"
-    }, p = `
+    }, m = `
       relative
       inline-flex
       items-center
@@ -801,7 +801,7 @@ const we = A(
       "div",
       {
         ref: d,
-        className: `${p} ${s}`.trim().replace(/\s+/g, " "),
+        className: `${m} ${s}`.trim().replace(/\s+/g, " "),
         children: /* @__PURE__ */ e(
           "img",
           {
@@ -817,8 +817,8 @@ const we = A(
       {
         ref: d,
         className: `
-            ${p}
-            ${u[t]}
+            ${m}
+            ${g[t]}
             bg-content-primary
             text-white
             font-normal
@@ -833,7 +833,7 @@ const we = A(
       {
         ref: d,
         className: `
-          ${p}
+          ${m}
           bg-background-secondary
           dark:bg-dark-bg-primary
           ${s}
@@ -842,8 +842,8 @@ const we = A(
     );
   }
 );
-we.displayName = "Avatar";
-const Ce = A(
+Ce.displayName = "Avatar";
+const Ne = E(
   ({
     type: t = "default",
     className: a = "",
@@ -873,8 +873,8 @@ const Ce = A(
     );
   }
 );
-Ce.displayName = "Divider";
-const Ne = A(
+Ne.displayName = "Divider";
+const $e = E(
   ({
     term: t,
     details: a,
@@ -897,8 +897,8 @@ const Ne = A(
     ] });
   }
 );
-Ne.displayName = "DescriptionList";
-const $e = A(
+$e.displayName = "DescriptionList";
+const je = E(
   ({
     title: t,
     description: a,
@@ -909,9 +909,9 @@ const $e = A(
     cancelText: c = "Cancelar",
     confirmText: d = "Confirmar",
     className: b = "",
-    ...u
+    ...g
   }, i) => {
-    const p = r || /* @__PURE__ */ l(S, { children: [
+    const m = r || /* @__PURE__ */ l(z, { children: [
       n && /* @__PURE__ */ e(Y, { type: "plain", size: "base", onClick: n, children: c }),
       s && /* @__PURE__ */ e(Y, { type: "default", size: "base", onClick: s, children: d })
     ] });
@@ -929,21 +929,21 @@ const $e = A(
           rounded-xl
           ${b}
         `.trim().replace(/\s+/g, " "),
-        ...u,
+        ...g,
         children: /* @__PURE__ */ l("div", { className: "p-6 flex flex-col gap-4", children: [
           /* @__PURE__ */ l("div", { className: "flex flex-col gap-3", children: [
             /* @__PURE__ */ e("p", { className: "text-sm leading-5 font-bold text-content-primary dark:text-dark-content-primary", children: t }),
             a && /* @__PURE__ */ e("p", { className: "text-sm leading-5 font-normal text-content-tertiary dark:text-content-tertiary", children: a })
           ] }),
           o && /* @__PURE__ */ e("div", { className: "flex flex-col gap-3", children: o }),
-          /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-3 items-center justify-end", children: p })
+          /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-3 items-center justify-end", children: m })
         ] })
       }
     );
   }
 );
-$e.displayName = "Alert";
-const G = A(
+je.displayName = "Alert";
+const K = E(
   ({
     color: t = "zinc",
     leftIcon: a,
@@ -1100,10 +1100,10 @@ const G = A(
         notificationBg: "bg-zinc-600",
         notificationText: "text-zinc-100"
       }
-    }[t], u = (p) => {
-      const m = p.props.className || "";
-      return ae(p, {
-        className: `w-3 h-3 ${m}`.trim()
+    }[t], g = (m) => {
+      const p = m.props.className || "";
+      return ae(m, {
+        className: `w-3 h-3 ${p}`.trim()
       });
     }, i = [
       "inline-flex",
@@ -1126,7 +1126,7 @@ const G = A(
         className: i,
         ...s,
         children: [
-          a && /* @__PURE__ */ e("div", { className: `flex items-center justify-center ${b.text}`, children: u(a) }),
+          a && /* @__PURE__ */ e("div", { className: `flex items-center justify-center ${b.text}`, children: g(a) }),
           /* @__PURE__ */ e("span", { className: `font-sans text-xs leading-4 ${b.text}`, children: o }),
           r !== void 0 && /* @__PURE__ */ e(
             "div",
@@ -1149,8 +1149,8 @@ const G = A(
     );
   }
 );
-G.displayName = "Badge";
-const ne = A(
+K.displayName = "Badge";
+const ne = E(
   ({
     value: t,
     defaultValue: a = 0,
@@ -1161,23 +1161,23 @@ const ne = A(
     linkText: c,
     onLinkClick: d,
     helperText: b,
-    error: u = !1,
+    error: g = !1,
     disabled: i = !1,
-    className: p = "",
-    ...m
-  }, x) => {
-    const [g, y] = V(a), f = t !== void 0, k = f ? t : g;
-    W(() => {
-      f || y(a);
-    }, [a, f]);
-    const w = (I) => {
-      let z = I;
-      r !== void 0 && z < r && (z = r), n !== void 0 && z > n && (z = n), f || y(z), o?.(z);
-    }, h = () => {
-      i || w(k - 1);
-    }, v = () => {
-      i || w(k + 1);
-    }, C = i || r !== void 0 && k <= r, N = i || n !== void 0 && k >= n, B = () => /* @__PURE__ */ e(
+    className: m = "",
+    ...p
+  }, f) => {
+    const [u, k] = H(a), x = t !== void 0, h = x ? t : u;
+    U(() => {
+      x || k(a);
+    }, [a, x]);
+    const C = (I) => {
+      let D = I;
+      r !== void 0 && D < r && (D = r), n !== void 0 && D > n && (D = n), x || k(D), o?.(D);
+    }, N = () => {
+      i || C(h - 1);
+    }, y = () => {
+      i || C(h + 1);
+    }, w = i || r !== void 0 && h <= r, $ = i || n !== void 0 && h >= n, B = () => /* @__PURE__ */ e(
       "svg",
       {
         width: "16",
@@ -1196,7 +1196,7 @@ const ne = A(
           }
         )
       }
-    ), R = () => /* @__PURE__ */ e(
+    ), v = () => /* @__PURE__ */ e(
       "svg",
       {
         width: "16",
@@ -1215,13 +1215,13 @@ const ne = A(
           }
         )
       }
-    ), _ = u ? "border-error-border dark:border-error-border" : "border-border-primary dark:border-dark-border-primary", D = !i && !u ? "hover:border-[#f9f9f9] dark:hover:border-[#f9f9f9]" : "", E = !i && !u ? "focus-within:border-2 focus-within:border-[#329cff] dark:focus-within:border-[#329cff]" : "";
+    ), j = g ? "border-error-border dark:border-error-border" : "border-border-primary dark:border-dark-border-primary", R = !i && !g ? "hover:border-[#f9f9f9] dark:hover:border-[#f9f9f9]" : "", T = !i && !g ? "focus-within:border-2 focus-within:border-[#329cff] dark:focus-within:border-[#329cff]" : "";
     return /* @__PURE__ */ l(
       "div",
       {
-        ref: x,
-        className: `flex flex-col gap-2 ${p}`.trim(),
-        ...m,
+        ref: f,
+        className: `flex flex-col gap-2 ${m}`.trim(),
+        ...p,
         children: [
           s && /* @__PURE__ */ l("div", { className: "flex items-center justify-between", children: [
             /* @__PURE__ */ e("label", { className: "text-sm leading-5 font-bold text-content-primary dark:text-dark-content-primary", children: s }),
@@ -1256,9 +1256,9 @@ const ne = A(
             bg-white
             dark:bg-dark-bg-primary
             border
-            ${_}
-            ${D}
-            ${E}
+            ${j}
+            ${R}
+            ${T}
             rounded-lg
             transition-colors
             duration-200
@@ -1269,15 +1269,15 @@ const ne = A(
                   "button",
                   {
                     type: "button",
-                    onClick: h,
-                    disabled: C,
+                    onClick: N,
+                    disabled: w,
                     className: `
               flex
               items-center
               justify-center
               w-4
               h-4
-              ${C ? "text-content-tertiary dark:text-content-tertiary cursor-not-allowed" : "text-content-primary dark:text-dark-content-primary hover:text-content-secondary dark:hover:text-content-secondary cursor-pointer"}
+              ${w ? "text-content-tertiary dark:text-content-tertiary cursor-not-allowed" : "text-content-primary dark:text-dark-content-primary hover:text-content-secondary dark:hover:text-content-secondary cursor-pointer"}
               transition-colors
               duration-200
             `.trim().replace(/\s+/g, " "),
@@ -1290,29 +1290,29 @@ const ne = A(
                   {
                     className: `
                 text-base leading-6
-                ${k === 0 ? "text-content-tertiary dark:text-content-tertiary" : "text-content-primary dark:text-dark-content-primary"}
+                ${h === 0 ? "text-content-tertiary dark:text-content-tertiary" : "text-content-primary dark:text-dark-content-primary"}
               `.trim().replace(/\s+/g, " "),
-                    children: k
+                    children: h
                   }
                 ) }),
                 /* @__PURE__ */ e(
                   "button",
                   {
                     type: "button",
-                    onClick: v,
-                    disabled: N,
+                    onClick: y,
+                    disabled: $,
                     className: `
               flex
               items-center
               justify-center
               w-4
               h-4
-              ${N ? "text-content-tertiary dark:text-content-tertiary cursor-not-allowed" : "text-content-primary dark:text-dark-content-primary hover:text-content-secondary dark:hover:text-content-secondary cursor-pointer"}
+              ${$ ? "text-content-tertiary dark:text-content-tertiary cursor-not-allowed" : "text-content-primary dark:text-dark-content-primary hover:text-content-secondary dark:hover:text-content-secondary cursor-pointer"}
               transition-colors
               duration-200
             `.trim().replace(/\s+/g, " "),
                     "aria-label": "Incrementar",
-                    children: /* @__PURE__ */ e(R, {})
+                    children: /* @__PURE__ */ e(v, {})
                   }
                 )
               ]
@@ -1323,7 +1323,7 @@ const ne = A(
             {
               className: `
               text-sm leading-5
-              ${u ? "text-error-content dark:text-error-content" : "text-content-tertiary dark:text-content-tertiary"}
+              ${g ? "text-error-content dark:text-error-content" : "text-content-tertiary dark:text-content-tertiary"}
             `.trim().replace(/\s+/g, " "),
               children: b
             }
@@ -1334,7 +1334,7 @@ const ne = A(
   }
 );
 ne.displayName = "Quantity";
-const je = () => /* @__PURE__ */ e(
+const Be = () => /* @__PURE__ */ e(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -1350,7 +1350,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), or = ({
+), sr = ({
   variant: t = "default",
   children: a,
   items: o,
@@ -1360,33 +1360,37 @@ const je = () => /* @__PURE__ */ e(
   className: c = "",
   menuClassName: d = "",
   ariaLabel: b,
-  placeholder: u = "Options"
+  placeholder: g = "Options"
 }) => {
-  const [i, p] = V(!1), m = K(null), x = r !== void 0, g = x ? r : i, y = () => {
+  const [i, m] = H(!1), [p, f] = H("bottom-left"), u = G(null), k = G(null), x = r !== void 0, h = x ? r : i, C = ge(() => {
+    if (!u.current) return;
+    const v = u.current.getBoundingClientRect(), j = window.innerWidth, R = window.innerHeight, T = 200, I = 250, D = R - v.bottom, F = v.top, _ = j - v.left, S = v.right, Z = D < I && F > D, V = _ < T && S > _;
+    f(Z && V ? "top-right" : Z ? "top-left" : V ? "bottom-right" : "bottom-left");
+  }, []), N = () => {
     if (s) return;
-    const h = !g;
-    x || p(h), n?.(h);
+    const v = !h;
+    v && C(), x || m(v), n?.(v);
   };
-  W(() => {
-    const h = (v) => {
-      m.current && !m.current.contains(v.target) && (x || p(!1), n?.(!1));
+  U(() => {
+    const v = (j) => {
+      u.current && !u.current.contains(j.target) && (x || m(!1), n?.(!1));
     };
-    if (g)
-      return document.addEventListener("mousedown", h), () => {
-        document.removeEventListener("mousedown", h);
+    if (h)
+      return document.addEventListener("mousedown", v), () => {
+        document.removeEventListener("mousedown", v);
       };
-  }, [g, x, n]), W(() => {
-    const h = (v) => {
-      v.key === "Escape" && g && (x || p(!1), n?.(!1));
+  }, [h, x, n]), U(() => {
+    const v = (j) => {
+      j.key === "Escape" && h && (x || m(!1), n?.(!1));
     };
-    if (g)
-      return document.addEventListener("keydown", h), () => {
-        document.removeEventListener("keydown", h);
+    if (h)
+      return document.addEventListener("keydown", v), () => {
+        document.removeEventListener("keydown", v);
       };
-  }, [g, x, n]);
-  const f = (h) => {
-    h.disabled || h.isDivider || h.isHeading || (h.onClick && h.onClick({}), x || p(!1), n?.(!1));
-  }, k = [
+  }, [h, x, n]);
+  const y = (v) => {
+    v.disabled || v.isDivider || v.isHeading || (v.onClick && v.onClick({}), x || m(!1), n?.(!1));
+  }, w = [
     // Base
     "inline-flex",
     "items-center",
@@ -1408,9 +1412,9 @@ const je = () => /* @__PURE__ */ e(
     "active:scale-95",
     // Dark Mode
     "dark:bg-dark-bg-primary",
-    "dark:text-content-secondary",
+    "dark:text-dark-content-primary",
     "dark:border-dark-border-primary",
-    "dark:hover:bg-dark-bg-primary",
+    "dark:hover:bg-dark-bg-secondary",
     // Focus ring
     "focus:outline-hidden",
     "focus:ring-2",
@@ -1424,12 +1428,15 @@ const je = () => /* @__PURE__ */ e(
     s && "pointer-events-none",
     // Custom classes
     c
-  ].filter(Boolean).join(" ").replace(/\s+/g, " ").trim(), w = [
+  ].filter(Boolean).join(" ").replace(/\s+/g, " ").trim(), B = [
     // Base
     "absolute",
-    "top-full",
-    "left-0",
-    "mt-2",
+    {
+      "bottom-left": "top-full left-0 mt-2",
+      "bottom-right": "top-full right-0 mt-2",
+      "top-left": "bottom-full left-0 mb-2",
+      "top-right": "bottom-full right-0 mb-2"
+    }[p],
     "min-w-[182px]",
     "rounded-xl",
     "p-1",
@@ -1446,33 +1453,33 @@ const je = () => /* @__PURE__ */ e(
     // Custom classes
     d
   ].filter(Boolean).join(" ").replace(/\s+/g, " ").trim();
-  return /* @__PURE__ */ l("div", { ref: m, className: "relative inline-block", children: [
+  return /* @__PURE__ */ l("div", { ref: u, className: "relative inline-block", children: [
     /* @__PURE__ */ l(
       "button",
       {
         type: "button",
-        className: k,
-        onClick: y,
+        className: w,
+        onClick: N,
         disabled: s,
         "aria-label": b || (t === "icon-only" ? "Abrir menú" : void 0),
         "aria-haspopup": "true",
-        "aria-expanded": g,
+        "aria-expanded": h,
         children: [
-          t === "default" && /* @__PURE__ */ e("span", { children: a || u }),
-          /* @__PURE__ */ e(je, {})
+          t === "default" && /* @__PURE__ */ e("span", { children: a || g }),
+          /* @__PURE__ */ e(Be, {})
         ]
       }
     ),
-    g && /* @__PURE__ */ e("div", { className: w, children: o.map((h, v) => h.isDivider ? /* @__PURE__ */ e(_e, { className: h.className }, v) : h.isHeading ? /* @__PURE__ */ e(Le, { className: h.className, children: h.children }, v) : /* @__PURE__ */ e(
-      Be,
+    h && /* @__PURE__ */ e("div", { ref: k, className: B, children: o.map((v, j) => v.isDivider ? /* @__PURE__ */ e(Me, { className: v.className }, j) : v.isHeading ? /* @__PURE__ */ e(_e, { className: v.className, children: v.children }, j) : /* @__PURE__ */ e(
+      Le,
       {
-        ...h,
-        onClick: () => f(h)
+        ...v,
+        onClick: () => y(v)
       },
-      v
+      j
     )) })
   ] });
-}, Be = ({
+}, Le = ({
   children: t,
   icon: a,
   description: o,
@@ -1497,12 +1504,12 @@ const je = () => /* @__PURE__ */ e(
     "duration-150",
     // Colores y estados (Light Mode)
     "text-content-primary",
-    !n && "hover:bg-white",
-    s && "bg-white",
+    !n && "hover:bg-bg-primary",
+    s && "bg-bg-primary",
     // Dark Mode
     "dark:text-dark-content-primary",
-    !n && "dark:hover:bg-dark-bg-primary",
-    s && "dark:bg-dark-bg-primary",
+    !n && "dark:hover:bg-dark-bg-secondary",
+    s && "dark:bg-dark-bg-secondary",
     // Disabled
     n && "opacity-50",
     n && "cursor-not-allowed",
@@ -1518,16 +1525,16 @@ const je = () => /* @__PURE__ */ e(
       onClick: c,
       disabled: n,
       children: [
-        a && /* @__PURE__ */ e("span", { className: "inline-flex items-center justify-center w-4 h-4 text-content-secondary dark:text-content-secondary", children: a }),
+        a && /* @__PURE__ */ e("span", { className: "inline-flex items-center justify-center w-4 h-4 text-content-secondary dark:text-dark-content-secondary", children: a }),
         /* @__PURE__ */ l("div", { className: "flex-1 min-w-0", children: [
           /* @__PURE__ */ e("div", { className: "text-content-primary dark:text-dark-content-primary", children: t }),
-          o && /* @__PURE__ */ e("div", { className: "text-xs text-content-secondary dark:text-content-secondary mt-0.5", children: o })
+          o && /* @__PURE__ */ e("div", { className: "text-xs text-content-secondary dark:text-dark-content-secondary mt-0.5", children: o })
         ] }),
-        r && /* @__PURE__ */ e("span", { className: "text-xs text-content-secondary dark:text-content-secondary ml-auto whitespace-nowrap", children: r })
+        r && /* @__PURE__ */ e("span", { className: "text-xs text-content-secondary dark:text-dark-content-secondary ml-auto whitespace-nowrap", children: r })
       ]
     }
   );
-}, Le = ({
+}, _e = ({
   children: t,
   className: a = ""
 }) => {
@@ -1540,12 +1547,12 @@ const je = () => /* @__PURE__ */ e(
     // Colores
     "text-content-tertiary",
     // Dark Mode
-    "dark:text-content-tertiary",
+    "dark:text-dark-content-tertiary",
     // Custom classes
     a
   ].filter(Boolean).join(" ").replace(/\s+/g, " ").trim();
   return /* @__PURE__ */ e("div", { className: o, children: t });
-}, _e = ({
+}, Me = ({
   className: t = ""
 }) => {
   const a = [
@@ -1556,7 +1563,7 @@ const je = () => /* @__PURE__ */ e(
     t
   ].filter(Boolean).join(" ").replace(/\s+/g, " ").trim();
   return /* @__PURE__ */ e("div", { className: a, children: /* @__PURE__ */ e("div", { className: "h-px bg-border-primary dark:bg-dark-border-primary" }) });
-}, sr = ({
+}, ir = ({
   count: t,
   color: a = "red",
   className: o = "",
@@ -1631,7 +1638,7 @@ const je = () => /* @__PURE__ */ e(
       "aria-label": c
     }
   );
-}, Me = ({ className: t = "" }) => /* @__PURE__ */ e(
+}, Se = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     className: t,
@@ -1648,7 +1655,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Se = ({ className: t = "" }) => /* @__PURE__ */ e(
+), Ie = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     className: t,
@@ -1665,7 +1672,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), ir = ({
+), lr = ({
   currentPage: t = 1,
   totalPages: a,
   onPageChange: o,
@@ -1675,42 +1682,42 @@ const je = () => /* @__PURE__ */ e(
   showBackButton: c = !0,
   showNextButton: d = !0,
   className: b = "",
-  ariaLabel: u = "Paginación"
+  ariaLabel: g = "Paginación"
 }) => {
-  const i = ge(() => {
-    const y = s * 2 + 3 + 2;
-    if (a <= y)
-      return Array.from({ length: a }, (N, B) => B + 1);
-    const f = Math.max(t - s, 1), k = Math.min(t + s, a), w = f > 2, h = k < a - 1, v = 1, C = a;
-    if (!w && h) {
-      const N = 3 + 2 * s;
-      return [...Array.from({ length: N }, (R, _) => _ + 1), "...", a];
+  const i = ue(() => {
+    const k = s * 2 + 3 + 2;
+    if (a <= k)
+      return Array.from({ length: a }, ($, B) => B + 1);
+    const x = Math.max(t - s, 1), h = Math.min(t + s, a), C = x > 2, N = h < a - 1, y = 1, w = a;
+    if (!C && N) {
+      const $ = 3 + 2 * s;
+      return [...Array.from({ length: $ }, (v, j) => j + 1), "...", a];
     }
-    if (w && !h) {
-      const N = 3 + 2 * s, B = Array.from(
-        { length: N },
-        (R, _) => a - N + _ + 1
+    if (C && !N) {
+      const $ = 3 + 2 * s, B = Array.from(
+        { length: $ },
+        (v, j) => a - $ + j + 1
       );
-      return [v, "...", ...B];
+      return [y, "...", ...B];
     }
-    if (w && h) {
-      const N = Array.from(
-        { length: k - f + 1 },
-        (B, R) => f + R
+    if (C && N) {
+      const $ = Array.from(
+        { length: h - x + 1 },
+        (B, v) => x + v
       );
-      return [v, "...", ...N, "...", C];
+      return [y, "...", ...$, "...", w];
     }
     return [];
-  }, [t, a, s]), p = (g) => {
-    g >= 1 && g <= a && g !== t && o?.(g);
-  }, m = ({
-    page: g,
-    isActive: y = !1,
-    disabled: f = !1,
-    onClick: k,
-    ariaLabel: w
+  }, [t, a, s]), m = (u) => {
+    u >= 1 && u <= a && u !== t && o?.(u);
+  }, p = ({
+    page: u,
+    isActive: k = !1,
+    disabled: x = !1,
+    onClick: h,
+    ariaLabel: C
   }) => {
-    const h = g === "...", B = [`
+    const N = u === "...", B = [`
       inline-flex
       items-center
       justify-center
@@ -1723,12 +1730,12 @@ const je = () => /* @__PURE__ */ e(
       whitespace-nowrap
       transition-all
       duration-150
-    `, h ? `
+    `, N ? `
           text-primary-custom-600
           dark:text-primary-custom-600
           cursor-default
           pointer-events-none
-        ` : y ? `
+        ` : k ? `
           bg-primary-custom-100
           text-primary-custom-600
           dark:bg-primary-custom-100
@@ -1740,7 +1747,7 @@ const je = () => /* @__PURE__ */ e(
           dark:text-primary-custom-600
           dark:hover:bg-primary-custom-100
           dark:active:scale-95
-        `, f ? `
+        `, x ? `
           opacity-50
           cursor-not-allowed
           pointer-events-none
@@ -1750,21 +1757,21 @@ const je = () => /* @__PURE__ */ e(
       {
         type: "button",
         className: B,
-        onClick: k,
-        disabled: f || h,
-        "aria-label": w,
-        "aria-current": y ? "page" : void 0,
-        children: g
+        onClick: h,
+        disabled: x || N,
+        "aria-label": C,
+        "aria-current": k ? "page" : void 0,
+        children: u
       }
     );
-  }, x = `
+  }, f = `
     inline-flex
     items-center
     justify-between
     gap-0
     ${b}
   `.replace(/\s+/g, " ").trim();
-  return /* @__PURE__ */ l("nav", { className: x, "aria-label": u, role: "navigation", children: [
+  return /* @__PURE__ */ l("nav", { className: f, "aria-label": g, role: "navigation", children: [
     c && /* @__PURE__ */ l(
       "button",
       {
@@ -1789,24 +1796,24 @@ const je = () => /* @__PURE__ */ e(
             duration-150
             ${t === 1 ? "opacity-50 cursor-not-allowed pointer-events-none" : ""}
           `.replace(/\s+/g, " ").trim(),
-        onClick: () => p(t - 1),
+        onClick: () => m(t - 1),
         disabled: t === 1,
         "aria-label": `${r} page`,
         children: [
-          /* @__PURE__ */ e(Me, { className: "w-4 h-4" }),
+          /* @__PURE__ */ e(Se, { className: "w-4 h-4" }),
           r
         ]
       }
     ),
-    /* @__PURE__ */ e("div", { className: "inline-flex items-center", children: i.map((g, y) => /* @__PURE__ */ e(
-      m,
+    /* @__PURE__ */ e("div", { className: "inline-flex items-center", children: i.map((u, k) => /* @__PURE__ */ e(
+      p,
       {
-        page: g,
-        isActive: g === t,
-        onClick: () => typeof g == "number" && p(g),
-        ariaLabel: typeof g == "number" ? `Go to page ${g}` : `Page ${g}`
+        page: u,
+        isActive: u === t,
+        onClick: () => typeof u == "number" && m(u),
+        ariaLabel: typeof u == "number" ? `Go to page ${u}` : `Page ${u}`
       },
-      `${g}-${y}`
+      `${u}-${k}`
     )) }),
     d && /* @__PURE__ */ l(
       "button",
@@ -1832,17 +1839,17 @@ const je = () => /* @__PURE__ */ e(
             duration-150
             ${t === a ? "opacity-50 cursor-not-allowed pointer-events-none" : ""}
           `.replace(/\s+/g, " ").trim(),
-        onClick: () => p(t + 1),
+        onClick: () => m(t + 1),
         disabled: t === a,
         "aria-label": `${n} page`,
         children: [
           n,
-          /* @__PURE__ */ e(Se, { className: "w-4 h-4" })
+          /* @__PURE__ */ e(Ie, { className: "w-4 h-4" })
         ]
       }
     )
   ] });
-}, Ie = ({ className: t = "" }) => /* @__PURE__ */ l(
+}, Re = ({ className: t = "" }) => /* @__PURE__ */ l(
   "svg",
   {
     className: t,
@@ -1869,7 +1876,7 @@ const je = () => /* @__PURE__ */ e(
       )
     ]
   }
-), Re = ({ className: t = "" }) => /* @__PURE__ */ e(
+), De = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     className: t,
@@ -1886,7 +1893,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), lr = ({
+), cr = ({
   options: t = [],
   value: a,
   defaultValue: o,
@@ -1896,62 +1903,62 @@ const je = () => /* @__PURE__ */ e(
   label: c,
   description: d,
   showLabel: b = !0,
-  showDescription: u = !0,
+  showDescription: g = !0,
   menuHeader: i,
-  onChange: p,
-  className: m = "",
-  triggerClassName: x = "",
-  menuClassName: g = "",
-  ariaLabel: y,
-  id: f,
-  name: k,
-  required: w = !1,
-  menuPosition: h = "bottom",
-  fullWidth: v = !1
+  onChange: m,
+  className: p = "",
+  triggerClassName: f = "",
+  menuClassName: u = "",
+  ariaLabel: k,
+  id: x,
+  name: h,
+  required: C = !1,
+  menuPosition: N = "bottom",
+  fullWidth: y = !1
 }) => {
-  const [C, N] = V(!1), [B, R] = V(
+  const [w, $] = H(!1), [B, v] = H(
     a !== void 0 ? a : o
-  ), [_, D] = V(-1), E = K(null), I = K(null), z = K(null);
-  W(() => {
-    a !== void 0 && R(a);
-  }, [a]), W(() => {
-    const j = (T) => {
-      E.current && !E.current.contains(T.target) && N(!1);
+  ), [j, R] = H(-1), T = G(null), I = G(null), D = G(null);
+  U(() => {
+    a !== void 0 && v(a);
+  }, [a]), U(() => {
+    const M = (A) => {
+      T.current && !T.current.contains(A.target) && $(!1);
     };
-    if (C)
-      return document.addEventListener("mousedown", j), () => {
-        document.removeEventListener("mousedown", j);
+    if (w)
+      return document.addEventListener("mousedown", M), () => {
+        document.removeEventListener("mousedown", M);
       };
-  }, [C]), W(() => {
-    const j = (T) => {
-      if (C)
-        switch (T.key) {
+  }, [w]), U(() => {
+    const M = (A) => {
+      if (w)
+        switch (A.key) {
           case "Escape":
-            N(!1), I.current?.focus();
+            $(!1), I.current?.focus();
             break;
           case "ArrowDown":
-            T.preventDefault(), D((F) => F < t.length - 1 ? F + 1 : 0);
+            A.preventDefault(), R((P) => P < t.length - 1 ? P + 1 : 0);
             break;
           case "ArrowUp":
-            T.preventDefault(), D((F) => F > 0 ? F - 1 : t.length - 1);
+            A.preventDefault(), R((P) => P > 0 ? P - 1 : t.length - 1);
             break;
           case "Enter":
-            T.preventDefault(), _ >= 0 && _ < t.length && M(t[_]);
+            A.preventDefault(), j >= 0 && j < t.length && S(t[j]);
             break;
         }
     };
-    if (C)
-      return document.addEventListener("keydown", j), () => {
-        document.removeEventListener("keydown", j);
+    if (w)
+      return document.addEventListener("keydown", M), () => {
+        document.removeEventListener("keydown", M);
       };
-  }, [C, _, t]);
-  const P = t.find((j) => j.value === B), L = () => {
-    n || (N(!C), D(-1));
-  }, M = (j) => {
-    j.disabled || (R(j.value), N(!1), p?.(j.value), setTimeout(() => {
+  }, [w, j, t]);
+  const F = t.find((M) => M.value === B), _ = () => {
+    n || ($(!w), R(-1));
+  }, S = (M) => {
+    M.disabled || (v(M.value), $(!1), m?.(M.value), setTimeout(() => {
       I.current?.focus();
     }, 0));
-  }, Z = [
+  }, W = [
     `
     inline-flex
     items-center
@@ -1968,7 +1975,7 @@ const je = () => /* @__PURE__ */ e(
     transition-all
     duration-150
   `,
-    v ? "w-full" : "min-w-[200px]",
+    y ? "w-full" : "min-w-[200px]",
     s ? `
       border-error-border
       bg-error-bg
@@ -2002,7 +2009,7 @@ const je = () => /* @__PURE__ */ e(
       opacity-50
       cursor-not-allowed
     ` : "",
-    x
+    f
   ].join(" ").replace(/\s+/g, " ").trim(), se = [
     `
     absolute
@@ -2017,13 +2024,13 @@ const je = () => /* @__PURE__ */ e(
     transition-all
     duration-150
   `,
-    h === "top" ? "bottom-full mb-1" : "top-full mt-1",
+    N === "top" ? "bottom-full mb-1" : "top-full mt-1",
     `
     bg-background-secondary
     dark:bg-dark-bg-primary
   `,
-    C ? "opacity-100 visible" : "opacity-0 invisible",
-    g
+    w ? "opacity-100 visible" : "opacity-0 invisible",
+    u
   ].join(" ").replace(/\s+/g, " ").trim(), ie = `
     flex
     items-center
@@ -2038,86 +2045,86 @@ const je = () => /* @__PURE__ */ e(
     text-[10px]
     leading-[12px]
     font-bold
-  `, le = (j, T) => {
-    const F = j.value === B, J = T === _, be = F && !J ? "text-content-primary dark:text-dark-content-primary" : J || F && J ? "bg-primary-custom-600 text-primary-inverse-content dark:bg-primary-custom-600 dark:text-primary-inverse-content" : "text-content-primary dark:text-dark-content-primary", me = j.disabled ? "" : "hover:bg-primary-custom-600 hover:text-primary-inverse-content dark:hover:bg-primary-custom-600 dark:hover:text-primary-inverse-content", pe = j.disabled ? "opacity-50 cursor-not-allowed" : "";
+  `, le = (M, A) => {
+    const P = M.value === B, J = A === j, be = P && !J ? "text-content-primary dark:text-dark-content-primary" : J || P && J ? "bg-primary-custom-600 text-primary-inverse-content dark:bg-primary-custom-600 dark:text-primary-inverse-content" : "text-content-primary dark:text-dark-content-primary", me = M.disabled ? "" : "hover:bg-primary-custom-600 hover:text-primary-inverse-content dark:hover:bg-primary-custom-600 dark:hover:text-primary-inverse-content", pe = M.disabled ? "opacity-50 cursor-not-allowed" : "";
     return [ie, be, me, pe].join(" ").replace(/\s+/g, " ").trim();
   }, ce = [
     "shrink-0",
     "transition-transform",
     "duration-150",
-    C && "rotate-180",
+    w && "rotate-180",
     n ? "text-content-tertiary dark:text-content-tertiary" : "text-content-secondary dark:text-content-secondary"
   ].filter(Boolean).join(" ").replace(/\s+/g, " ").trim(), de = "shrink-0 w-4 h-4";
-  return /* @__PURE__ */ l("div", { className: `relative ${v ? "w-full" : ""} ${m}`, ref: E, children: [
-    b && c || u && d ? /* @__PURE__ */ l("div", { className: "flex flex-col gap-1 mb-1 w-full", children: [
+  return /* @__PURE__ */ l("div", { className: `relative ${y ? "w-full" : ""} ${p}`, ref: T, children: [
+    b && c || g && d ? /* @__PURE__ */ l("div", { className: "flex flex-col gap-1 mb-1 w-full", children: [
       b && c && /* @__PURE__ */ l(
         "label",
         {
-          htmlFor: f,
+          htmlFor: x,
           className: "text-sm font-bold leading-5 text-content-primary dark:text-dark-content-primary",
           children: [
             c,
-            w && /* @__PURE__ */ e("span", { className: "ml-1 text-error-content", children: "*" })
+            C && /* @__PURE__ */ e("span", { className: "ml-1 text-error-content", children: "*" })
           ]
         }
       ),
-      u && d && /* @__PURE__ */ e("p", { className: "text-sm font-normal leading-5 text-content-tertiary dark:text-content-tertiary", children: d })
+      g && d && /* @__PURE__ */ e("p", { className: "text-sm font-normal leading-5 text-content-tertiary dark:text-content-tertiary", children: d })
     ] }) : null,
     /* @__PURE__ */ l(
       "button",
       {
         ref: I,
         type: "button",
-        className: Z,
-        onClick: L,
+        className: W,
+        onClick: _,
         disabled: n,
-        "aria-label": y || c,
+        "aria-label": k || c,
         "aria-haspopup": "listbox",
-        "aria-expanded": C,
-        id: f,
+        "aria-expanded": w,
+        id: x,
         children: [
           /* @__PURE__ */ e(
             "span",
             {
-              className: P ? "" : "text-content-secondary dark:text-content-secondary",
-              children: P ? P.label : r
+              className: F ? "" : "text-content-secondary dark:text-content-secondary",
+              children: F ? F.label : r
             }
           ),
-          /* @__PURE__ */ e(Ie, { className: ce })
+          /* @__PURE__ */ e(Re, { className: ce })
         ]
       }
     ),
-    k && /* @__PURE__ */ e(
+    h && /* @__PURE__ */ e(
       "input",
       {
         type: "hidden",
-        name: k,
+        name: h,
         value: B !== void 0 ? String(B) : ""
       }
     ),
-    C && /* @__PURE__ */ l("div", { ref: z, className: se, role: "listbox", children: [
+    w && /* @__PURE__ */ l("div", { ref: D, className: se, role: "listbox", children: [
       i && /* @__PURE__ */ e("div", { className: "flex items-center gap-0.5 px-6 py-0.5 rounded-[5px]", children: /* @__PURE__ */ e("span", { className: "text-[10px] font-bold leading-[12px] text-content-tertiary dark:text-content-tertiary", children: i }) }),
       t.length === 0 && /* @__PURE__ */ e("div", { className: "px-2 py-1.5 text-[10px] leading-[12px] text-content-secondary dark:text-content-secondary", children: "No hay opciones disponibles" }),
-      t.map((j, T) => /* @__PURE__ */ l(
+      t.map((M, A) => /* @__PURE__ */ l(
         "div",
         {
-          className: le(j, T),
-          onClick: () => M(j),
-          onMouseEnter: () => D(T),
+          className: le(M, A),
+          onClick: () => S(M),
+          onMouseEnter: () => R(A),
           role: "option",
-          "aria-selected": j.value === B,
-          "aria-disabled": j.disabled,
+          "aria-selected": M.value === B,
+          "aria-disabled": M.disabled,
           children: [
-            /* @__PURE__ */ e("div", { className: "w-4 flex items-center justify-center", children: j.value === B && /* @__PURE__ */ e(Re, { className: de }) }),
-            j.icon && /* @__PURE__ */ e("span", { className: "shrink-0 w-4 h-4", children: j.icon }),
-            /* @__PURE__ */ e("span", { className: "flex-1 text-left", children: j.label })
+            /* @__PURE__ */ e("div", { className: "w-4 flex items-center justify-center", children: M.value === B && /* @__PURE__ */ e(De, { className: de }) }),
+            M.icon && /* @__PURE__ */ e("span", { className: "shrink-0 w-4 h-4", children: M.icon }),
+            /* @__PURE__ */ e("span", { className: "flex-1 text-left", children: M.label })
           ]
         },
-        j.value
+        M.value
       ))
     ] })
   ] });
-}, De = () => /* @__PURE__ */ e(
+}, ze = () => /* @__PURE__ */ e(
   "svg",
   {
     width: "16",
@@ -2137,7 +2144,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), ze = () => /* @__PURE__ */ e(
+), Te = () => /* @__PURE__ */ e(
   "svg",
   {
     width: "16",
@@ -2157,7 +2164,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Te = () => /* @__PURE__ */ e(
+), Ae = () => /* @__PURE__ */ e(
   "svg",
   {
     width: "16",
@@ -2176,7 +2183,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Ae = () => /* @__PURE__ */ e(
+), Ee = () => /* @__PURE__ */ e(
   "svg",
   {
     width: "16",
@@ -2195,7 +2202,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Ee = ({
+), Ze = ({
   column: t,
   sortable: a,
   sorted: o,
@@ -2231,8 +2238,8 @@ const je = () => /* @__PURE__ */ e(
       onClick: a ? n : void 0,
       role: a ? "button" : void 0,
       tabIndex: a ? 0 : void 0,
-      onKeyDown: a ? (u) => {
-        (u.key === "Enter" || u.key === " ") && (u.preventDefault(), n());
+      onKeyDown: a ? (g) => {
+        (g.key === "Enter" || g.key === " ") && (g.preventDefault(), n());
       } : void 0,
       style: { width: t.width },
       children: [
@@ -2252,8 +2259,8 @@ const je = () => /* @__PURE__ */ e(
           }
         ),
         a && /* @__PURE__ */ l("span", { className: "shrink-0 text-content-secondary dark:text-content-secondary", children: [
-          o && r === "asc" && /* @__PURE__ */ e(De, {}),
-          o && r === "desc" && /* @__PURE__ */ e(ze, {}),
+          o && r === "asc" && /* @__PURE__ */ e(ze, {}),
+          o && r === "desc" && /* @__PURE__ */ e(Te, {}),
           !o && /* @__PURE__ */ e("div", { className: "w-4 h-4" })
         ] })
       ]
@@ -2303,7 +2310,7 @@ const je = () => /* @__PURE__ */ e(
       )
     }
   );
-}, Ze = ({
+}, He = ({
   currentPage: t,
   totalPages: a,
   onPageChange: o,
@@ -2313,8 +2320,8 @@ const je = () => /* @__PURE__ */ e(
   const c = (() => {
     const d = [];
     if (a <= 7)
-      for (let u = 1; u <= a; u++)
-        d.push(u);
+      for (let g = 1; g <= a; g++)
+        d.push(g);
     else
       d.push(1), t <= 3 ? d.push(2, 3) : t >= a - 2 ? (d.push("..."), d.push(a - 2, a - 1)) : (d.push("..."), d.push(t), d.push("...")), a > 1 && d.push(a);
     return d;
@@ -2344,7 +2351,7 @@ const je = () => /* @__PURE__ */ e(
           duration-150
         `,
         children: [
-          /* @__PURE__ */ e(Te, {}),
+          /* @__PURE__ */ e(Ae, {}),
           /* @__PURE__ */ e("span", { children: r })
         ]
       }
@@ -2414,12 +2421,12 @@ const je = () => /* @__PURE__ */ e(
         `,
         children: [
           /* @__PURE__ */ e("span", { children: n }),
-          /* @__PURE__ */ e(Ae, {})
+          /* @__PURE__ */ e(Ee, {})
         ]
       }
     )
   ] });
-}, cr = ({
+}, dr = ({
   title: t,
   columns: a,
   data: o,
@@ -2430,18 +2437,18 @@ const je = () => /* @__PURE__ */ e(
   onSort: c,
   sortColumn: d,
   sortDirection: b,
-  fullWidth: u = !1,
+  fullWidth: g = !1,
   emptyMessage: i = "No hay datos disponibles",
-  loading: p = !1,
-  loadingRows: m = 5,
-  pagination: x,
-  className: g = "",
-  id: y
+  loading: m = !1,
+  loadingRows: p = 5,
+  pagination: f,
+  className: u = "",
+  id: k
 }) => {
-  const [f, k] = V(null), [w, h] = V(null), v = d !== void 0 ? d : f, C = b !== void 0 ? b : w, N = (L) => {
-    let M = "asc";
-    v === L && (C === "asc" ? M = "desc" : C === "desc" && (M = null)), c ? c(L, M) : (k(M ? L : null), h(M));
-  }, B = (L, M) => typeof M == "function" ? M(L) : L[M], z = [
+  const [x, h] = H(null), [C, N] = H(null), y = d !== void 0 ? d : x, w = b !== void 0 ? b : C, $ = (_) => {
+    let S = "asc";
+    y === _ && (w === "asc" ? S = "desc" : w === "desc" && (S = null)), c ? c(_, S) : (h(S ? _ : null), N(S));
+  }, B = (_, S) => typeof S == "function" ? S(_) : _[S], D = [
     `
     flex
     flex-col
@@ -2455,10 +2462,10 @@ const je = () => /* @__PURE__ */ e(
     n ? "border border-border-primary dark:border-dark-border-primary" : "",
     s ? "shadow-base" : "",
     "p-8",
-    u || r === "fullWidth" ? "w-full" : "",
-    g
+    g || r === "fullWidth" ? "w-full" : "",
+    u
   ].join(" ").replace(/\s+/g, " ").trim();
-  return /* @__PURE__ */ l("div", { className: z, id: y, children: [
+  return /* @__PURE__ */ l("div", { className: D, id: k, children: [
     t && /* @__PURE__ */ e("div", { className: "flex items-center justify-center w-full", children: /* @__PURE__ */ e(
       "h3",
       {
@@ -2480,26 +2487,26 @@ const je = () => /* @__PURE__ */ e(
       dark:border-dark-border-primary
       rounded-lg
       overflow-hidden
-    ` : ""}`, children: a.map((L, M) => {
-      const O = typeof L.accessor == "function" ? `column_${M}` : String(L.accessor);
+    ` : ""}`, children: a.map((_, S) => {
+      const Z = typeof _.accessor == "function" ? `column_${S}` : String(_.accessor);
       return /* @__PURE__ */ l("div", { className: "flex flex-col flex-1 min-w-0", children: [
         /* @__PURE__ */ e(
-          Ee,
+          Ze,
           {
-            column: L,
-            sortable: L.sortable || !1,
-            sorted: v === O,
-            sortDirection: v === O ? C : null,
-            onSort: () => N(O)
+            column: _,
+            sortable: _.sortable || !1,
+            sorted: y === Z,
+            sortDirection: y === Z ? w : null,
+            onSort: () => $(Z)
           }
         ),
-        p && /* @__PURE__ */ e(S, { children: Array.from({ length: m }).map((U, H) => /* @__PURE__ */ e(
+        m && /* @__PURE__ */ e(z, { children: Array.from({ length: p }).map((V, O) => /* @__PURE__ */ e(
           ee,
           {
-            align: L.align,
-            width: L.width,
+            align: _.align,
+            width: _.width,
             isStriped: r === "striped",
-            rowIndex: H,
+            rowIndex: O,
             children: /* @__PURE__ */ e(
               "div",
               {
@@ -2513,23 +2520,23 @@ const je = () => /* @__PURE__ */ e(
               }
             )
           },
-          `loading-${H}`
+          `loading-${O}`
         )) }),
-        !p && o.length > 0 && /* @__PURE__ */ e(S, { children: o.map((U, H) => {
-          const q = B(U, L.accessor), Q = L.render ? L.render(q, U, H) : q;
+        !m && o.length > 0 && /* @__PURE__ */ e(z, { children: o.map((V, O) => {
+          const q = B(V, _.accessor), Q = _.render ? _.render(q, V, O) : q;
           return /* @__PURE__ */ e(
             ee,
             {
-              align: L.align,
-              width: L.width,
+              align: _.align,
+              width: _.width,
               isStriped: r === "striped",
-              rowIndex: H,
+              rowIndex: O,
               children: Q
             },
-            H
+            O
           );
         }) }),
-        !p && o.length === 0 && M === 0 && /* @__PURE__ */ e(
+        !m && o.length === 0 && S === 0 && /* @__PURE__ */ e(
           "div",
           {
             className: `
@@ -2546,16 +2553,16 @@ const je = () => /* @__PURE__ */ e(
             children: i
           }
         )
-      ] }, O);
+      ] }, Z);
     }) }),
-    x && /* @__PURE__ */ e(
-      Ze,
+    f && /* @__PURE__ */ e(
+      He,
       {
-        currentPage: x.currentPage,
-        totalPages: x.totalPages,
-        onPageChange: x.onPageChange,
-        previousLabel: x.previousLabel,
-        nextLabel: x.nextLabel
+        currentPage: f.currentPage,
+        totalPages: f.totalPages,
+        onPageChange: f.onPageChange,
+        previousLabel: f.previousLabel,
+        nextLabel: f.nextLabel
       }
     )
   ] });
@@ -2581,7 +2588,7 @@ const je = () => /* @__PURE__ */ e(
     p-0
     border-0
     bg-transparent
-  `, i = n ? "opacity-50 cursor-not-allowed pointer-events-none" : "", p = `
+  `, i = n ? "opacity-50 cursor-not-allowed pointer-events-none" : "", m = `
     flex
     items-center
     justify-center
@@ -2592,30 +2599,30 @@ const je = () => /* @__PURE__ */ e(
     transition-all
     duration-150
     w-full
-  `, m = n ? "" : `
+  `, p = n ? "" : `
       group-hover:bg-[rgba(0,0,0,0.03)]
       group-focus-visible:bg-[rgba(0,0,0,0.03)]
       group-focus-visible:shadow-[0px_0px_0px_2px_#dbeefe,0px_1px_2px_0px_rgba(0,0,0,0.05),0px_0px_0px_4px_#60b6fa]
       dark:group-hover:bg-white/5
       dark:group-focus-visible:bg-white/5
       dark:group-focus-visible:shadow-[0px_0px_0px_2px_#1e3a5f,0px_1px_2px_0px_rgba(0,0,0,0.05),0px_0px_0px_4px_#0f6ae3]
-    `, x = a ? `
+    `, f = a ? `
       text-primary-custom-600
       dark:text-primary-custom-600
     ` : `
       text-content-primary
       dark:text-dark-content-primary
-    `, g = `
+    `, u = `
     w-3
     h-3
     shrink-0
-  `, y = a ? `
+  `, k = a ? `
       bg-primary-custom-600
       dark:bg-primary-custom-600
     ` : `
       bg-content-primary
       dark:bg-dark-content-primary
-    `, f = a ? `
+    `, x = a ? `
       absolute
       -bottom-2.5
       left-0
@@ -2625,16 +2632,16 @@ const je = () => /* @__PURE__ */ e(
       bg-primary-custom-600
       dark:bg-primary-custom-600
       z-10
-    ` : "hidden", k = [
+    ` : "hidden", h = [
     b,
     "",
     i,
     "group",
     // Para usar group-hover y group-focus-visible
     c
-  ].join(" ").replace(/\s+/g, " ").trim(), w = [
-    p,
-    m
+  ].join(" ").replace(/\s+/g, " ").trim(), C = [
+    m,
+    p
   ].join(" ").replace(/\s+/g, " ").trim();
   return /* @__PURE__ */ l(
     "button",
@@ -2645,12 +2652,12 @@ const je = () => /* @__PURE__ */ e(
       "aria-disabled": n,
       "aria-label": d || t,
       tabIndex: n ? -1 : 0,
-      className: k,
+      className: h,
       onClick: n ? void 0 : s,
       disabled: n,
       children: [
-        /* @__PURE__ */ l("div", { className: w, children: [
-          o && /* @__PURE__ */ e("span", { className: `${g} ${x}`.trim(), children: o }),
+        /* @__PURE__ */ l("div", { className: C, children: [
+          o && /* @__PURE__ */ e("span", { className: `${u} ${f}`.trim(), children: o }),
           /* @__PURE__ */ e(
             "span",
             {
@@ -2659,7 +2666,7 @@ const je = () => /* @__PURE__ */ e(
             font-bold
             leading-5
             whitespace-nowrap
-            ${x}
+            ${f}
           `.replace(/\s+/g, " ").trim(),
               children: t
             }
@@ -2680,18 +2687,18 @@ const je = () => /* @__PURE__ */ e(
               leading-4
               text-primary-inverse-content
               dark:text-dark-bg-primary
-              ${y}
+              ${k}
             `.replace(/\s+/g, " ").trim(),
               "aria-label": `${r} notificaciones`,
               children: r > 99 ? "99+" : r
             }
           )
         ] }),
-        /* @__PURE__ */ e("div", { className: f })
+        /* @__PURE__ */ e("div", { className: x })
       ]
     }
   );
-}, dr = ({
+}, br = ({
   items: t,
   activeId: a,
   defaultActiveId: o,
@@ -2701,11 +2708,11 @@ const je = () => /* @__PURE__ */ e(
   size: c = "base",
   showBorder: d = !0
 }) => {
-  const [b, u] = V(
+  const [b, g] = H(
     o || (t.length > 0 ? t[0].id : "")
-  ), i = a !== void 0, p = i ? a : b, m = (k) => {
-    i || u(k), r?.(k);
-  }, g = `
+  ), i = a !== void 0, m = i ? a : b, p = (h) => {
+    i || g(h), r?.(h);
+  }, u = `
     flex
     items-end
     pb-2.5
@@ -2716,8 +2723,8 @@ const je = () => /* @__PURE__ */ e(
   }[c]}
     ${s ? "w-full" : ""}
     ${d ? "border-b border-border-primary dark:border-dark-border-primary" : ""}
-  `, y = s ? "flex-1" : "", f = [
-    g,
+  `, k = s ? "flex-1" : "", x = [
+    u,
     n
   ].join(" ").replace(/\s+/g, " ").trim();
   return /* @__PURE__ */ e(
@@ -2725,23 +2732,23 @@ const je = () => /* @__PURE__ */ e(
     {
       role: "tablist",
       "aria-label": "Pestañas de navegación",
-      className: f,
-      children: t.map((k) => /* @__PURE__ */ e(
+      className: x,
+      children: t.map((h) => /* @__PURE__ */ e(
         Ve,
         {
-          label: k.label,
-          active: p === k.id,
-          icon: k.icon,
-          badge: k.badge,
-          disabled: k.disabled,
-          onClick: () => m(k.id),
-          className: y
+          label: h.label,
+          active: m === h.id,
+          icon: h.icon,
+          badge: h.badge,
+          disabled: h.disabled,
+          onClick: () => p(h.id),
+          className: k
         },
-        k.id
+        h.id
       ))
     }
   );
-}, He = () => /* @__PURE__ */ e(
+}, We = () => /* @__PURE__ */ e(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2819,7 +2826,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), We = () => /* @__PURE__ */ e(
+), Oe = () => /* @__PURE__ */ e(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2836,7 +2843,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), br = ({
+), mr = ({
   logo: t,
   productName: a = "Nombre Producto",
   environmentBadge: o,
@@ -2846,17 +2853,17 @@ const je = () => /* @__PURE__ */ e(
   className: c = "",
   variant: d = "responsive",
   hideActionButtons: b = !1,
-  leadingAction: u,
+  leadingAction: g,
   siesaLogo: i,
-  showBusinessLogo: p = !1,
-  showSiesaLogoLeading: m = !0,
-  showSiesaLogoTrailing: x = !1,
-  onNavigationClick: g,
-  onSearchClick: y,
-  onCartClick: f,
-  onNotificationsClick: k
+  showBusinessLogo: m = !1,
+  showSiesaLogoLeading: p = !0,
+  showSiesaLogoTrailing: f = !1,
+  onNavigationClick: u,
+  onSearchClick: k,
+  onCartClick: x,
+  onNotificationsClick: h
 }) => {
-  const w = `
+  const C = `
     box-border
     flex
     flex-col
@@ -2880,7 +2887,7 @@ const je = () => /* @__PURE__ */ e(
     dark:focus:ring-offset-dark-bg-primary
     transition-all
     duration-150
-  `, h = `
+  `, N = `
     bg-primary-custom-600
     text-primary-inverse-content
     border
@@ -2910,29 +2917,29 @@ const je = () => /* @__PURE__ */ e(
     shrink-0
     transition-all
     duration-150
-  `, v = d === "mobile", C = d === "desktop", N = d === "tablet", B = d === "responsive", R = () => {
-    if (v) return null;
-    const $ = /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(We, {}) });
-    return C || N ? /* @__PURE__ */ e(
+  `, y = d === "mobile", w = d === "desktop", $ = d === "tablet", B = d === "responsive", v = () => {
+    if (y) return null;
+    const L = /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(Oe, {}) });
+    return w || $ ? /* @__PURE__ */ e(
       "button",
       {
-        className: h,
+        className: N,
         "aria-label": "Volver",
-        onClick: g,
-        children: $
+        onClick: u,
+        children: L
       }
     ) : /* @__PURE__ */ e(
       "button",
       {
-        className: `hidden md:flex ${h}`,
+        className: `hidden md:flex ${N}`,
         "aria-label": "Volver",
-        onClick: g,
-        children: $
+        onClick: u,
+        children: L
       }
     );
-  }, _ = () => {
-    if (v || !p) return null;
-    const $ = /* @__PURE__ */ e(
+  }, j = () => {
+    if (y || !m) return null;
+    const L = /* @__PURE__ */ e(
       "img",
       {
         src: "/,Business Logo.png",
@@ -2940,16 +2947,16 @@ const je = () => /* @__PURE__ */ e(
         className: "w-full h-full object-contain"
       }
     );
-    return C ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[168px] h-[30px]", children: $ }) : N ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[140px] h-[25px]", children: $ }) : /* @__PURE__ */ e("div", { className: "hidden md:block overflow-hidden relative shrink-0 w-[140px] lg:w-[168px] h-[25px] lg:h-[30px]", children: $ });
-  }, D = () => {
-    const $ = /* @__PURE__ */ e(
+    return w ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[168px] h-[30px]", children: L }) : $ ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[140px] h-[25px]", children: L }) : /* @__PURE__ */ e("div", { className: "hidden md:block overflow-hidden relative shrink-0 w-[140px] lg:w-[168px] h-[25px] lg:h-[30px]", children: L });
+  }, R = () => {
+    const L = /* @__PURE__ */ e(
       "img",
       {
         src: "/.Siesa Logo.png",
         alt: "Siesa",
         className: "w-full h-full object-contain"
       }
-    ), Z = /* @__PURE__ */ e(
+    ), W = /* @__PURE__ */ e(
       "img",
       {
         src: "/siesa_logo_mobile.png",
@@ -2957,16 +2964,16 @@ const je = () => /* @__PURE__ */ e(
         className: "w-full h-full object-contain"
       }
     );
-    return v ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[30px] h-[30px]", children: Z }) : m ? C ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: $ }) : N ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: $ }) : /* @__PURE__ */ l(S, { children: [
-      /* @__PURE__ */ e("div", { className: "md:hidden overflow-hidden relative shrink-0 w-[30px] h-[30px]", children: Z }),
-      m && /* @__PURE__ */ l(S, { children: [
-        /* @__PURE__ */ e("div", { className: "hidden md:block lg:hidden overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: $ }),
-        /* @__PURE__ */ e("div", { className: "hidden lg:block overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: $ })
+    return y ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[30px] h-[30px]", children: W }) : p ? w ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: L }) : $ ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: L }) : /* @__PURE__ */ l(z, { children: [
+      /* @__PURE__ */ e("div", { className: "md:hidden overflow-hidden relative shrink-0 w-[30px] h-[30px]", children: W }),
+      p && /* @__PURE__ */ l(z, { children: [
+        /* @__PURE__ */ e("div", { className: "hidden md:block lg:hidden overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: L }),
+        /* @__PURE__ */ e("div", { className: "hidden lg:block overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: L })
       ] })
     ] }) : null;
-  }, E = () => {
-    if (!x || v) return null;
-    const $ = /* @__PURE__ */ e(
+  }, T = () => {
+    if (!f || y) return null;
+    const L = /* @__PURE__ */ e(
       "img",
       {
         src: "/.Siesa Logo.png",
@@ -2974,34 +2981,34 @@ const je = () => /* @__PURE__ */ e(
         className: "w-full h-full object-contain"
       }
     );
-    return C ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: $ }) : N ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: $ }) : /* @__PURE__ */ l(S, { children: [
-      /* @__PURE__ */ e("div", { className: "hidden md:block lg:hidden overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: $ }),
-      /* @__PURE__ */ e("div", { className: "hidden lg:block overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: $ })
+    return w ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: L }) : $ ? /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: L }) : /* @__PURE__ */ l(z, { children: [
+      /* @__PURE__ */ e("div", { className: "hidden md:block lg:hidden overflow-hidden relative shrink-0 w-[100px] h-[25px]", children: L }),
+      /* @__PURE__ */ e("div", { className: "hidden lg:block overflow-hidden relative shrink-0 w-[120px] h-[30px]", children: L })
     ] });
-  }, I = ({ responsive: $ = !0 }) => {
-    const Z = /* @__PURE__ */ e("div", { className: "grow shrink-0 w-px min-h-px bg-border-primary dark:bg-dark-border-primary" });
-    return v ? null : C || N ? /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 h-8 items-start px-0 py-1 relative shrink-0", children: Z }) : $ ? /* @__PURE__ */ e("div", { className: "hidden md:flex flex-col gap-2 h-8 items-start px-0 py-1 relative shrink-0", children: Z }) : null;
-  }, z = () => {
-    if (v || !a) return null;
-    const $ = /* @__PURE__ */ e("p", { className: "font-bold leading-7 text-xl text-content-primary dark:text-dark-content-primary tracking-[-0.5px] whitespace-nowrap", children: a });
-    return C || N ? $ : /* @__PURE__ */ e("p", { className: "hidden md:block font-bold leading-7 text-xl text-content-primary dark:text-dark-content-primary tracking-[-0.5px] whitespace-nowrap", children: a });
-  }, P = () => o ? v ? /* @__PURE__ */ e(
-    G,
+  }, I = ({ responsive: L = !0 }) => {
+    const W = /* @__PURE__ */ e("div", { className: "grow shrink-0 w-px min-h-px bg-border-primary dark:bg-dark-border-primary" });
+    return y ? null : w || $ ? /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 h-8 items-start px-0 py-1 relative shrink-0", children: W }) : L ? /* @__PURE__ */ e("div", { className: "hidden md:flex flex-col gap-2 h-8 items-start px-0 py-1 relative shrink-0", children: W }) : null;
+  }, D = () => {
+    if (y || !a) return null;
+    const L = /* @__PURE__ */ e("p", { className: "font-bold leading-7 text-xl text-content-primary dark:text-dark-content-primary tracking-[-0.5px] whitespace-nowrap", children: a });
+    return w || $ ? L : /* @__PURE__ */ e("p", { className: "hidden md:block font-bold leading-7 text-xl text-content-primary dark:text-dark-content-primary tracking-[-0.5px] whitespace-nowrap", children: a });
+  }, F = () => o ? y ? /* @__PURE__ */ e(
+    K,
     {
       color: "yellow",
       leftIcon: /* @__PURE__ */ e(X, {}),
       label: "Pruebas"
     }
-  ) : C || N ? /* @__PURE__ */ e(
-    G,
+  ) : w || $ ? /* @__PURE__ */ e(
+    K,
     {
       color: "yellow",
       leftIcon: /* @__PURE__ */ e(X, {}),
       label: o
     }
-  ) : /* @__PURE__ */ l(S, { children: [
+  ) : /* @__PURE__ */ l(z, { children: [
     /* @__PURE__ */ e("div", { className: "md:hidden", children: /* @__PURE__ */ e(
-      G,
+      K,
       {
         color: "yellow",
         leftIcon: /* @__PURE__ */ e(X, {}),
@@ -3009,54 +3016,54 @@ const je = () => /* @__PURE__ */ e(
       }
     ) }),
     /* @__PURE__ */ e("div", { className: "hidden md:block", children: /* @__PURE__ */ e(
-      G,
+      K,
       {
         color: "yellow",
         leftIcon: /* @__PURE__ */ e(X, {}),
         label: o
       }
     ) })
-  ] }) : null, L = () => b ? null : v ? /* @__PURE__ */ e(
+  ] }) : null, _ = () => b ? null : y ? /* @__PURE__ */ e(
     "button",
     {
-      className: w,
+      className: C,
       "aria-label": "Buscar",
-      onClick: y,
+      onClick: k,
       children: /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(re, {}) })
     }
   ) : B ? /* @__PURE__ */ e(
     "button",
     {
-      className: `md:hidden ${w}`,
+      className: `md:hidden ${C}`,
       "aria-label": "Buscar",
-      onClick: y,
+      onClick: k,
       children: /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(re, {}) })
     }
-  ) : null, M = () => b ? null : /* @__PURE__ */ l("div", { className: "relative", children: [
+  ) : null, S = () => b ? null : /* @__PURE__ */ l("div", { className: "relative", children: [
     /* @__PURE__ */ e(
       "button",
       {
-        className: w,
+        className: C,
         "aria-label": "Carrito de compras",
-        onClick: f,
-        children: /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(He, {}) })
+        onClick: x,
+        children: /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(We, {}) })
       }
     ),
     s?.cart !== void 0 && s.cart > 0 && /* @__PURE__ */ e("div", { className: "absolute bg-error-content dark:bg-error-content flex flex-col gap-2.5 h-4 items-center justify-center left-[calc(50%+8px)] px-1 py-0 rounded-full top-[calc(50%-8px)] -translate-x-1/2 -translate-y-1/2 pointer-events-none min-w-[16px]", children: /* @__PURE__ */ e("p", { className: "font-bold leading-3 text-[10px] text-white text-center whitespace-nowrap", children: s.cart > 99 ? "+99" : s.cart }) })
-  ] }), O = () => b ? null : /* @__PURE__ */ l("div", { className: "relative", children: [
+  ] }), Z = () => b ? null : /* @__PURE__ */ l("div", { className: "relative", children: [
     /* @__PURE__ */ e(
       "button",
       {
-        className: w,
+        className: C,
         "aria-label": "Notificaciones",
-        onClick: k,
+        onClick: h,
         children: /* @__PURE__ */ e("div", { className: "overflow-hidden relative shrink-0 w-4 h-4", children: /* @__PURE__ */ e(Fe, {}) })
       }
     ),
     s?.bell && /* @__PURE__ */ e("div", { className: "absolute w-2 h-2 bg-error-content dark:bg-error-content rounded-full left-[calc(50%+4px)] top-[calc(50%-8px)] -translate-x-1/2 pointer-events-none" })
-  ] }), U = () => {
+  ] }), V = () => {
     if (!r) return null;
-    const $ = `
+    const L = `
       box-border
       flex
       items-center
@@ -3079,11 +3086,11 @@ const je = () => /* @__PURE__ */ e(
       transition-all
       duration-150
     `;
-    if (v)
+    if (y)
       return /* @__PURE__ */ e(
         "button",
         {
-          className: $,
+          className: L,
           onClick: r.onMenuClick,
           "aria-label": "Menú de usuario",
           children: /* @__PURE__ */ e("div", { className: "relative rounded-full shrink-0 w-8 h-8", children: /* @__PURE__ */ e(
@@ -3096,10 +3103,10 @@ const je = () => /* @__PURE__ */ e(
           ) })
         }
       );
-    const Z = () => /* @__PURE__ */ e(
+    const W = () => /* @__PURE__ */ e(
       "button",
       {
-        className: $,
+        className: L,
         onClick: r.onMenuClick,
         "aria-label": "Menú de usuario",
         children: /* @__PURE__ */ l("div", { className: "box-border flex gap-3 items-center justify-center overflow-hidden px-3 py-2 relative rounded-lg shrink-0", children: [
@@ -3121,11 +3128,11 @@ const je = () => /* @__PURE__ */ e(
         ] })
       }
     );
-    return C || N ? Z() : /* @__PURE__ */ l(S, { children: [
+    return w || $ ? W() : /* @__PURE__ */ l(z, { children: [
       /* @__PURE__ */ e(
         "button",
         {
-          className: `md:hidden ${$}`,
+          className: `md:hidden ${L}`,
           onClick: r.onMenuClick,
           "aria-label": "Menú de usuario",
           children: /* @__PURE__ */ e("div", { className: "relative rounded-full shrink-0 w-8 h-8", children: /* @__PURE__ */ e(
@@ -3141,7 +3148,7 @@ const je = () => /* @__PURE__ */ e(
       /* @__PURE__ */ e(
         "button",
         {
-          className: `hidden md:flex ${$}`,
+          className: `hidden md:flex ${L}`,
           onClick: r.onMenuClick,
           "aria-label": "Menú de usuario",
           children: /* @__PURE__ */ l("div", { className: "box-border flex gap-3 items-center justify-center overflow-hidden px-3 py-2 relative rounded-lg shrink-0", children: [
@@ -3183,26 +3190,26 @@ const je = () => /* @__PURE__ */ e(
   }[d], c].join(" ").replace(/\s+/g, " ").trim();
   return /* @__PURE__ */ l("nav", { className: Q, children: [
     /* @__PURE__ */ l("div", { className: "flex gap-4 items-center relative shrink-0", children: [
-      !v && (u || /* @__PURE__ */ e(R, {})),
-      t || /* @__PURE__ */ e(_, {}),
-      p && m && !v && /* @__PURE__ */ e(I, {}),
-      i || /* @__PURE__ */ e(D, {}),
-      a && m && !v && /* @__PURE__ */ e(I, {}),
-      /* @__PURE__ */ e(z, {})
+      !y && (g || /* @__PURE__ */ e(v, {})),
+      t || /* @__PURE__ */ e(j, {}),
+      m && p && !y && /* @__PURE__ */ e(I, {}),
+      i || /* @__PURE__ */ e(R, {}),
+      a && p && !y && /* @__PURE__ */ e(I, {}),
+      /* @__PURE__ */ e(D, {})
     ] }),
     /* @__PURE__ */ l("div", { className: "flex gap-4 items-center justify-end grow min-h-px min-w-px relative shrink-0", children: [
-      /* @__PURE__ */ e(P, {}),
-      /* @__PURE__ */ e(L, {}),
-      /* @__PURE__ */ e(M, {}),
-      /* @__PURE__ */ e(O, {}),
+      /* @__PURE__ */ e(F, {}),
+      /* @__PURE__ */ e(_, {}),
+      /* @__PURE__ */ e(S, {}),
+      /* @__PURE__ */ e(Z, {}),
       r && !b && /* @__PURE__ */ e(I, {}),
-      /* @__PURE__ */ e(U, {}),
-      x && r && !v && /* @__PURE__ */ e(I, {}),
-      /* @__PURE__ */ e(E, {}),
+      /* @__PURE__ */ e(V, {}),
+      f && r && !y && /* @__PURE__ */ e(I, {}),
+      /* @__PURE__ */ e(T, {}),
       n && /* @__PURE__ */ e("div", { className: "flex gap-2 items-center", children: n })
     ] })
   ] });
-}, mr = ({
+}, pr = ({
   items: t,
   activeItemId: a,
   onItemClick: o,
@@ -3213,7 +3220,7 @@ const je = () => /* @__PURE__ */ e(
   const s = (i) => {
     i.disabled || (i.onClick && i.onClick(i.id), o && o(i.id));
   }, c = (i) => {
-    const p = i.active || i.id === a, m = `
+    const m = i.active || i.id === a, p = `
       flex-1
       flex
       flex-col
@@ -3226,7 +3233,7 @@ const je = () => /* @__PURE__ */ e(
       transition-all
       duration-150
       ${i.disabled ? "opacity-50 cursor-not-allowed pointer-events-none" : ""}
-    `.replace(/\s+/g, " ").trim(), x = `
+    `.replace(/\s+/g, " ").trim(), f = `
       flex
       items-center
       justify-center
@@ -3236,8 +3243,8 @@ const je = () => /* @__PURE__ */ e(
       overflow-hidden
       transition-all
       duration-150
-      ${p ? "bg-primary-custom-100 dark:bg-primary-custom-100" : "bg-transparent hover:bg-hover-overlay dark:hover:bg-hover-overlay-dark"}
-    `.replace(/\s+/g, " ").trim(), g = `
+      ${m ? "bg-primary-custom-100 dark:bg-primary-custom-100" : "bg-transparent hover:bg-hover-overlay dark:hover:bg-hover-overlay-dark"}
+    `.replace(/\s+/g, " ").trim(), u = `
       font-['SiesaBT:Bold',sans-serif]
       text-[10px]
       leading-[12px]
@@ -3249,7 +3256,7 @@ const je = () => /* @__PURE__ */ e(
       dark:text-dark-content-primary
       transition-colors
       duration-150
-    `.replace(/\s+/g, " ").trim(), y = `
+    `.replace(/\s+/g, " ").trim(), k = `
       w-4
       h-4
       shrink-0
@@ -3262,14 +3269,14 @@ const je = () => /* @__PURE__ */ e(
       "button",
       {
         type: "button",
-        className: m,
+        className: p,
         onClick: () => s(i),
         disabled: i.disabled,
         "aria-label": i.ariaLabel || i.label,
-        "aria-current": p ? "page" : void 0,
+        "aria-current": m ? "page" : void 0,
         children: [
-          /* @__PURE__ */ e("div", { className: x, children: /* @__PURE__ */ e("span", { className: y, children: i.icon }) }),
-          /* @__PURE__ */ e("span", { className: g, children: i.label })
+          /* @__PURE__ */ e("div", { className: f, children: /* @__PURE__ */ e("span", { className: k, children: i.icon }) }),
+          /* @__PURE__ */ e("span", { className: u, children: i.label })
         ]
       },
       i.id
@@ -3286,7 +3293,7 @@ const je = () => /* @__PURE__ */ e(
     items-start
     justify-center
     w-full
-  `.replace(/\s+/g, " ").trim(), u = `
+  `.replace(/\s+/g, " ").trim(), g = `
     flex-1
     flex
     items-start
@@ -3300,10 +3307,10 @@ const je = () => /* @__PURE__ */ e(
       className: `${d} ${r}`.trim(),
       role: "navigation",
       "aria-label": n,
-      children: /* @__PURE__ */ e("div", { className: b, children: /* @__PURE__ */ e("div", { className: u, children: t.map((i) => c(i)) }) })
+      children: /* @__PURE__ */ e("div", { className: b, children: /* @__PURE__ */ e("div", { className: g, children: t.map((i) => c(i)) }) })
     }
   );
-}, Oe = ({ lightColor: t, darkColor: a, className: o = "" }) => /* @__PURE__ */ l(
+}, Pe = ({ lightColor: t, darkColor: a, className: o = "" }) => /* @__PURE__ */ l(
   "svg",
   {
     className: `w-4 h-4 shrink-0 ${o}`.trim(),
@@ -3333,7 +3340,7 @@ const je = () => /* @__PURE__ */ e(
       )
     ]
   }
-), pr = ({
+), gr = ({
   status: t = "available",
   className: a = ""
 }) => {
@@ -3379,7 +3386,7 @@ const je = () => /* @__PURE__ */ e(
       role: "presentation",
       "aria-label": `Estado: ${r.label}`,
       children: [
-        /* @__PURE__ */ e(Oe, { lightColor: r.lightColor, darkColor: r.darkColor }),
+        /* @__PURE__ */ e(Pe, { lightColor: r.lightColor, darkColor: r.darkColor }),
         /* @__PURE__ */ e(
           "span",
           {
@@ -3397,7 +3404,7 @@ const je = () => /* @__PURE__ */ e(
       ]
     }
   );
-}, Pe = ({ className: t = "" }) => /* @__PURE__ */ e(
+}, Ue = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     width: "12",
@@ -3417,7 +3424,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Ue = ({ className: t = "" }) => /* @__PURE__ */ e(
+), Ge = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     width: "12",
@@ -3437,7 +3444,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Ge = ({ className: t = "" }) => /* @__PURE__ */ e(
+), Ke = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     width: "12",
@@ -3457,7 +3464,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Ke = ({ className: t = "" }) => /* @__PURE__ */ l(
+), qe = ({ className: t = "" }) => /* @__PURE__ */ l(
   "svg",
   {
     width: "12",
@@ -3486,7 +3493,7 @@ const je = () => /* @__PURE__ */ e(
       )
     ]
   }
-), qe = ({ className: t = "" }) => /* @__PURE__ */ e(
+), Qe = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     width: "13",
@@ -3506,7 +3513,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), gr = ({
+), ur = ({
   locationName: t,
   status: a = "available",
   state: o = "enabled",
@@ -3524,7 +3531,7 @@ const je = () => /* @__PURE__ */ e(
       badgeBg: "bg-primary-custom-100 dark:bg-blue-900/30",
       badgeText: "text-primary-custom-600 dark:text-blue-400",
       activedBg: "bg-primary-custom-100 dark:bg-blue-900/30",
-      icon: Pe,
+      icon: Ue,
       badgeLabel: "Disponible"
     },
     occupied: {
@@ -3533,7 +3540,7 @@ const je = () => /* @__PURE__ */ e(
       badgeBg: "bg-[#fcedc9] dark:bg-yellow-900/30",
       badgeText: "text-[#af460e] dark:text-orange-400",
       activedBg: "bg-[#fcedc9] dark:bg-yellow-900/30",
-      icon: Ue,
+      icon: Ge,
       badgeLabel: "Ocupada"
     },
     reserved: {
@@ -3542,7 +3549,7 @@ const je = () => /* @__PURE__ */ e(
       badgeBg: "bg-[#f3e8ff] dark:bg-purple-900/30",
       badgeText: "text-[#7e22ce] dark:text-purple-400",
       activedBg: "bg-[#f3e8ff] dark:bg-purple-900/30",
-      icon: Ge,
+      icon: Ke,
       badgeLabel: "Reservada"
     },
     outOfService: {
@@ -3551,10 +3558,10 @@ const je = () => /* @__PURE__ */ e(
       badgeBg: "bg-[#f4f4f5] dark:bg-zinc-800/30",
       badgeText: "text-content-tertiary dark:text-zinc-400",
       activedBg: "bg-[#f4f4f5] dark:bg-zinc-800/30",
-      icon: Ke,
+      icon: qe,
       badgeLabel: "F. de Servicio"
     }
-  }[a], p = i.icon, m = o === "actived" ? i.activedBg : "bg-white dark:bg-dark-bg-primary", y = [`
+  }[a], m = i.icon, p = o === "actived" ? i.activedBg : "bg-white dark:bg-dark-bg-primary", k = [`
     flex
     flex-col
     items-stretch
@@ -3577,11 +3584,11 @@ const je = () => /* @__PURE__ */ e(
     disabled:opacity-50
     disabled:cursor-not-allowed
     disabled:pointer-events-none
-  `, m, c].join(" ").replace(/\s+/g, " ").trim(), f = r ? `${r.current}/${r.total} mesas` : null;
+  `, p, c].join(" ").replace(/\s+/g, " ").trim(), x = r ? `${r.current}/${r.total} mesas` : null;
   return /* @__PURE__ */ l(
     "button",
     {
-      className: y,
+      className: k,
       onClick: n,
       disabled: s,
       "aria-label": d || `${t} - ${i.badgeLabel}`,
@@ -3600,8 +3607,8 @@ const je = () => /* @__PURE__ */ e(
           }
         ),
         /* @__PURE__ */ l("div", { className: "flex items-center justify-between", children: [
-          f && /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ e(qe, { className: i.textColor }),
+          x && /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ e(Qe, { className: i.textColor }),
             /* @__PURE__ */ e(
               "span",
               {
@@ -3610,7 +3617,7 @@ const je = () => /* @__PURE__ */ e(
                 leading-[12px]
                 ${i.textColor}
               `.replace(/\s+/g, " ").trim(),
-                children: f
+                children: x
               }
             )
           ] }),
@@ -3627,7 +3634,7 @@ const je = () => /* @__PURE__ */ e(
             ${i.badgeBg}
           `.replace(/\s+/g, " ").trim(),
               children: [
-                /* @__PURE__ */ e(p, { className: i.badgeText }),
+                /* @__PURE__ */ e(m, { className: i.badgeText }),
                 /* @__PURE__ */ e(
                   "span",
                   {
@@ -3646,7 +3653,7 @@ const je = () => /* @__PURE__ */ e(
       ]
     }
   );
-}, ur = ({
+}, xr = ({
   size: t = "l",
   border: a = !1,
   children: o,
@@ -3657,7 +3664,7 @@ const je = () => /* @__PURE__ */ e(
   htmlType: d = "button",
   ...b
 }) => {
-  const u = {
+  const g = {
     s: "w-10 h-10",
     // 40x40px
     m: "w-[65px] h-[65px]",
@@ -3671,7 +3678,7 @@ const je = () => /* @__PURE__ */ e(
     // 48px Display Tiny
     l: "text-5xl"
     // 48px Display Tiny
-  }, g = [
+  }, u = [
     `
     inline-flex
     items-center
@@ -3693,7 +3700,7 @@ const je = () => /* @__PURE__ */ e(
     transition-all
     duration-150
   `,
-    u[t],
+    g[t],
     i[t],
     a ? `
     bg-white
@@ -3739,7 +3746,7 @@ const je = () => /* @__PURE__ */ e(
     "button",
     {
       type: d,
-      className: g,
+      className: u,
       disabled: r,
       onClick: s,
       "aria-label": c || `Número ${o}`,
@@ -3747,7 +3754,7 @@ const je = () => /* @__PURE__ */ e(
       children: o
     }
   );
-}, xr = ({
+}, fr = ({
   image: t,
   label: a,
   active: o = !1,
@@ -3756,7 +3763,7 @@ const je = () => /* @__PURE__ */ e(
   className: s = "",
   ariaLabel: c
 }) => {
-  const u = [`
+  const g = [`
     flex
     flex-col
     gap-2
@@ -3805,7 +3812,7 @@ const je = () => /* @__PURE__ */ e(
     "button",
     {
       type: "button",
-      className: u,
+      className: g,
       disabled: r,
       onClick: n,
       "aria-label": c || a,
@@ -3823,7 +3830,7 @@ const je = () => /* @__PURE__ */ e(
       ]
     }
   );
-}, Qe = ({ className: t = "" }) => /* @__PURE__ */ e(
+}, Xe = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     width: "16",
@@ -3844,7 +3851,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), fr = ({
+), hr = ({
   image: t,
   productName: a,
   price: o,
@@ -3854,7 +3861,7 @@ const je = () => /* @__PURE__ */ e(
   onAddClick: c,
   onCardClick: d,
   className: b = "",
-  ariaLabel: u
+  ariaLabel: g
 }) => {
   const i = `
     flex
@@ -3871,7 +3878,7 @@ const je = () => /* @__PURE__ */ e(
     focus:ring-offset-2
     dark:focus:ring-dark-border-custom
     dark:focus:ring-offset-dark-bg-primary
-  `, p = s ? `
+  `, m = s ? `
       bg-white
       opacity-55
       cursor-not-allowed
@@ -3884,7 +3891,7 @@ const je = () => /* @__PURE__ */ e(
       bg-white
       cursor-pointer
       dark:bg-dark-bg-primary
-    `, m = s ? `
+    `, p = s ? `
       text-content-primary
       dark:text-dark-content-primary
     ` : n ? `
@@ -3893,18 +3900,18 @@ const je = () => /* @__PURE__ */ e(
     ` : `
       text-content-primary
       dark:text-dark-content-primary
-    `, x = [i, p, b].join(" ").replace(/\s+/g, " ").trim(), g = (f) => {
-    s || f.target.closest("button") || d?.(f);
-  }, y = (f) => {
-    f.stopPropagation(), !s && c?.(f);
+    `, f = [i, m, b].join(" ").replace(/\s+/g, " ").trim(), u = (x) => {
+    s || x.target.closest("button") || d?.(x);
+  }, k = (x) => {
+    x.stopPropagation(), !s && c?.(x);
   };
   return /* @__PURE__ */ l(
     "div",
     {
-      className: x,
-      onClick: g,
+      className: f,
+      onClick: u,
       role: "article",
-      "aria-label": u || `${a} - ${o}`,
+      "aria-label": g || `${a} - ${o}`,
       tabIndex: s ? -1 : 0,
       children: [
         /* @__PURE__ */ l("div", { className: "flex flex-col gap-3 w-full", children: [
@@ -3916,7 +3923,7 @@ const je = () => /* @__PURE__ */ e(
               className: "w-full h-full object-cover"
             }
           ) }),
-          /* @__PURE__ */ l("div", { className: `flex flex-col w-full font-bold ${m}`.trim().replace(/\s+/g, " "), children: [
+          /* @__PURE__ */ l("div", { className: `flex flex-col w-full font-bold ${p}`.trim().replace(/\s+/g, " "), children: [
             /* @__PURE__ */ e("div", { className: "text-sm leading-5", children: a }),
             /* @__PURE__ */ e("div", { className: "text-2xl leading-8 tracking-tighter", children: o })
           ] })
@@ -3926,8 +3933,8 @@ const je = () => /* @__PURE__ */ e(
           {
             type: "default",
             size: "sm",
-            leftIcon: /* @__PURE__ */ e(Qe, { className: "w-4 h-4" }),
-            onClick: y,
+            leftIcon: /* @__PURE__ */ e(Xe, { className: "w-4 h-4" }),
+            onClick: k,
             disabled: s,
             fullWidth: !0,
             ariaLabel: `${r} ${a}`,
@@ -3937,7 +3944,7 @@ const je = () => /* @__PURE__ */ e(
       ]
     }
   );
-}, Xe = ({ className: t = "" }) => /* @__PURE__ */ e(
+}, Je = ({ className: t = "" }) => /* @__PURE__ */ e(
   "svg",
   {
     className: t,
@@ -3954,7 +3961,7 @@ const je = () => /* @__PURE__ */ e(
       }
     )
   }
-), Je = ({
+), Ye = ({
   categoryLabel: t,
   categoryColor: a = "lime",
   productRef: o,
@@ -3964,14 +3971,14 @@ const je = () => /* @__PURE__ */ e(
   showDescription: c = !0,
   quantity: d = 0,
   minQuantity: b = 0,
-  maxQuantity: u,
+  maxQuantity: g,
   onQuantityChange: i,
-  onDelete: p,
-  disabled: m = !1,
-  className: x = "",
-  deleteIcon: g
+  onDelete: m,
+  disabled: p = !1,
+  className: f = "",
+  deleteIcon: u
 }) => {
-  const y = {
+  const k = {
     lime: {
       bg: "bg-lime-100 dark:bg-lime-900/40",
       text: "text-lime-700 dark:text-lime-300"
@@ -4048,10 +4055,10 @@ const je = () => /* @__PURE__ */ e(
       bg: "bg-primary-custom-100 dark:bg-primary-custom-600/30",
       text: "text-primary-custom-600 dark:text-primary-custom-300"
     }
-  }, f = y[a] || y.lime, k = (h) => {
-    !m && i && i(h);
-  }, w = () => {
-    !m && p && p();
+  }, x = k[a] || k.lime, h = (N) => {
+    !p && i && i(N);
+  }, C = () => {
+    !p && m && m();
   };
   return /* @__PURE__ */ l(
     "div",
@@ -4061,8 +4068,8 @@ const je = () => /* @__PURE__ */ e(
         flex-col
         gap-2
         w-full
-        ${m ? "opacity-50 pointer-events-none" : ""}
-        ${x}
+        ${p ? "opacity-50 pointer-events-none" : ""}
+        ${f}
       `.trim().replace(/\s+/g, " "),
       "data-component": "POSProductSidebarItems",
       children: [
@@ -4081,7 +4088,7 @@ const je = () => /* @__PURE__ */ e(
                   rounded-md
                   transition-colors
                   duration-150
-                  ${f.bg}
+                  ${x.bg}
                 `.trim().replace(/\s+/g, " "),
                     children: /* @__PURE__ */ e(
                       "span",
@@ -4092,7 +4099,7 @@ const je = () => /* @__PURE__ */ e(
                     font-normal
                     text-center
                     whitespace-nowrap
-                    ${f.text}
+                    ${x.text}
                   `.trim().replace(/\s+/g, " "),
                         children: t
                       }
@@ -4120,16 +4127,16 @@ const je = () => /* @__PURE__ */ e(
               transition-colors
               duration-150
             `.trim().replace(/\s+/g, " "),
-              children: s.map((h, v) => /* @__PURE__ */ l(
+              children: s.map((N, y) => /* @__PURE__ */ l(
                 "div",
                 {
                   className: "flex items-center gap-1 w-full",
                   children: [
-                    /* @__PURE__ */ e("span", { className: "flex-1 min-w-0 text-xs leading-3 font-normal text-content-primary dark:text-dark-content-primary", children: h.description }),
-                    /* @__PURE__ */ e("span", { className: "text-xs leading-3 font-bold text-content-primary dark:text-dark-content-primary whitespace-nowrap text-right shrink-0", children: h.price })
+                    /* @__PURE__ */ e("span", { className: "flex-1 min-w-0 text-xs leading-3 font-normal text-content-primary dark:text-dark-content-primary", children: N.description }),
+                    /* @__PURE__ */ e("span", { className: "text-xs leading-3 font-bold text-content-primary dark:text-dark-content-primary whitespace-nowrap text-right shrink-0", children: N.price })
                   ]
                 },
-                v
+                y
               ))
             }
           )
@@ -4140,17 +4147,17 @@ const je = () => /* @__PURE__ */ e(
             {
               value: d,
               min: b,
-              max: u,
-              onChange: k,
-              disabled: m
+              max: g,
+              onChange: h,
+              disabled: p
             }
           ) }),
           /* @__PURE__ */ e(
             "button",
             {
               type: "button",
-              onClick: w,
-              disabled: m,
+              onClick: C,
+              disabled: p,
               className: `
             flex
             items-center
@@ -4174,10 +4181,10 @@ const je = () => /* @__PURE__ */ e(
             active:scale-95
             transition-all
             duration-150
-            ${m ? "cursor-not-allowed opacity-50" : "cursor-pointer"}
+            ${p ? "cursor-not-allowed opacity-50" : "cursor-pointer"}
           `.trim().replace(/\s+/g, " "),
               "aria-label": "Eliminar producto",
-              children: g || /* @__PURE__ */ e(Xe, { className: "w-[18px] h-[21px]" })
+              children: u || /* @__PURE__ */ e(Je, { className: "w-[18px] h-[21px]" })
             }
           )
         ] })
@@ -4185,8 +4192,8 @@ const je = () => /* @__PURE__ */ e(
     }
   );
 };
-Je.displayName = "POSProductSidebarItems";
-const hr = ({
+Ye.displayName = "POSProductSidebarItems";
+const kr = ({
   tableNumber: t,
   status: a = "available",
   shape: o = "square",
@@ -4196,7 +4203,7 @@ const hr = ({
   onClick: c,
   className: d = "",
   disabled: b = !1,
-  children: u
+  children: g
 }) => {
   const i = {
     available: {
@@ -4268,7 +4275,7 @@ const hr = ({
       focusRing: "focus:ring-[#c084fc]",
       focusRingDark: "dark:focus:ring-[#7e22ce]"
     }
-  }, p = {
+  }, m = {
     square: {
       container: "rounded-[4px]",
       table: "w-[64px] h-[64px] rounded-[4px]"
@@ -4285,11 +4292,11 @@ const hr = ({
       container: "rounded-3xl",
       table: "w-[80px] h-[64px] rounded-3xl"
     }
-  }, m = ({ rotation: f }) => /* @__PURE__ */ l(
+  }, p = ({ rotation: x }) => /* @__PURE__ */ l(
     "div",
     {
       className: "w-[28px] h-[22px]",
-      style: { transform: `rotate(${f}deg)` },
+      style: { transform: `rotate(${x}deg)` },
       "aria-hidden": "true",
       children: [
         /* @__PURE__ */ e(
@@ -4324,11 +4331,11 @@ const hr = ({
         )
       ]
     }
-  ), x = () => {
+  ), f = () => {
     !b && c && c();
-  }, g = (f) => {
-    (f.key === "Enter" || f.key === " ") && !b && c && (f.preventDefault(), c());
-  }, y = [
+  }, u = (x) => {
+    (x.key === "Enter" || x.key === " ") && !b && c && (x.preventDefault(), c());
+  }, k = [
     // Dimensiones exactas del container
     "w-[160px]",
     "h-[160px]",
@@ -4371,35 +4378,35 @@ const hr = ({
   return /* @__PURE__ */ l(
     "button",
     {
-      className: y,
-      onClick: x,
-      onKeyDown: g,
+      className: k,
+      onClick: f,
+      onKeyDown: u,
       disabled: b,
       type: "button",
       "aria-label": `Mesa ${t} - ${a === "available" ? "Disponible" : a === "busy" ? "Ocupada" : "Reservada"}`,
       children: [
         /* @__PURE__ */ l("div", { className: "flex flex-col gap-[4px] items-center justify-center w-[134px] h-[134px] shrink-0", children: [
           n && (r === 2 || r === 4 || r === 6 || r === 8) && /* @__PURE__ */ l("div", { className: "flex gap-[4px] items-center justify-center shrink-0", children: [
-            r >= 6 && /* @__PURE__ */ l(S, { children: [
-              /* @__PURE__ */ e(m, { rotation: 0 }),
-              /* @__PURE__ */ e(m, { rotation: 0 })
+            r >= 6 && /* @__PURE__ */ l(z, { children: [
+              /* @__PURE__ */ e(p, { rotation: 0 }),
+              /* @__PURE__ */ e(p, { rotation: 0 })
             ] }),
-            r === 2 && /* @__PURE__ */ e(m, { rotation: 0 }),
-            r === 4 && /* @__PURE__ */ e(m, { rotation: 0 })
+            r === 2 && /* @__PURE__ */ e(p, { rotation: 0 }),
+            r === 4 && /* @__PURE__ */ e(p, { rotation: 0 })
           ] }),
           /* @__PURE__ */ l("div", { className: "flex gap-[4px] items-center justify-center shrink-0", children: [
             n && (r === 4 || r === 6 || r === 8) && /* @__PURE__ */ l("div", { className: "flex flex-col gap-[4px] items-start justify-center shrink-0", children: [
-              r >= 8 && /* @__PURE__ */ l(S, { children: [
-                /* @__PURE__ */ e(m, { rotation: 270 }),
-                /* @__PURE__ */ e(m, { rotation: 270 })
+              r >= 8 && /* @__PURE__ */ l(z, { children: [
+                /* @__PURE__ */ e(p, { rotation: 270 }),
+                /* @__PURE__ */ e(p, { rotation: 270 })
               ] }),
-              (r === 4 || r === 6) && /* @__PURE__ */ e(m, { rotation: 270 })
+              (r === 4 || r === 6) && /* @__PURE__ */ e(p, { rotation: 270 })
             ] }),
             /* @__PURE__ */ e("div", { className: "flex flex-col gap-[4px] items-start justify-center shrink-0", children: /* @__PURE__ */ e("div", { className: "flex items-center shrink-0", children: /* @__PURE__ */ e(
               "div",
               {
                 className: `
-                  ${p[o].table}
+                  ${m[o].table}
                   ${i[a].table}
                   ${i[a].tableDark}
                   shrink-0
@@ -4407,20 +4414,20 @@ const hr = ({
               }
             ) }) }),
             n && (r === 4 || r === 6 || r === 8) && /* @__PURE__ */ l("div", { className: "flex flex-col gap-[4px] items-start justify-center shrink-0", children: [
-              r >= 8 && /* @__PURE__ */ l(S, { children: [
-                /* @__PURE__ */ e(m, { rotation: 90 }),
-                /* @__PURE__ */ e(m, { rotation: 90 })
+              r >= 8 && /* @__PURE__ */ l(z, { children: [
+                /* @__PURE__ */ e(p, { rotation: 90 }),
+                /* @__PURE__ */ e(p, { rotation: 90 })
               ] }),
-              (r === 4 || r === 6) && /* @__PURE__ */ e(m, { rotation: 90 })
+              (r === 4 || r === 6) && /* @__PURE__ */ e(p, { rotation: 90 })
             ] })
           ] }),
           n && (r === 2 || r === 4 || r === 6 || r === 8) && /* @__PURE__ */ l("div", { className: "flex gap-[4px] items-center justify-center shrink-0", children: [
-            r >= 6 && /* @__PURE__ */ l(S, { children: [
-              /* @__PURE__ */ e(m, { rotation: 180 }),
-              /* @__PURE__ */ e(m, { rotation: 180 })
+            r >= 6 && /* @__PURE__ */ l(z, { children: [
+              /* @__PURE__ */ e(p, { rotation: 180 }),
+              /* @__PURE__ */ e(p, { rotation: 180 })
             ] }),
-            r === 2 && /* @__PURE__ */ e(m, { rotation: 180 }),
-            r === 4 && /* @__PURE__ */ e(m, { rotation: 180 })
+            r === 2 && /* @__PURE__ */ e(p, { rotation: 180 }),
+            r === 4 && /* @__PURE__ */ e(p, { rotation: 180 })
           ] })
         ] }),
         /* @__PURE__ */ l(
@@ -4448,19 +4455,19 @@ const hr = ({
                 "Mesa ",
                 t
               ] }),
-              u
+              g
             ]
           }
         )
       ]
     }
   );
-}, oe = ue(void 0), kr = ({
+}, oe = xe(void 0), vr = ({
   children: t,
   defaultTheme: a = "light"
 }) => {
-  const [o, r] = V(() => typeof window < "u" && localStorage.getItem("siesa-ui-theme") || a);
-  W(() => {
+  const [o, r] = H(() => typeof window < "u" && localStorage.getItem("siesa-ui-theme") || a);
+  U(() => {
     const c = window.document.documentElement;
     o === "dark" ? c.classList.add("dark") : c.classList.remove("dark"), localStorage.setItem("siesa-ui-theme", o);
   }, [o]);
@@ -4470,41 +4477,41 @@ const hr = ({
     r(c);
   };
   return /* @__PURE__ */ e(oe.Provider, { value: { theme: o, toggleTheme: n, setTheme: s }, children: t });
-}, vr = () => {
-  const t = xe(oe);
+}, yr = () => {
+  const t = fe(oe);
   if (t === void 0)
     throw new Error("useTheme debe ser usado dentro de un ThemeProvider");
   return t;
 };
 export {
-  $e as Alert,
-  we as Avatar,
-  G as Badge,
+  je as Alert,
+  Ce as Avatar,
+  K as Badge,
   Y as Button,
-  ke as Checkbox,
-  Ne as DescriptionList,
-  Ce as Divider,
-  or as Dropdown,
-  fe as Input,
-  br as Navbar,
-  mr as NavigationBar,
-  sr as Notification,
-  pr as POSConvention,
-  gr as POSLocationButton,
-  ur as POSNumberButton,
-  xr as POSProductButton,
-  fr as POSProductCard,
-  Je as POSProductSidebarItems,
-  hr as POSTable,
-  ir as Pagination,
+  ve as Checkbox,
+  $e as DescriptionList,
+  Ne as Divider,
+  sr as Dropdown,
+  he as Input,
+  mr as Navbar,
+  pr as NavigationBar,
+  ir as Notification,
+  gr as POSConvention,
+  ur as POSLocationButton,
+  xr as POSNumberButton,
+  fr as POSProductButton,
+  hr as POSProductCard,
+  Ye as POSProductSidebarItems,
+  kr as POSTable,
+  lr as Pagination,
   ne as Quantity,
-  ve as Radio,
-  lr as Select,
-  ye as Switch,
-  cr as Table,
-  dr as Tabs,
-  he as Textarea,
-  kr as ThemeProvider,
-  vr as useTheme
+  ye as Radio,
+  cr as Select,
+  we as Switch,
+  dr as Table,
+  br as Tabs,
+  ke as Textarea,
+  vr as ThemeProvider,
+  yr as useTheme
 };
 //# sourceMappingURL=siesa-ui-kit.mjs.map