next-ui-lib 0.1.18 → 0.1.19

package/dist/ui.es.js

@@ -1,7 +1,7 @@
-import { jsx as f, jsxs as H } from "react/jsx-runtime";
-import * as L from "react";
-import { useState as Ve } from "react";
-const Ce = {
+import { jsx as f, jsxs as F } from "react/jsx-runtime";
+import * as O from "react";
+import { useState as We } from "react";
+const ce = {
   lightBlue: {
     primary: { text: "#FFFFFF", value: "#27a7e3", dark: "#1f8ecb" },
     secondary: { text: "#1CB0F6", value: "#E0F3FF", dark: "#B3DFFC" }
@@ -14,7 +14,9 @@ const Ce = {
     primary: { text: "#FFFFFF", value: "#00BCD4", dark: "#0097A7" },
     secondary: { text: "#00BCD4", value: "#B2EBF2", dark: "#80DEEA" }
   }
-}, xe = ({
+}, _e = {
+  Gray: { value: "#F1F1F1" }
+}, ye = ({
   color: e = "lightBlue",
   onClick: t,
   label: r,
@@ -27,21 +29,21 @@ const Ce = {
     medium: "px-3 py-1 text-base rounded-xl",
     large: "px-8 py-3 text-2xl rounded-2xl",
     full: "px-8 py-2 text-xl rounded-2xl w-full"
-  }, u = Ce[e];
+  }, p = ce[e];
   return /* @__PURE__ */ f(
     "button",
     {
       className: `relative flex items-center justify-center cursor-pointer transition duration-150 ease-in-out whitespace-nowrap active:translate-y-[4px] ${l[o]} ${c}`,
       style: {
-        backgroundColor: n == "primary" ? u.primary.value : u.secondary.value,
-        boxShadow: `0 ${o === "large" ? "6px" : "4px"} 0 ${n == "primary" ? u.primary.dark : u.secondary.dark}`,
-        color: n == "primary" ? u.primary.text : u.secondary.text
+        backgroundColor: n == "primary" ? p.primary.value : p.secondary.value,
+        boxShadow: `0 ${o === "large" ? "6px" : "4px"} 0 ${n == "primary" ? p.primary.dark : p.secondary.dark}`,
+        color: n == "primary" ? p.primary.text : p.secondary.text
       },
       onMouseDown: (m) => {
         m.currentTarget.style.boxShadow = "none";
       },
       onMouseUp: (m) => {
-        m.currentTarget.style.boxShadow = `0 4px 0 ${n == "primary" ? u.primary.dark : u.secondary.dark}`;
+        m.currentTarget.style.boxShadow = `0 4px 0 ${n == "primary" ? p.primary.dark : p.secondary.dark}`;
       },
       onClick: t,
       children: /* @__PURE__ */ f("span", { className: "font-bold", children: r })
@@ -57,44 +59,44 @@ function ze(e) {
   } else for (r in e) e[r] && (o && (o += " "), o += r);
   return o;
 }
-function We() {
+function De() {
   for (var e, t, r = 0, o = "", n = arguments.length; r < n; r++) (e = arguments[r]) && (t = ze(e)) && (o && (o += " "), o += t);
   return o;
 }
-const ce = "-", _e = (e) => {
-  const t = Ue(e), {
+const de = "-", Ue = (e) => {
+  const t = qe(e), {
     conflictingClassGroups: r,
     conflictingClassGroupModifiers: o
   } = e;
   return {
     getClassGroupId: (l) => {
-      const u = l.split(ce);
-      return u[0] === "" && u.length !== 1 && u.shift(), Se(u, t) || De(l);
+      const p = l.split(de);
+      return p[0] === "" && p.length !== 1 && p.shift(), Ne(p, t) || He(l);
     },
-    getConflictingClassGroupIds: (l, u) => {
+    getConflictingClassGroupIds: (l, p) => {
       const m = r[l] || [];
-      return u && o[l] ? [...m, ...o[l]] : m;
+      return p && o[l] ? [...m, ...o[l]] : m;
     }
   };
-}, Se = (e, t) => {
+}, Ne = (e, t) => {
   if (e.length === 0)
     return t.classGroupId;
-  const r = e[0], o = t.nextPart.get(r), n = o ? Se(e.slice(1), o) : void 0;
+  const r = e[0], o = t.nextPart.get(r), n = o ? Ne(e.slice(1), o) : void 0;
   if (n)
     return n;
   if (t.validators.length === 0)
     return;
-  const c = e.join(ce);
+  const c = e.join(de);
   return t.validators.find(({
     validator: l
   }) => l(c))?.classGroupId;
-}, ye = /^\[(.+)\]$/, De = (e) => {
-  if (ye.test(e)) {
-    const t = ye.exec(e)[1], r = t?.substring(0, t.indexOf(":"));
+}, we = /^\[(.+)\]$/, He = (e) => {
+  if (we.test(e)) {
+    const t = we.exec(e)[1], r = t?.substring(0, t.indexOf(":"));
     if (r)
       return "arbitrary.." + r;
   }
-}, Ue = (e) => {
+}, qe = (e) => {
   const {
     theme: t,
     classGroups: r
@@ -108,12 +110,12 @@ const ce = "-", _e = (e) => {
 }, ne = (e, t, r, o) => {
   e.forEach((n) => {
     if (typeof n == "string") {
-      const c = n === "" ? t : we(t, n);
+      const c = n === "" ? t : ke(t, n);
       c.classGroupId = r;
       return;
     }
     if (typeof n == "function") {
-      if (He(n)) {
+      if (Je(n)) {
         ne(n(o), t, r, o);
         return;
       }
@@ -124,18 +126,18 @@ const ce = "-", _e = (e) => {
       return;
     }
     Object.entries(n).forEach(([c, l]) => {
-      ne(l, we(t, c), r, o);
+      ne(l, ke(t, c), r, o);
     });
   });
-}, we = (e, t) => {
+}, ke = (e, t) => {
   let r = e;
-  return t.split(ce).forEach((o) => {
+  return t.split(de).forEach((o) => {
     r.nextPart.has(o) || r.nextPart.set(o, {
       nextPart: /* @__PURE__ */ new Map(),
       validators: []
     }), r = r.nextPart.get(o);
   }), r;
-}, He = (e) => e.isThemeGetter, qe = (e) => {
+}, Je = (e) => e.isThemeGetter, Xe = (e) => {
   if (e < 1)
     return {
       get: () => {
@@ -159,19 +161,19 @@ const ce = "-", _e = (e) => {
       r.has(c) ? r.set(c, l) : n(c, l);
     }
   };
-}, le = "!", ie = ":", Je = ie.length, Xe = (e) => {
+}, le = "!", ie = ":", Ke = ie.length, Qe = (e) => {
   const {
     prefix: t,
     experimentalParseClassName: r
   } = e;
   let o = (n) => {
     const c = [];
-    let l = 0, u = 0, m = 0, b;
+    let l = 0, p = 0, m = 0, b;
     for (let k = 0; k < n.length; k++) {
       let C = n[k];
-      if (l === 0 && u === 0) {
+      if (l === 0 && p === 0) {
         if (C === ie) {
-          c.push(n.slice(m, k)), m = k + Je;
+          c.push(n.slice(m, k)), m = k + Ke;
           continue;
         }
         if (C === "/") {
@@ -179,14 +181,14 @@ const ce = "-", _e = (e) => {
           continue;
         }
       }
-      C === "[" ? l++ : C === "]" ? l-- : C === "(" ? u++ : C === ")" && u--;
+      C === "[" ? l++ : C === "]" ? l-- : C === "(" ? p++ : C === ")" && p--;
     }
-    const h = c.length === 0 ? n : n.substring(m), v = Ke(h), R = v !== h, N = b && b > m ? b - m : void 0;
+    const h = c.length === 0 ? n : n.substring(m), v = Ye(h), R = v !== h, M = b && b > m ? b - m : void 0;
     return {
       modifiers: c,
       hasImportantModifier: R,
       baseClassName: v,
-      maybePostfixModifierPosition: N
+      maybePostfixModifierPosition: M
     };
   };
   if (t) {
@@ -207,7 +209,7 @@ const ce = "-", _e = (e) => {
     });
   }
   return o;
-}, Ke = (e) => e.endsWith(le) ? e.substring(0, e.length - 1) : e.startsWith(le) ? e.substring(1) : e, Qe = (e) => {
+}, Ye = (e) => e.endsWith(le) ? e.substring(0, e.length - 1) : e.startsWith(le) ? e.substring(1) : e, Ze = (e) => {
   const t = Object.fromEntries(e.orderSensitiveModifiers.map((o) => [o, !0]));
   return (o) => {
     if (o.length <= 1)
@@ -218,24 +220,24 @@ const ce = "-", _e = (e) => {
       l[0] === "[" || t[l] ? (n.push(...c.sort(), l), c = []) : c.push(l);
     }), n.push(...c.sort()), n;
   };
-}, Ye = (e) => ({
-  cache: qe(e.cacheSize),
-  parseClassName: Xe(e),
-  sortModifiers: Qe(e),
-  ..._e(e)
-}), Ze = /\s+/, er = (e, t) => {
+}, er = (e) => ({
+  cache: Xe(e.cacheSize),
+  parseClassName: Qe(e),
+  sortModifiers: Ze(e),
+  ...Ue(e)
+}), rr = /\s+/, or = (e, t) => {
   const {
     parseClassName: r,
     getClassGroupId: o,
     getConflictingClassGroupIds: n,
     sortModifiers: c
-  } = t, l = [], u = e.trim().split(Ze);
+  } = t, l = [], p = e.trim().split(rr);
   let m = "";
-  for (let b = u.length - 1; b >= 0; b -= 1) {
-    const h = u[b], {
+  for (let b = p.length - 1; b >= 0; b -= 1) {
+    const h = p[b], {
       isExternal: v,
       modifiers: R,
-      hasImportantModifier: N,
+      hasImportantModifier: M,
       baseClassName: k,
       maybePostfixModifierPosition: C
     } = r(h);
@@ -243,78 +245,78 @@ const ce = "-", _e = (e) => {
       m = h + (m.length > 0 ? " " + m : m);
       continue;
     }
-    let G = !!C, F = o(G ? k.substring(0, C) : k);
-    if (!F) {
-      if (!G) {
+    let E = !!C, I = o(E ? k.substring(0, C) : k);
+    if (!I) {
+      if (!E) {
         m = h + (m.length > 0 ? " " + m : m);
         continue;
       }
-      if (F = o(k), !F) {
+      if (I = o(k), !I) {
         m = h + (m.length > 0 ? " " + m : m);
         continue;
       }
-      G = !1;
+      E = !1;
     }
-    const q = c(R).join(":"), _ = N ? q + le : q, E = _ + F;
-    if (l.includes(E))
+    const q = c(R).join(":"), D = M ? q + le : q, B = D + I;
+    if (l.includes(B))
       continue;
-    l.push(E);
-    const B = n(F, G);
-    for (let I = 0; I < B.length; ++I) {
-      const D = B[I];
-      l.push(_ + D);
+    l.push(B);
+    const $ = n(I, E);
+    for (let P = 0; P < $.length; ++P) {
+      const U = $[P];
+      l.push(D + U);
     }
     m = h + (m.length > 0 ? " " + m : m);
   }
   return m;
 };
-function rr() {
+function tr() {
   let e = 0, t, r, o = "";
   for (; e < arguments.length; )
-    (t = arguments[e++]) && (r = Me(t)) && (o && (o += " "), o += r);
+    (t = arguments[e++]) && (r = Se(t)) && (o && (o += " "), o += r);
   return o;
 }
-const Me = (e) => {
+const Se = (e) => {
   if (typeof e == "string")
     return e;
   let t, r = "";
   for (let o = 0; o < e.length; o++)
-    e[o] && (t = Me(e[o])) && (r && (r += " "), r += t);
+    e[o] && (t = Se(e[o])) && (r && (r += " "), r += t);
   return r;
 };
-function or(e, ...t) {
+function sr(e, ...t) {
   let r, o, n, c = l;
   function l(m) {
     const b = t.reduce((h, v) => v(h), e());
-    return r = Ye(b), o = r.cache.get, n = r.cache.set, c = u, u(m);
+    return r = er(b), o = r.cache.get, n = r.cache.set, c = p, p(m);
   }
-  function u(m) {
+  function p(m) {
     const b = o(m);
     if (b)
       return b;
-    const h = er(m, r);
+    const h = or(m, r);
     return n(m, h), h;
   }
   return function() {
-    return c(rr.apply(null, arguments));
+    return c(tr.apply(null, arguments));
   };
 }
 const g = (e) => {
   const t = (r) => r[e] || [];
   return t.isThemeGetter = !0, t;
-}, Ne = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, Ae = /^\((?:(\w[\w-]*):)?(.+)\)$/i, tr = /^\d+\/\d+$/, sr = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, ar = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, nr = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, lr = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, ir = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, j = (e) => tr.test(e), p = (e) => !!e && !Number.isNaN(Number(e)), A = (e) => !!e && Number.isInteger(Number(e)), se = (e) => e.endsWith("%") && p(e.slice(0, -1)), M = (e) => sr.test(e), cr = () => !0, dr = (e) => (
+}, Fe = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, Me = /^\((?:(\w[\w-]*):)?(.+)\)$/i, ar = /^\d+\/\d+$/, nr = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, lr = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, ir = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, cr = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, dr = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, L = (e) => ar.test(e), u = (e) => !!e && !Number.isNaN(Number(e)), A = (e) => !!e && Number.isInteger(Number(e)), se = (e) => e.endsWith("%") && u(e.slice(0, -1)), S = (e) => nr.test(e), mr = () => !0, pr = (e) => (
   // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
   // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
-  ar.test(e) && !nr.test(e)
-), Re = () => !1, mr = (e) => lr.test(e), pr = (e) => ir.test(e), ur = (e) => !s(e) && !a(e), fr = (e) => O(e, Pe, Re), s = (e) => Ne.test(e), T = (e) => O(e, Te, dr), ae = (e) => O(e, yr, p), ke = (e) => O(e, Fe, Re), gr = (e) => O(e, Ie, pr), Z = (e) => O(e, Ge, mr), a = (e) => Ae.test(e), U = (e) => V(e, Te), br = (e) => V(e, wr), ve = (e) => V(e, Fe), hr = (e) => V(e, Pe), xr = (e) => V(e, Ie), ee = (e) => V(e, Ge, !0), O = (e, t, r) => {
-  const o = Ne.exec(e);
+  lr.test(e) && !ir.test(e)
+), Ae = () => !1, ur = (e) => cr.test(e), fr = (e) => dr.test(e), gr = (e) => !s(e) && !a(e), br = (e) => V(e, Pe, Ae), s = (e) => Fe.test(e), T = (e) => V(e, Ge, pr), ae = (e) => V(e, kr, u), ve = (e) => V(e, Re, Ae), hr = (e) => V(e, Ie, fr), Z = (e) => V(e, Te, ur), a = (e) => Me.test(e), H = (e) => W(e, Ge), xr = (e) => W(e, vr), Ce = (e) => W(e, Re), yr = (e) => W(e, Pe), wr = (e) => W(e, Ie), ee = (e) => W(e, Te, !0), V = (e, t, r) => {
+  const o = Fe.exec(e);
   return o ? o[1] ? t(o[1]) : r(o[2]) : !1;
-}, V = (e, t, r = !1) => {
-  const o = Ae.exec(e);
+}, W = (e, t, r = !1) => {
+  const o = Me.exec(e);
   return o ? o[1] ? t(o[1]) : r : !1;
-}, Fe = (e) => e === "position" || e === "percentage", Ie = (e) => e === "image" || e === "url", Pe = (e) => e === "length" || e === "size" || e === "bg-size", Te = (e) => e === "length", yr = (e) => e === "number", wr = (e) => e === "family-name", Ge = (e) => e === "shadow", kr = () => {
-  const e = g("color"), t = g("font"), r = g("text"), o = g("font-weight"), n = g("tracking"), c = g("leading"), l = g("breakpoint"), u = g("container"), m = g("spacing"), b = g("radius"), h = g("shadow"), v = g("inset-shadow"), R = g("text-shadow"), N = g("drop-shadow"), k = g("blur"), C = g("perspective"), G = g("aspect"), F = g("ease"), q = g("animate"), _ = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], E = () => [
+}, Re = (e) => e === "position" || e === "percentage", Ie = (e) => e === "image" || e === "url", Pe = (e) => e === "length" || e === "size" || e === "bg-size", Ge = (e) => e === "length", kr = (e) => e === "number", vr = (e) => e === "family-name", Te = (e) => e === "shadow", Cr = () => {
+  const e = g("color"), t = g("font"), r = g("text"), o = g("font-weight"), n = g("tracking"), c = g("leading"), l = g("breakpoint"), p = g("container"), m = g("spacing"), b = g("radius"), h = g("shadow"), v = g("inset-shadow"), R = g("text-shadow"), M = g("drop-shadow"), k = g("blur"), C = g("perspective"), E = g("aspect"), I = g("ease"), q = g("animate"), D = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], B = () => [
     "center",
     "top",
     "bottom",
@@ -332,15 +334,15 @@ const g = (e) => {
     "bottom-left",
     // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
     "left-bottom"
-  ], B = () => [...E(), a, s], I = () => ["auto", "hidden", "clip", "visible", "scroll"], D = () => ["auto", "contain", "none"], d = () => [a, s, m], z = () => [j, "full", "auto", ...d()], de = () => [A, "none", "subgrid", a, s], me = () => ["auto", {
+  ], $ = () => [...B(), a, s], P = () => ["auto", "hidden", "clip", "visible", "scroll"], U = () => ["auto", "contain", "none"], d = () => [a, s, m], z = () => [L, "full", "auto", ...d()], me = () => [A, "none", "subgrid", a, s], pe = () => ["auto", {
     span: ["full", A, a, s]
-  }, A, a, s], J = () => [A, "auto", a, s], pe = () => ["auto", "min", "max", "fr", a, s], re = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], $ = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], S = () => ["auto", ...d()], P = () => [j, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...d()], i = () => [e, a, s], ue = () => [...E(), ve, ke, {
+  }, A, a, s], J = () => [A, "auto", a, s], ue = () => ["auto", "min", "max", "fr", a, s], re = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], j = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], N = () => ["auto", ...d()], G = () => [L, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...d()], i = () => [e, a, s], fe = () => [...B(), Ce, ve, {
     position: [a, s]
-  }], fe = () => ["no-repeat", {
+  }], ge = () => ["no-repeat", {
     repeat: ["", "x", "y", "space", "round"]
-  }], ge = () => ["auto", "cover", "contain", hr, fr, {
+  }], be = () => ["auto", "cover", "contain", yr, br, {
     size: [a, s]
-  }], oe = () => [se, U, T], y = () => [
+  }], oe = () => [se, H, T], y = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
@@ -348,35 +350,35 @@ const g = (e) => {
     b,
     a,
     s
-  ], w = () => ["", p, U, T], X = () => ["solid", "dashed", "dotted", "double"], be = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], x = () => [p, se, ve, ke], he = () => [
+  ], w = () => ["", u, H, T], X = () => ["solid", "dashed", "dotted", "double"], he = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], x = () => [u, se, Ce, ve], xe = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
     k,
     a,
     s
-  ], K = () => ["none", p, a, s], Q = () => ["none", p, a, s], te = () => [p, a, s], Y = () => [j, "full", ...d()];
+  ], K = () => ["none", u, a, s], Q = () => ["none", u, a, s], te = () => [u, a, s], Y = () => [L, "full", ...d()];
   return {
     cacheSize: 500,
     theme: {
       animate: ["spin", "ping", "pulse", "bounce"],
       aspect: ["video"],
-      blur: [M],
-      breakpoint: [M],
-      color: [cr],
-      container: [M],
-      "drop-shadow": [M],
+      blur: [S],
+      breakpoint: [S],
+      color: [mr],
+      container: [S],
+      "drop-shadow": [S],
       ease: ["in", "out", "in-out"],
-      font: [ur],
+      font: [gr],
       "font-weight": ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black"],
-      "inset-shadow": [M],
+      "inset-shadow": [S],
       leading: ["none", "tight", "snug", "normal", "relaxed", "loose"],
       perspective: ["dramatic", "near", "normal", "midrange", "distant", "none"],
-      radius: [M],
-      shadow: [M],
-      spacing: ["px", p],
-      text: [M],
-      "text-shadow": [M],
+      radius: [S],
+      shadow: [S],
+      spacing: ["px", u],
+      text: [S],
+      "text-shadow": [S],
       tracking: ["tighter", "tight", "normal", "wide", "wider", "widest"]
     },
     classGroups: {
@@ -388,7 +390,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/aspect-ratio
        */
       aspect: [{
-        aspect: ["auto", "square", j, s, a, G]
+        aspect: ["auto", "square", L, s, a, E]
       }],
       /**
        * Container
@@ -401,21 +403,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/columns
        */
       columns: [{
-        columns: [p, s, a, u]
+        columns: [u, s, a, p]
       }],
       /**
        * Break After
        * @see https://tailwindcss.com/docs/break-after
        */
       "break-after": [{
-        "break-after": _()
+        "break-after": D()
       }],
       /**
        * Break Before
        * @see https://tailwindcss.com/docs/break-before
        */
       "break-before": [{
-        "break-before": _()
+        "break-before": D()
       }],
       /**
        * Break Inside
@@ -479,49 +481,49 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/object-position
        */
       "object-position": [{
-        object: B()
+        object: $()
       }],
       /**
        * Overflow
        * @see https://tailwindcss.com/docs/overflow
        */
       overflow: [{
-        overflow: I()
+        overflow: P()
       }],
       /**
        * Overflow X
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-x": [{
-        "overflow-x": I()
+        "overflow-x": P()
       }],
       /**
        * Overflow Y
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-y": [{
-        "overflow-y": I()
+        "overflow-y": P()
       }],
       /**
        * Overscroll Behavior
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       overscroll: [{
-        overscroll: D()
+        overscroll: U()
       }],
       /**
        * Overscroll Behavior X
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-x": [{
-        "overscroll-x": D()
+        "overscroll-x": U()
       }],
       /**
        * Overscroll Behavior Y
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-y": [{
-        "overscroll-y": D()
+        "overscroll-y": U()
       }],
       /**
        * Position
@@ -611,7 +613,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/flex-basis
        */
       basis: [{
-        basis: [j, "full", "auto", u, ...d()]
+        basis: [L, "full", "auto", p, ...d()]
       }],
       /**
        * Flex Direction
@@ -632,21 +634,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/flex
        */
       flex: [{
-        flex: [p, j, "auto", "initial", "none", s]
+        flex: [u, L, "auto", "initial", "none", s]
       }],
       /**
        * Flex Grow
        * @see https://tailwindcss.com/docs/flex-grow
        */
       grow: [{
-        grow: ["", p, a, s]
+        grow: ["", u, a, s]
       }],
       /**
        * Flex Shrink
        * @see https://tailwindcss.com/docs/flex-shrink
        */
       shrink: [{
-        shrink: ["", p, a, s]
+        shrink: ["", u, a, s]
       }],
       /**
        * Order
@@ -660,14 +662,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/grid-template-columns
        */
       "grid-cols": [{
-        "grid-cols": de()
+        "grid-cols": me()
       }],
       /**
        * Grid Column Start / End
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-start-end": [{
-        col: me()
+        col: pe()
       }],
       /**
        * Grid Column Start
@@ -688,14 +690,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/grid-template-rows
        */
       "grid-rows": [{
-        "grid-rows": de()
+        "grid-rows": me()
       }],
       /**
        * Grid Row Start / End
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-start-end": [{
-        row: me()
+        row: pe()
       }],
       /**
        * Grid Row Start
@@ -723,14 +725,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/grid-auto-columns
        */
       "auto-cols": [{
-        "auto-cols": pe()
+        "auto-cols": ue()
       }],
       /**
        * Grid Auto Rows
        * @see https://tailwindcss.com/docs/grid-auto-rows
        */
       "auto-rows": [{
-        "auto-rows": pe()
+        "auto-rows": ue()
       }],
       /**
        * Gap
@@ -765,14 +767,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/justify-items
        */
       "justify-items": [{
-        "justify-items": [...$(), "normal"]
+        "justify-items": [...j(), "normal"]
       }],
       /**
        * Justify Self
        * @see https://tailwindcss.com/docs/justify-self
        */
       "justify-self": [{
-        "justify-self": ["auto", ...$()]
+        "justify-self": ["auto", ...j()]
       }],
       /**
        * Align Content
@@ -786,7 +788,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/align-items
        */
       "align-items": [{
-        items: [...$(), {
+        items: [...j(), {
           baseline: ["", "last"]
         }]
       }],
@@ -795,7 +797,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/align-self
        */
       "align-self": [{
-        self: ["auto", ...$(), {
+        self: ["auto", ...j(), {
           baseline: ["", "last"]
         }]
       }],
@@ -811,14 +813,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/place-items
        */
       "place-items": [{
-        "place-items": [...$(), "baseline"]
+        "place-items": [...j(), "baseline"]
       }],
       /**
        * Place Self
        * @see https://tailwindcss.com/docs/place-self
        */
       "place-self": [{
-        "place-self": ["auto", ...$()]
+        "place-self": ["auto", ...j()]
       }],
       // Spacing
       /**
@@ -889,63 +891,63 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/margin
        */
       m: [{
-        m: S()
+        m: N()
       }],
       /**
        * Margin X
        * @see https://tailwindcss.com/docs/margin
        */
       mx: [{
-        mx: S()
+        mx: N()
       }],
       /**
        * Margin Y
        * @see https://tailwindcss.com/docs/margin
        */
       my: [{
-        my: S()
+        my: N()
       }],
       /**
        * Margin Start
        * @see https://tailwindcss.com/docs/margin
        */
       ms: [{
-        ms: S()
+        ms: N()
       }],
       /**
        * Margin End
        * @see https://tailwindcss.com/docs/margin
        */
       me: [{
-        me: S()
+        me: N()
       }],
       /**
        * Margin Top
        * @see https://tailwindcss.com/docs/margin
        */
       mt: [{
-        mt: S()
+        mt: N()
       }],
       /**
        * Margin Right
        * @see https://tailwindcss.com/docs/margin
        */
       mr: [{
-        mr: S()
+        mr: N()
       }],
       /**
        * Margin Bottom
        * @see https://tailwindcss.com/docs/margin
        */
       mb: [{
-        mb: S()
+        mb: N()
       }],
       /**
        * Margin Left
        * @see https://tailwindcss.com/docs/margin
        */
       ml: [{
-        ml: S()
+        ml: N()
       }],
       /**
        * Space Between X
@@ -979,14 +981,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/width#setting-both-width-and-height
        */
       size: [{
-        size: P()
+        size: G()
       }],
       /**
        * Width
        * @see https://tailwindcss.com/docs/width
        */
       w: [{
-        w: [u, "screen", ...P()]
+        w: [p, "screen", ...G()]
       }],
       /**
        * Min-Width
@@ -994,11 +996,11 @@ const g = (e) => {
        */
       "min-w": [{
         "min-w": [
-          u,
+          p,
           "screen",
           /** Deprecated. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
           "none",
-          ...P()
+          ...G()
         ]
       }],
       /**
@@ -1007,7 +1009,7 @@ const g = (e) => {
        */
       "max-w": [{
         "max-w": [
-          u,
+          p,
           "screen",
           "none",
           /** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
@@ -1016,7 +1018,7 @@ const g = (e) => {
           {
             screen: [l]
           },
-          ...P()
+          ...G()
         ]
       }],
       /**
@@ -1024,21 +1026,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/height
        */
       h: [{
-        h: ["screen", "lh", ...P()]
+        h: ["screen", "lh", ...G()]
       }],
       /**
        * Min-Height
        * @see https://tailwindcss.com/docs/min-height
        */
       "min-h": [{
-        "min-h": ["screen", "lh", "none", ...P()]
+        "min-h": ["screen", "lh", "none", ...G()]
       }],
       /**
        * Max-Height
        * @see https://tailwindcss.com/docs/max-height
        */
       "max-h": [{
-        "max-h": ["screen", "lh", ...P()]
+        "max-h": ["screen", "lh", ...G()]
       }],
       // ------------------
       // --- Typography ---
@@ -1048,7 +1050,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/font-size
        */
       "font-size": [{
-        text: ["base", r, U, T]
+        text: ["base", r, H, T]
       }],
       /**
        * Font Smoothing
@@ -1079,7 +1081,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/font-family
        */
       "font-family": [{
-        font: [br, s, t]
+        font: [xr, s, t]
       }],
       /**
        * Font Variant Numeric
@@ -1123,7 +1125,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/line-clamp
        */
       "line-clamp": [{
-        "line-clamp": [p, "none", a, ae]
+        "line-clamp": [u, "none", a, ae]
       }],
       /**
        * Line Height
@@ -1196,7 +1198,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/text-decoration-thickness
        */
       "text-decoration-thickness": [{
-        decoration: [p, "from-font", "auto", a, T]
+        decoration: [u, "from-font", "auto", a, T]
       }],
       /**
        * Text Decoration Color
@@ -1210,7 +1212,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": [p, "auto", a, s]
+        "underline-offset": [u, "auto", a, s]
       }],
       /**
        * Text Transform
@@ -1307,21 +1309,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/background-position
        */
       "bg-position": [{
-        bg: ue()
+        bg: fe()
       }],
       /**
        * Background Repeat
        * @see https://tailwindcss.com/docs/background-repeat
        */
       "bg-repeat": [{
-        bg: fe()
+        bg: ge()
       }],
       /**
        * Background Size
        * @see https://tailwindcss.com/docs/background-size
        */
       "bg-size": [{
-        bg: ge()
+        bg: be()
       }],
       /**
        * Background Image
@@ -1334,7 +1336,7 @@ const g = (e) => {
           }, A, a, s],
           radial: ["", a, s],
           conic: [A, a, s]
-        }, xr, gr]
+        }, wr, hr]
       }],
       /**
        * Background Color
@@ -1676,14 +1678,14 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [p, a, s]
+        "outline-offset": [u, a, s]
       }],
       /**
        * Outline Width
        * @see https://tailwindcss.com/docs/outline-width
        */
       "outline-w": [{
-        outline: ["", p, U, T]
+        outline: ["", u, H, T]
       }],
       /**
        * Outline Color
@@ -1758,7 +1760,7 @@ const g = (e) => {
        * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
        */
       "ring-offset-w": [{
-        "ring-offset": [p, T]
+        "ring-offset": [u, T]
       }],
       /**
        * Ring Offset Color
@@ -1802,21 +1804,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/opacity
        */
       opacity: [{
-        opacity: [p, a, s]
+        opacity: [u, a, s]
       }],
       /**
        * Mix Blend Mode
        * @see https://tailwindcss.com/docs/mix-blend-mode
        */
       "mix-blend": [{
-        "mix-blend": [...be(), "plus-darker", "plus-lighter"]
+        "mix-blend": [...he(), "plus-darker", "plus-lighter"]
       }],
       /**
        * Background Blend Mode
        * @see https://tailwindcss.com/docs/background-blend-mode
        */
       "bg-blend": [{
-        "bg-blend": be()
+        "bg-blend": he()
       }],
       /**
        * Mask Clip
@@ -1837,7 +1839,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/mask-image
        */
       "mask-image-linear-pos": [{
-        "mask-linear": [p]
+        "mask-linear": [u]
       }],
       "mask-image-linear-from-pos": [{
         "mask-linear-from": x()
@@ -1948,10 +1950,10 @@ const g = (e) => {
         }]
       }],
       "mask-image-radial-pos": [{
-        "mask-radial-at": E()
+        "mask-radial-at": B()
       }],
       "mask-image-conic-pos": [{
-        "mask-conic": [p]
+        "mask-conic": [u]
       }],
       "mask-image-conic-from-pos": [{
         "mask-conic-from": x()
@@ -1984,21 +1986,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/mask-position
        */
       "mask-position": [{
-        mask: ue()
+        mask: fe()
       }],
       /**
        * Mask Repeat
        * @see https://tailwindcss.com/docs/mask-repeat
        */
       "mask-repeat": [{
-        mask: fe()
+        mask: ge()
       }],
       /**
        * Mask Size
        * @see https://tailwindcss.com/docs/mask-size
        */
       "mask-size": [{
-        mask: ge()
+        mask: be()
       }],
       /**
        * Mask Type
@@ -2035,21 +2037,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/blur
        */
       blur: [{
-        blur: he()
+        blur: xe()
       }],
       /**
        * Brightness
        * @see https://tailwindcss.com/docs/brightness
        */
       brightness: [{
-        brightness: [p, a, s]
+        brightness: [u, a, s]
       }],
       /**
        * Contrast
        * @see https://tailwindcss.com/docs/contrast
        */
       contrast: [{
-        contrast: [p, a, s]
+        contrast: [u, a, s]
       }],
       /**
        * Drop Shadow
@@ -2060,7 +2062,7 @@ const g = (e) => {
           // Deprecated since Tailwind CSS v4.0.0
           "",
           "none",
-          N,
+          M,
           ee,
           Z
         ]
@@ -2077,35 +2079,35 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/grayscale
        */
       grayscale: [{
-        grayscale: ["", p, a, s]
+        grayscale: ["", u, a, s]
       }],
       /**
        * Hue Rotate
        * @see https://tailwindcss.com/docs/hue-rotate
        */
       "hue-rotate": [{
-        "hue-rotate": [p, a, s]
+        "hue-rotate": [u, a, s]
       }],
       /**
        * Invert
        * @see https://tailwindcss.com/docs/invert
        */
       invert: [{
-        invert: ["", p, a, s]
+        invert: ["", u, a, s]
       }],
       /**
        * Saturate
        * @see https://tailwindcss.com/docs/saturate
        */
       saturate: [{
-        saturate: [p, a, s]
+        saturate: [u, a, s]
       }],
       /**
        * Sepia
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: ["", p, a, s]
+        sepia: ["", u, a, s]
       }],
       /**
        * Backdrop Filter
@@ -2125,63 +2127,63 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/backdrop-blur
        */
       "backdrop-blur": [{
-        "backdrop-blur": he()
+        "backdrop-blur": xe()
       }],
       /**
        * Backdrop Brightness
        * @see https://tailwindcss.com/docs/backdrop-brightness
        */
       "backdrop-brightness": [{
-        "backdrop-brightness": [p, a, s]
+        "backdrop-brightness": [u, a, s]
       }],
       /**
        * Backdrop Contrast
        * @see https://tailwindcss.com/docs/backdrop-contrast
        */
       "backdrop-contrast": [{
-        "backdrop-contrast": [p, a, s]
+        "backdrop-contrast": [u, a, s]
       }],
       /**
        * Backdrop Grayscale
        * @see https://tailwindcss.com/docs/backdrop-grayscale
        */
       "backdrop-grayscale": [{
-        "backdrop-grayscale": ["", p, a, s]
+        "backdrop-grayscale": ["", u, a, s]
       }],
       /**
        * Backdrop Hue Rotate
        * @see https://tailwindcss.com/docs/backdrop-hue-rotate
        */
       "backdrop-hue-rotate": [{
-        "backdrop-hue-rotate": [p, a, s]
+        "backdrop-hue-rotate": [u, a, s]
       }],
       /**
        * Backdrop Invert
        * @see https://tailwindcss.com/docs/backdrop-invert
        */
       "backdrop-invert": [{
-        "backdrop-invert": ["", p, a, s]
+        "backdrop-invert": ["", u, a, s]
       }],
       /**
        * Backdrop Opacity
        * @see https://tailwindcss.com/docs/backdrop-opacity
        */
       "backdrop-opacity": [{
-        "backdrop-opacity": [p, a, s]
+        "backdrop-opacity": [u, a, s]
       }],
       /**
        * Backdrop Saturate
        * @see https://tailwindcss.com/docs/backdrop-saturate
        */
       "backdrop-saturate": [{
-        "backdrop-saturate": [p, a, s]
+        "backdrop-saturate": [u, a, s]
       }],
       /**
        * Backdrop Sepia
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": ["", p, a, s]
+        "backdrop-sepia": ["", u, a, s]
       }],
       // --------------
       // --- Tables ---
@@ -2250,21 +2252,21 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: [p, "initial", a, s]
+        duration: [u, "initial", a, s]
       }],
       /**
        * Transition Timing Function
        * @see https://tailwindcss.com/docs/transition-timing-function
        */
       ease: [{
-        ease: ["linear", "initial", F, a, s]
+        ease: ["linear", "initial", I, a, s]
       }],
       /**
        * Transition Delay
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: [p, a, s]
+        delay: [u, a, s]
       }],
       /**
        * Animation
@@ -2295,7 +2297,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/perspective-origin
        */
       "perspective-origin": [{
-        "perspective-origin": B()
+        "perspective-origin": $()
       }],
       /**
        * Rotate
@@ -2391,7 +2393,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/transform-origin
        */
       "transform-origin": [{
-        origin: B()
+        origin: $()
       }],
       /**
        * Transform Style
@@ -2708,7 +2710,7 @@ const g = (e) => {
        * @see https://tailwindcss.com/docs/stroke-width
        */
       "stroke-w": [{
-        stroke: [p, U, T, ae]
+        stroke: [u, H, T, ae]
       }],
       /**
        * Stroke
@@ -2783,15 +2785,15 @@ const g = (e) => {
     },
     orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
   };
-}, vr = /* @__PURE__ */ or(kr);
-function W(...e) {
-  return vr(We(e));
+}, zr = /* @__PURE__ */ sr(Cr);
+function _(...e) {
+  return zr(De(e));
 }
-const Ee = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
+const Ee = O.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
   "div",
   {
     ref: r,
-    className: W(
+    className: _(
       "rounded-xl border bg-card text-card-foreground shadow",
       e
     ),
@@ -2799,44 +2801,44 @@ const Ee = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
   }
 ));
 Ee.displayName = "Card";
-const Be = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f("div", { ref: r, className: W("flex", e), ...t }));
+const Be = O.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f("div", { ref: r, className: _("flex", e), ...t }));
 Be.displayName = "CardHeader";
-const $e = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
+const $e = O.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
   "div",
   {
     ref: r,
-    className: W("font-semibold leading-none tracking-tight", e),
+    className: _("font-semibold leading-none tracking-tight", e),
     ...t
   }
 ));
 $e.displayName = "CardTitle";
-const je = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
+const je = O.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
   "div",
   {
     ref: r,
-    className: W("text-sm text-muted-foreground", e),
+    className: _("text-sm text-muted-foreground", e),
     ...t
   }
 ));
 je.displayName = "CardDescription";
-const Le = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f("div", { ref: r, className: W("pt-0", e), ...t }));
+const Le = O.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f("div", { ref: r, className: _("pt-0", e), ...t }));
 Le.displayName = "CardContent";
-const Oe = L.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
+const Oe = O.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ f(
   "div",
   {
     ref: r,
-    className: W("flex items-center pt-0", e),
+    className: _("flex items-center pt-0", e),
     ...t
   }
 ));
 Oe.displayName = "CardFooter";
-const Cr = ({
+const Ve = ({
   color: e = "amber",
   onClick: t,
   customClass: r = "",
   iconSrc: o
 }) => {
-  const n = Ce[e];
+  const n = ce[e];
   return /* @__PURE__ */ f(
     "button",
     {
@@ -2859,7 +2861,7 @@ const Cr = ({
       ) })
     }
   );
-}, Mr = ({
+}, Nr = ({
   title: e,
   description: t,
   children: r,
@@ -2867,16 +2869,16 @@ const Cr = ({
   customClass: n = "",
   button: c = !1,
   buttonLabel: l = "Button",
-  buttonPosition: u = "top-right",
+  buttonPosition: p = "top-right",
   bgIconColor: m = "lightBlue",
   buttonColor: b = "lightBlue",
   buttonVariant: h = "primary",
   buttonSize: v = "medium",
   onButtonClick: R
 }) => {
-  const N = R ?? (() => {
+  const M = R ?? (() => {
   });
-  return /* @__PURE__ */ H(
+  return /* @__PURE__ */ F(
     Ee,
     {
       className: `
@@ -2887,10 +2889,10 @@ const Cr = ({
         ${n}
       `,
       children: [
-        (e || t || c && u === "top-right") && /* @__PURE__ */ H(Be, { className: "mb-4 flex items-start justify-between", children: [
-          /* @__PURE__ */ H("div", { className: "flex items-center gap-3", children: [
+        (e || t || c && p === "top-right") && /* @__PURE__ */ F(Be, { className: "mb-4 flex items-start justify-between", children: [
+          /* @__PURE__ */ F("div", { className: "flex items-center gap-3", children: [
             o && /* @__PURE__ */ f(
-              Cr,
+              Ve,
               {
                 color: m,
                 iconSrc: o,
@@ -2898,29 +2900,29 @@ const Cr = ({
                 }
               }
             ),
-            /* @__PURE__ */ H("div", { children: [
+            /* @__PURE__ */ F("div", { children: [
               e && /* @__PURE__ */ f($e, { className: "text-main text-xl font-gabaritoBold font-medium leading-5 sm:text-lg md:text-xl", children: e }),
               t && /* @__PURE__ */ f(je, { className: "text-sm sm:text-base text-gray-600", children: t })
             ] })
           ] }),
-          c && u === "top-right" && /* @__PURE__ */ f(
-            xe,
+          c && p === "top-right" && /* @__PURE__ */ f(
+            ye,
             {
               label: l,
               size: v,
-              onClick: N,
+              onClick: M,
               color: b,
               variant: h
             }
           )
         ] }),
         r && /* @__PURE__ */ f(Le, { className: "flex flex-col gap-3 font-regular", children: r }),
-        c && u === "bottom-right" && /* @__PURE__ */ f(Oe, { className: "flex justify-end pt-2", children: /* @__PURE__ */ f(
-          xe,
+        c && p === "bottom-right" && /* @__PURE__ */ f(Oe, { className: "flex justify-end pt-2", children: /* @__PURE__ */ f(
+          ye,
           {
             label: l,
             size: v,
-            onClick: N,
+            onClick: M,
             color: b,
             variant: h
           }
@@ -2928,15 +2930,15 @@ const Cr = ({
       ]
     }
   );
-}, Nr = ({
+}, Mr = ({
   color: e = "lightBlue"
 }) => {
-  const [t, r] = Ve(!1), o = {
+  const [t, r] = We(!1), o = {
     lightBlue: "bg-blue-500",
     amber: "bg-amber-500",
     cyan: "bg-cyan-500"
   };
-  return /* @__PURE__ */ H("div", { className: "inline-block relative w-12 h-6", children: [
+  return /* @__PURE__ */ F("div", { className: "inline-block relative w-12 h-6", children: [
     /* @__PURE__ */ f(
       "input",
       {
@@ -2963,9 +2965,50 @@ const Cr = ({
       }
     )
   ] });
+}, Ar = ({
+  bgIconColor: e = "lightBlue",
+  iconSrc: t = "",
+  label: r = "",
+  percentage: o = 0,
+  showCard: n = !1,
+  showPercentage: c = !1
+}) => {
+  const l = ce[e], p = /* @__PURE__ */ F("div", { className: "flex w-full items-center", children: [
+    /* @__PURE__ */ f(Ve, { color: e, iconSrc: t, onClick: () => {
+    } }),
+    /* @__PURE__ */ F("div", { className: "flex flex-col ml-3 flex-1", children: [
+      /* @__PURE__ */ F("div", { className: "flex justify-between mb-1 items-end", children: [
+        r && /* @__PURE__ */ f("p", { className: "font-semibold text-gray-800 text-lg", children: r }),
+        c && /* @__PURE__ */ F("span", { className: "text-base text-gray-500", children: [
+          o,
+          "%"
+        ] })
+      ] }),
+      /* @__PURE__ */ f(
+        "div",
+        {
+          className: "relative w-full h-4 rounded-2xl overflow-hidden",
+          style: { backgroundColor: _e.Gray.value },
+          children: /* @__PURE__ */ f(
+            "div",
+            {
+              className: "absolute top-0 left-0 h-full rounded-2xl transition-all duration-300",
+              style: {
+                width: `${o}%`,
+                background: "linear-gradient(to right, #FFC801, #FFC801)",
+                boxShadow: `0 1px 2px ${l.primary.dark}`
+              }
+            }
+          )
+        }
+      )
+    ] })
+  ] });
+  return n ? /* @__PURE__ */ f(Nr, { children: p }) : p;
 };
 export {
-  xe as Button,
-  Mr as Card,
-  Nr as Toggle
+  ye as Button,
+  Nr as Card,
+  Ar as ProgressBar,
+  Mr as Toggle
 };