cyberui-2045 2.3.0 → 2.3.1

package/dist/index.es.js

@@ -1,6 +1,6 @@
-import Ee, { useCallback as D, useState as Z, useEffect as oe, useRef as te, useId as Be, memo as _e, useMemo as pe, createContext as lt, useContext as it } from "react";
+import Te, { useCallback as D, useState as Z, useEffect as oe, useRef as te, useId as Be, memo as _e, useMemo as pe, createContext as ct, useContext as dt } from "react";
 import { createPortal as Fe } from "react-dom";
-var ve = { exports: {} }, he = {};
+var ve = { exports: {} }, ge = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -10,10 +10,10 @@ var ve = { exports: {} }, he = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Ae;
-function ct() {
-  if (Ae) return he;
-  Ae = 1;
+var Me;
+function ut() {
+  if (Me) return ge;
+  Me = 1;
   var e = Symbol.for("react.transitional.element"), r = Symbol.for("react.fragment");
   function a(s, n, c) {
     var l = null;
@@ -30,9 +30,9 @@ function ct() {
       props: c
     };
   }
-  return he.Fragment = r, he.jsx = a, he.jsxs = a, he;
+  return ge.Fragment = r, ge.jsx = a, ge.jsxs = a, ge;
 }
-var ge = {};
+var he = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -42,13 +42,13 @@ var ge = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Me;
-function dt() {
-  return Me || (Me = 1, process.env.NODE_ENV !== "production" && function() {
+var Le;
+function mt() {
+  return Le || (Le = 1, process.env.NODE_ENV !== "production" && function() {
     function e(o) {
       if (o == null) return null;
       if (typeof o == "function")
-        return o.$$typeof === V ? null : o.displayName || o.name || null;
+        return o.$$typeof === U ? null : o.displayName || o.name || null;
       if (typeof o == "string") return o;
       switch (o) {
         case x:
@@ -59,7 +59,7 @@ function dt() {
           return "StrictMode";
         case C:
           return "Suspense";
-        case z:
+        case I:
           return "SuspenseList";
         case M:
           return "Activity";
@@ -70,11 +70,11 @@ function dt() {
         ), o.$$typeof) {
           case w:
             return "Portal";
-          case T:
+          case $:
             return (o.displayName || "Context") + ".Provider";
           case N:
             return (o._context.displayName || "Context") + ".Consumer";
-          case _:
+          case T:
             var u = o.render;
             return o = o.displayName, o || (o = u.displayName || u.name || "", o = o !== "" ? "ForwardRef(" + o + ")" : "ForwardRef"), o;
           case G:
@@ -147,13 +147,13 @@ function dt() {
     }
     function d() {
       var o = e(this.type);
-      return U[o] || (U[o] = !0, console.error(
+      return H[o] || (H[o] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), o = this.props.ref, o !== void 0 ? o : null;
     }
-    function g(o, u, b, R, S, E, I, W) {
+    function h(o, u, b, R, S, E, P, W) {
       return b = E.ref, o = {
-        $$typeof: h,
+        $$typeof: g,
         type: o,
         key: u,
         props: E,
@@ -175,7 +175,7 @@ function dt() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: I
+        value: P
       }), Object.defineProperty(o, "_debugTask", {
         configurable: !1,
         enumerable: !1,
@@ -183,7 +183,7 @@ function dt() {
         value: W
       }), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
     }
-    function m(o, u, b, R, S, E, I, W) {
+    function m(o, u, b, R, S, E, P, W) {
       var O = u.children;
       if (O !== void 0)
         if (R)
@@ -222,21 +222,21 @@ React keys must be passed directly to JSX without using spread:
       return O && i(
         b,
         typeof o == "function" ? o.displayName || o.name || "Unknown" : o
-      ), g(
+      ), h(
         o,
         O,
         E,
         S,
         n(),
         b,
-        I,
+        P,
         W
       );
     }
     function y(o) {
-      typeof o == "object" && o !== null && o.$$typeof === h && o._store && (o._store.validated = 1);
+      typeof o == "object" && o !== null && o.$$typeof === g && o._store && (o._store.validated = 1);
     }
-    var p = Ee, h = Symbol.for("react.transitional.element"), w = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), A = Symbol.for("react.profiler"), N = Symbol.for("react.consumer"), T = Symbol.for("react.context"), _ = Symbol.for("react.forward_ref"), C = Symbol.for("react.suspense"), z = Symbol.for("react.suspense_list"), G = Symbol.for("react.memo"), f = Symbol.for("react.lazy"), M = Symbol.for("react.activity"), V = Symbol.for("react.client.reference"), X = p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Q = Object.prototype.hasOwnProperty, re = Array.isArray, ee = console.createTask ? console.createTask : function() {
+    var p = Te, g = Symbol.for("react.transitional.element"), w = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), A = Symbol.for("react.profiler"), N = Symbol.for("react.consumer"), $ = Symbol.for("react.context"), T = Symbol.for("react.forward_ref"), C = Symbol.for("react.suspense"), I = Symbol.for("react.suspense_list"), G = Symbol.for("react.memo"), f = Symbol.for("react.lazy"), M = Symbol.for("react.activity"), U = Symbol.for("react.client.reference"), X = p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Q = Object.prototype.hasOwnProperty, re = Array.isArray, ee = console.createTask ? console.createTask : function() {
       return null;
     };
     p = {
@@ -244,11 +244,11 @@ React keys must be passed directly to JSX without using spread:
         return o();
       }
     };
-    var F, U = {}, q = p.react_stack_bottom_frame.bind(
+    var F, H = {}, q = p.react_stack_bottom_frame.bind(
       p,
       c
     )(), Y = ee(s(c)), K = {};
-    ge.Fragment = x, ge.jsx = function(o, u, b, R, S) {
+    he.Fragment = x, he.jsx = function(o, u, b, R, S) {
       var E = 1e4 > X.recentlyCreatedOwnerStacks++;
       return m(
         o,
@@ -260,7 +260,7 @@ React keys must be passed directly to JSX without using spread:
         E ? Error("react-stack-top-frame") : q,
         E ? ee(s(o)) : Y
       );
-    }, ge.jsxs = function(o, u, b, R, S) {
+    }, he.jsxs = function(o, u, b, R, S) {
       var E = 1e4 > X.recentlyCreatedOwnerStacks++;
       return m(
         o,
@@ -273,14 +273,14 @@ React keys must be passed directly to JSX without using spread:
         E ? ee(s(o)) : Y
       );
     };
-  }()), ge;
+  }()), he;
 }
-var Le;
-function ut() {
-  return Le || (Le = 1, process.env.NODE_ENV === "production" ? ve.exports = ct() : ve.exports = dt()), ve.exports;
+var Ie;
+function ft() {
+  return Ie || (Ie = 1, process.env.NODE_ENV === "production" ? ve.exports = ut() : ve.exports = mt()), ve.exports;
 }
-var t = ut();
-const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
+var t = ft();
+const $e = (e) => typeof e == "object" && e !== null, V = (e, r) => {
   if (!$e(e))
     return r[e] || "";
   const a = [];
@@ -305,7 +305,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     a.push(...s);
   }
   return a.join(" ");
-}, vr = (...e) => e.filter(Boolean).join(" "), ae = {
+}, zr = (...e) => e.filter(Boolean).join(" "), ae = {
   button: {
     sm: "py-1 px-4 text-sm",
     md: "py-2 px-6 text-lg",
@@ -358,26 +358,26 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     md: "h-64",
     lg: "h-80"
   }
-}, mt = {
+}, pt = {
   base: 0,
   sm: 640,
   md: 768,
   lg: 1024,
   xl: 1280,
   "2xl": 1536
-}, ft = (e, r, a) => {
+}, bt = (e, r, a) => {
   if (!$e(e))
     return e ?? a;
   let s = e.base ?? a;
   const n = ["sm", "md", "lg", "xl", "2xl"];
   for (const c of n) {
-    const l = mt[c];
+    const l = pt[c];
     r >= l && e[c] !== void 0 && (s = e[c]);
   }
   return s;
-}, Ve = (e, r) => {
+}, Ue = (e, r) => {
   const a = D(
-    () => typeof window > "u" ? r : ft(e, window.innerWidth, r),
+    () => typeof window > "u" ? r : bt(e, window.innerWidth, r),
     [r, e]
   ), [s, n] = Z(a);
   return oe(() => {
@@ -388,7 +388,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     const c = () => n(a());
     return c(), window.addEventListener("resize", c), () => window.removeEventListener("resize", c);
   }, [r, a, e]), s;
-}, pt = ({
+}, gt = ({
   tabs: e,
   activeTab: r,
   onTabChange: a,
@@ -398,29 +398,29 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
   menuClassName: l = "",
   menuItemClassName: i = "",
   dropdownLabel: d,
-  anchorIcon: g,
+  anchorIcon: h,
   showAnchorLabel: m = !0,
   anchorAriaLabel: y,
   closeOnSelect: p = !0
 }) => {
-  const [h, w] = Z(!1), [x, v] = Z(!1), [A, N] = Z(!1), [T, _] = Z(!1), C = te(null), z = te(null);
+  const [g, w] = Z(!1), [x, v] = Z(!1), [A, N] = Z(!1), [$, T] = Z(!1), C = te(null), I = te(null);
   oe(() => {
-    if (!h) return;
+    if (!g) return;
     const f = (M) => {
       C.current && !C.current.contains(M.target) && (N(!0), setTimeout(() => {
         w(!1), N(!1);
       }, 180));
     };
     return document.addEventListener("mousedown", f), () => document.removeEventListener("mousedown", f);
-  }, [h]), oe(() => {
-    if (!h) return;
-    const f = z.current;
+  }, [g]), oe(() => {
+    if (!g) return;
+    const f = I.current;
     if (!f) return;
     const M = f.getBoundingClientRect();
-    _(M.right > window.innerWidth);
-  }, [h]);
+    T(M.right > window.innerWidth);
+  }, [g]);
   const G = () => {
-    h ? (N(!0), setTimeout(() => {
+    g ? (N(!0), setTimeout(() => {
       w(!1), N(!1);
     }, 180)) : (v(!0), w(!0), setTimeout(() => v(!1), 30));
   };
@@ -431,10 +431,10 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
         onClick: G,
         className: `inline-flex items-center gap-2 ${s} bg-surface text-default border-2 border-border-default rounded-lg transition-all duration-300 hover:text-secondary hover:border-secondary hover:cursor-pointer shadow-secondary/30 ${c}`,
         "aria-haspopup": "menu",
-        "aria-expanded": h,
+        "aria-expanded": g,
         "aria-label": m ? void 0 : y ?? (typeof d == "string" ? d : "Open tabs"),
         children: [
-          g ?? /* @__PURE__ */ t.jsxs("svg", { className: "w-5 h-5", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: [
+          h ?? /* @__PURE__ */ t.jsxs("svg", { className: "w-5 h-5", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: [
             /* @__PURE__ */ t.jsx("rect", { x: "3", y: "5", width: "14", height: "2", rx: "1" }),
             /* @__PURE__ */ t.jsx("rect", { x: "3", y: "9", width: "14", height: "2", rx: "1" }),
             /* @__PURE__ */ t.jsx("rect", { x: "3", y: "13", width: "14", height: "2", rx: "1" })
@@ -443,12 +443,12 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
         ]
       }
     ),
-    (h || A) && /* @__PURE__ */ t.jsx(
+    (g || A) && /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: z,
-        "aria-hidden": !h,
-        className: `absolute ${T ? "right-0" : "left-0"} mt-2 min-w-40 z-50 bg-surface border-2 border-border-default rounded-lg shadow-secondary overflow-hidden ${l}
+        ref: I,
+        "aria-hidden": !g,
+        className: `absolute ${$ ? "right-0" : "left-0"} mt-2 min-w-40 z-50 bg-surface border-2 border-border-default rounded-lg shadow-secondary overflow-hidden ${l}
               transition-transform transition-opacity duration-200 ease-[cubic-bezier(.2,0,0,1)] transform-gpu origin-top will-change-transform will-change-opacity ${x || A ? "opacity-0 scale-y-0 pointer-events-none" : "opacity-100 scale-y-100 pointer-events-auto"}`,
         children: /* @__PURE__ */ t.jsx("div", { className: "py-1", children: e.map((f) => /* @__PURE__ */ t.jsx(
           "button",
@@ -466,7 +466,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
       }
     )
   ] }) });
-}, wr = ({
+}, ht = ({
   tabs: e,
   activeTab: r,
   onTabChange: a,
@@ -476,14 +476,14 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
   tabsClassName: l = "",
   dropdownLabel: i,
   anchorIcon: d,
-  showAnchorLabel: g = !0,
+  showAnchorLabel: h = !0,
   anchorAriaLabel: m,
   closeOnSelect: y = !0,
   anchorClassName: p = "",
-  menuClassName: h = "",
+  menuClassName: g = "",
   menuItemClassName: w = ""
 }) => {
-  const v = ((_) => H(_, ae.tabNavigation))(s), A = Ve(n, "scroll"), N = () => {
+  const v = ((T) => V(T, ae.tabNavigation))(s), A = Ue(n, "scroll"), N = () => {
     switch (A) {
       case "scroll":
         return "w-full overflow-x-auto overflow-y-hidden scrollbar-thin scrollbar-thumb-border-default scrollbar-track-transparent hover:scrollbar-thumb-secondary/50 py-1";
@@ -496,26 +496,26 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
       default:
         return "flex space-x-2";
     }
-  }, T = /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map((_) => /* @__PURE__ */ t.jsx(
+  }, $ = /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map((T) => /* @__PURE__ */ t.jsx(
     "button",
     {
-      onClick: () => a(_),
+      onClick: () => a(T),
       className: `
             ${v} font-bold transition-colors duration-200 rounded-t-lg cursor-pointer whitespace-nowrap flex-shrink-0 relative
             after:content-[''] after:absolute after:left-0 after:right-0 after:-bottom-[2px] after:h-[2px] after:w-full after:scale-x-0 after:origin-center after:transition-transform after:duration-300 after:ease-out
             before:content-[''] before:absolute before:left-1/2 before:-translate-x-1/2 before:-bottom-[6px] before:w-1.5 before:h-1.5 before:bg-accent before:rotate-45 before:rounded-[2px] before:opacity-0 before:transition-opacity before:duration-200
-            ${r === _ ? "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100" : "text-muted hover:text-secondary hover:before:opacity-70"}
+            ${r === T ? "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100" : "text-muted hover:text-secondary hover:before:opacity-70"}
             ${l}
           `,
       role: "tab",
-      "aria-selected": r === _,
-      tabIndex: r === _ ? 0 : -1,
-      children: _
+      "aria-selected": r === T,
+      tabIndex: r === T ? 0 : -1,
+      children: T
     },
-    _
+    T
   )) });
   return A === "dropdown" ? /* @__PURE__ */ t.jsx(
-    pt,
+    gt,
     {
       tabs: e,
       activeTab: r,
@@ -523,112 +523,114 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
       sizeClasses: v,
       containerClassName: c,
       anchorClassName: p,
-      menuClassName: h,
+      menuClassName: g,
       menuItemClassName: w,
       dropdownLabel: i,
       anchorIcon: d,
-      showAnchorLabel: g,
+      showAnchorLabel: h,
       anchorAriaLabel: m,
       closeOnSelect: y
     }
-  ) : A === "scroll" ? /* @__PURE__ */ t.jsx("div", { className: `${N()} ${c}`, role: "tablist", "aria-label": "Tabs", children: /* @__PURE__ */ t.jsx("div", { className: "w-max mx-auto flex space-x-2", children: T }) }) : /* @__PURE__ */ t.jsx("div", { className: `${N()} ${c}`, role: "tablist", "aria-label": "Tabs", children: T });
-}, bt = (e, r) => {
+  ) : A === "scroll" ? /* @__PURE__ */ t.jsx("div", { className: `${N()} ${c}`, role: "tablist", "aria-label": "Tabs", children: /* @__PURE__ */ t.jsx("div", { className: "w-max mx-auto flex space-x-2", children: $ }) }) : /* @__PURE__ */ t.jsx("div", { className: `${N()} ${c}`, role: "tablist", "aria-label": "Tabs", children: $ });
+};
+ht.displayName = "CyberUI.TabNavigation";
+const xt = (e, r) => {
   const a = new Array(e.length + r.length);
   for (let s = 0; s < e.length; s++)
     a[s] = e[s];
   for (let s = 0; s < r.length; s++)
     a[e.length + s] = r[s];
   return a;
-}, ht = (e, r) => ({
+}, yt = (e, r) => ({
   classGroupId: e,
   validator: r
-}), He = (e = /* @__PURE__ */ new Map(), r = null, a) => ({
+}), Ve = (e = /* @__PURE__ */ new Map(), r = null, a) => ({
   nextPart: e,
   validators: r,
   classGroupId: a
-}), Ne = "-", ze = [], gt = "arbitrary..", xt = (e) => {
-  const r = vt(e), {
+}), Ne = "-", ze = [], vt = "arbitrary..", wt = (e) => {
+  const r = jt(e), {
     conflictingClassGroups: a,
     conflictingClassGroupModifiers: s
   } = e;
   return {
     getClassGroupId: (l) => {
       if (l.startsWith("[") && l.endsWith("]"))
-        return yt(l);
+        return kt(l);
       const i = l.split(Ne), d = i[0] === "" && i.length > 1 ? 1 : 0;
-      return Ue(i, d, r);
+      return He(i, d, r);
     },
     getConflictingClassGroupIds: (l, i) => {
       if (i) {
-        const d = s[l], g = a[l];
-        return d ? g ? bt(g, d) : d : g || ze;
+        const d = s[l], h = a[l];
+        return d ? h ? xt(h, d) : d : h || ze;
       }
       return a[l] || ze;
     }
   };
-}, Ue = (e, r, a) => {
+}, He = (e, r, a) => {
   if (e.length - r === 0)
     return a.classGroupId;
   const n = e[r], c = a.nextPart.get(n);
   if (c) {
-    const g = Ue(e, r + 1, c);
-    if (g) return g;
+    const h = He(e, r + 1, c);
+    if (h) return h;
   }
   const l = a.validators;
   if (l === null)
     return;
   const i = r === 0 ? e.join(Ne) : e.slice(r).join(Ne), d = l.length;
-  for (let g = 0; g < d; g++) {
-    const m = l[g];
+  for (let h = 0; h < d; h++) {
+    const m = l[h];
     if (m.validator(i))
       return m.classGroupId;
   }
-}, yt = (e) => e.slice(1, -1).indexOf(":") === -1 ? void 0 : (() => {
+}, kt = (e) => e.slice(1, -1).indexOf(":") === -1 ? void 0 : (() => {
   const r = e.slice(1, -1), a = r.indexOf(":"), s = r.slice(0, a);
-  return s ? gt + s : void 0;
-})(), vt = (e) => {
+  return s ? vt + s : void 0;
+})(), jt = (e) => {
   const {
     theme: r,
     classGroups: a
   } = e;
-  return wt(a, r);
-}, wt = (e, r) => {
-  const a = He();
+  return Nt(a, r);
+}, Nt = (e, r) => {
+  const a = Ve();
   for (const s in e) {
     const n = e[s];
-    Te(n, a, s, r);
+    Re(n, a, s, r);
   }
   return a;
-}, Te = (e, r, a, s) => {
+}, Re = (e, r, a, s) => {
   const n = e.length;
   for (let c = 0; c < n; c++) {
     const l = e[c];
-    kt(l, r, a, s);
+    Ct(l, r, a, s);
   }
-}, kt = (e, r, a, s) => {
+}, Ct = (e, r, a, s) => {
   if (typeof e == "string") {
-    jt(e, r, a);
+    St(e, r, a);
     return;
   }
   if (typeof e == "function") {
-    Nt(e, r, a, s);
+    Et(e, r, a, s);
     return;
   }
-  Ct(e, r, a, s);
-}, jt = (e, r, a) => {
+  Tt(e, r, a, s);
+}, St = (e, r, a) => {
   const s = e === "" ? r : Ye(r, e);
   s.classGroupId = a;
-}, Nt = (e, r, a, s) => {
-  if (St(e)) {
-    Te(e(s), r, a, s);
+}, Et = (e, r, a, s) => {
+  if (_t(e)) {
+    Re(e(s), r, a, s);
     return;
   }
-  r.validators === null && (r.validators = []), r.validators.push(ht(a, e));
-}, Ct = (e, r, a, s) => {
+  r.validators === null && (r.validators = []), r.validators.push(yt(a, e));
+}, Tt = (e, r, a, s) => {
   const n = Object.entries(e), c = n.length;
   for (let l = 0; l < c; l++) {
     const [i, d] = n[l];
-    Te(d, Ye(r, i), a, s);
+    Re(d, Ye(r, i), a, s);
   }
 }, Ye = (e, r) => {
   let a = e;
@@ -636,10 +638,10 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
   for (let c = 0; c < n; c++) {
     const l = s[c];
     let i = a.nextPart.get(l);
-    i || (i = He(), a.nextPart.set(l, i)), a = i;
+    i || (i = Ve(), a.nextPart.set(l, i)), a = i;
   }
   return a;
-}, St = (e) => "isThemeGetter" in e && e.isThemeGetter === !0, Et = (e) => {
+}, _t = (e) => "isThemeGetter" in e && e.isThemeGetter === !0, $t = (e) => {
   if (e < 1)
     return {
       get: () => {
@@ -663,20 +665,20 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
       c in a ? a[c] = l : n(c, l);
     }
   };
-}, Se = "!", Pe = ":", _t = [], Ie = (e, r, a, s, n) => ({
+}, Se = "!", Pe = ":", Rt = [], Oe = (e, r, a, s, n) => ({
   modifiers: e,
   hasImportantModifier: r,
   baseClassName: a,
   maybePostfixModifierPosition: s,
   isExternal: n
-}), $t = (e) => {
+}), At = (e) => {
   const {
     prefix: r,
     experimentalParseClassName: a
   } = e;
   let s = (n) => {
     const c = [];
-    let l = 0, i = 0, d = 0, g;
+    let l = 0, i = 0, d = 0, h;
     const m = n.length;
     for (let x = 0; x < m; x++) {
       const v = n[x];
@@ -686,27 +688,27 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
           continue;
         }
         if (v === "/") {
-          g = x;
+          h = x;
           continue;
         }
       }
       v === "[" ? l++ : v === "]" ? l-- : v === "(" ? i++ : v === ")" && i--;
     }
     const y = c.length === 0 ? n : n.slice(d);
-    let p = y, h = !1;
-    y.endsWith(Se) ? (p = y.slice(0, -1), h = !0) : (
+    let p = y, g = !1;
+    y.endsWith(Se) ? (p = y.slice(0, -1), g = !0) : (
       /**
        * In Tailwind CSS v3 the important modifier was at the start of the base class name. This is still supported for legacy reasons.
        * @see https://github.com/dcastil/tailwind-merge/issues/513#issuecomment-2614029864
        */
-      y.startsWith(Se) && (p = y.slice(1), h = !0)
+      y.startsWith(Se) && (p = y.slice(1), g = !0)
     );
-    const w = g && g > d ? g - d : void 0;
-    return Ie(c, h, p, w);
+    const w = h && h > d ? h - d : void 0;
+    return Oe(c, g, p, w);
   };
   if (r) {
     const n = r + Pe, c = s;
-    s = (l) => l.startsWith(n) ? c(l.slice(n.length)) : Ie(_t, !1, l, void 0, !0);
+    s = (l) => l.startsWith(n) ? c(l.slice(n.length)) : Oe(Rt, !1, l, void 0, !0);
   }
   if (a) {
     const n = s;
@@ -716,7 +718,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     });
   }
   return s;
-}, Tt = (e) => {
+}, Mt = (e) => {
   const r = /* @__PURE__ */ new Map();
   return e.orderSensitiveModifiers.forEach((a, s) => {
     r.set(a, 1e6 + s);
@@ -729,24 +731,24 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     }
     return n.length > 0 && (n.sort(), s.push(...n)), s;
   };
-}, Rt = (e) => ({
-  cache: Et(e.cacheSize),
-  parseClassName: $t(e),
-  sortModifiers: Tt(e),
-  ...xt(e)
-}), At = /\s+/, Mt = (e, r) => {
+}, Lt = (e) => ({
+  cache: $t(e.cacheSize),
+  parseClassName: At(e),
+  sortModifiers: Mt(e),
+  ...wt(e)
+}), It = /\s+/, zt = (e, r) => {
   const {
     parseClassName: a,
     getClassGroupId: s,
     getConflictingClassGroupIds: n,
     sortModifiers: c
-  } = r, l = [], i = e.trim().split(At);
+  } = r, l = [], i = e.trim().split(It);
   let d = "";
-  for (let g = i.length - 1; g >= 0; g -= 1) {
-    const m = i[g], {
+  for (let h = i.length - 1; h >= 0; h -= 1) {
+    const m = i[h], {
       isExternal: y,
       modifiers: p,
-      hasImportantModifier: h,
+      hasImportantModifier: g,
       baseClassName: w,
       maybePostfixModifierPosition: x
     } = a(m);
@@ -766,19 +768,19 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
       }
       v = !1;
     }
-    const N = p.length === 0 ? "" : p.length === 1 ? p[0] : c(p).join(":"), T = h ? N + Se : N, _ = T + A;
-    if (l.indexOf(_) > -1)
+    const N = p.length === 0 ? "" : p.length === 1 ? p[0] : c(p).join(":"), $ = g ? N + Se : N, T = $ + A;
+    if (l.indexOf(T) > -1)
       continue;
-    l.push(_);
+    l.push(T);
     const C = n(A, v);
-    for (let z = 0; z < C.length; ++z) {
-      const G = C[z];
-      l.push(T + G);
+    for (let I = 0; I < C.length; ++I) {
+      const G = C[I];
+      l.push($ + G);
     }
     d = m + (d.length > 0 ? " " + d : d);
   }
   return d;
-}, Lt = (...e) => {
+}, Pt = (...e) => {
   let r = 0, a, s, n = "";
   for (; r < e.length; )
     (a = e[r++]) && (s = Ze(a)) && (n && (n += " "), n += s);
@@ -790,35 +792,35 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
   for (let s = 0; s < e.length; s++)
     e[s] && (r = Ze(e[s])) && (a && (a += " "), a += r);
   return a;
-}, zt = (e, ...r) => {
+}, Ot = (e, ...r) => {
   let a, s, n, c;
   const l = (d) => {
-    const g = r.reduce((m, y) => y(m), e());
-    return a = Rt(g), s = a.cache.get, n = a.cache.set, c = i, i(d);
+    const h = r.reduce((m, y) => y(m), e());
+    return a = Lt(h), s = a.cache.get, n = a.cache.set, c = i, i(d);
   }, i = (d) => {
-    const g = s(d);
-    if (g)
-      return g;
-    const m = Mt(d, a);
+    const h = s(d);
+    if (h)
+      return h;
+    const m = zt(d, a);
     return n(d, m), m;
   };
-  return c = l, (...d) => c(Lt(...d));
-}, Pt = [], J = (e) => {
-  const r = (a) => a[e] || Pt;
+  return c = l, (...d) => c(Pt(...d));
+}, Dt = [], J = (e) => {
+  const r = (a) => a[e] || Dt;
   return r.isThemeGetter = !0, r;
-}, Xe = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, qe = /^\((?:(\w[\w-]*):)?(.+)\)$/i, It = /^\d+(?:\.\d+)?\/\d+(?:\.\d+)?$/, Ot = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Dt = /\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$/, Gt = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Wt = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Bt = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, ie = (e) => It.test(e), P = (e) => !!e && !Number.isNaN(Number(e)), ce = (e) => !!e && Number.isInteger(Number(e)), Ce = (e) => e.endsWith("%") && P(e.slice(0, -1)), le = (e) => Ot.test(e), Ke = () => !0, Ft = (e) => (
+}, Xe = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, qe = /^\((?:(\w[\w-]*):)?(.+)\)$/i, Gt = /^\d+(?:\.\d+)?\/\d+(?:\.\d+)?$/, Wt = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Bt = /\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$/, Ft = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Ut = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Vt = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, ie = (e) => Gt.test(e), z = (e) => !!e && !Number.isNaN(Number(e)), ce = (e) => !!e && Number.isInteger(Number(e)), Ce = (e) => e.endsWith("%") && z(e.slice(0, -1)), le = (e) => Wt.test(e), Ke = () => !0, Ht = (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.
-  Dt.test(e) && !Gt.test(e)
-), Re = () => !1, Vt = (e) => Wt.test(e), Ht = (e) => Bt.test(e), Ut = (e) => !k(e) && !j(e), Yt = (e) => de(e, et, Re), k = (e) => Xe.test(e), ue = (e) => de(e, tt, Ft), Oe = (e) => de(e, tr, P), Zt = (e) => de(e, st, Ke), Xt = (e) => de(e, rt, Re), De = (e) => de(e, Je, Re), qt = (e) => de(e, Qe, Ht), we = (e) => de(e, ot, Vt), j = (e) => qe.test(e), xe = (e) => me(e, tt), Kt = (e) => me(e, rt), Ge = (e) => me(e, Je), Jt = (e) => me(e, et), Qt = (e) => me(e, Qe), ke = (e) => me(e, ot, !0), er = (e) => me(e, st, !0), de = (e, r, a) => {
+  Bt.test(e) && !Ft.test(e)
+), Ae = () => !1, Yt = (e) => Ut.test(e), Zt = (e) => Vt.test(e), Xt = (e) => !k(e) && !j(e), qt = (e) => de(e, et, Ae), k = (e) => Xe.test(e), ue = (e) => de(e, tt, Ht), De = (e) => de(e, or, z), Kt = (e) => de(e, st, Ke), Jt = (e) => de(e, rt, Ae), Ge = (e) => de(e, Je, Ae), Qt = (e) => de(e, Qe, Zt), we = (e) => de(e, ot, Yt), j = (e) => qe.test(e), xe = (e) => me(e, tt), er = (e) => me(e, rt), We = (e) => me(e, Je), tr = (e) => me(e, et), rr = (e) => me(e, Qe), ke = (e) => me(e, ot, !0), sr = (e) => me(e, st, !0), de = (e, r, a) => {
   const s = Xe.exec(e);
   return s ? s[1] ? r(s[1]) : a(s[2]) : !1;
 }, me = (e, r, a = !1) => {
   const s = qe.exec(e);
   return s ? s[1] ? r(s[1]) : a : !1;
-}, Je = (e) => e === "position" || e === "percentage", Qe = (e) => e === "image" || e === "url", et = (e) => e === "length" || e === "size" || e === "bg-size", tt = (e) => e === "length", tr = (e) => e === "number", rt = (e) => e === "family-name", st = (e) => e === "number" || e === "weight", ot = (e) => e === "shadow", rr = () => {
-  const e = J("color"), r = J("font"), a = J("text"), s = J("font-weight"), n = J("tracking"), c = J("leading"), l = J("breakpoint"), i = J("container"), d = J("spacing"), g = J("radius"), m = J("shadow"), y = J("inset-shadow"), p = J("text-shadow"), h = J("drop-shadow"), w = J("blur"), x = J("perspective"), v = J("aspect"), A = J("ease"), N = J("animate"), T = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], _ = () => [
+}, Je = (e) => e === "position" || e === "percentage", Qe = (e) => e === "image" || e === "url", et = (e) => e === "length" || e === "size" || e === "bg-size", tt = (e) => e === "length", or = (e) => e === "number", rt = (e) => e === "family-name", st = (e) => e === "number" || e === "weight", ot = (e) => e === "shadow", ar = () => {
+  const e = J("color"), r = J("font"), a = J("text"), s = J("font-weight"), n = J("tracking"), c = J("leading"), l = J("breakpoint"), i = J("container"), d = J("spacing"), h = J("radius"), m = J("shadow"), y = J("inset-shadow"), p = J("text-shadow"), g = J("drop-shadow"), w = J("blur"), x = J("perspective"), v = J("aspect"), A = J("ease"), N = J("animate"), $ = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], T = () => [
     "center",
     "top",
     "bottom",
@@ -836,30 +838,30 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     "bottom-left",
     // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
     "left-bottom"
-  ], C = () => [..._(), j, k], z = () => ["auto", "hidden", "clip", "visible", "scroll"], G = () => ["auto", "contain", "none"], f = () => [j, k, d], M = () => [ie, "full", "auto", ...f()], V = () => [ce, "none", "subgrid", j, k], X = () => ["auto", {
+  ], C = () => [...T(), j, k], I = () => ["auto", "hidden", "clip", "visible", "scroll"], G = () => ["auto", "contain", "none"], f = () => [j, k, d], M = () => [ie, "full", "auto", ...f()], U = () => [ce, "none", "subgrid", j, k], X = () => ["auto", {
     span: ["full", ce, j, k]
-  }, ce, j, k], Q = () => [ce, "auto", j, k], re = () => ["auto", "min", "max", "fr", j, k], ee = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], F = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], U = () => ["auto", ...f()], q = () => [ie, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...f()], Y = () => [ie, "screen", "full", "dvw", "lvw", "svw", "min", "max", "fit", ...f()], K = () => [ie, "screen", "full", "lh", "dvh", "lvh", "svh", "min", "max", "fit", ...f()], o = () => [e, j, k], u = () => [..._(), Ge, De, {
+  }, ce, j, k], Q = () => [ce, "auto", j, k], re = () => ["auto", "min", "max", "fr", j, k], ee = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], F = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], H = () => ["auto", ...f()], q = () => [ie, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...f()], Y = () => [ie, "screen", "full", "dvw", "lvw", "svw", "min", "max", "fit", ...f()], K = () => [ie, "screen", "full", "lh", "dvh", "lvh", "svh", "min", "max", "fit", ...f()], o = () => [e, j, k], u = () => [...T(), We, Ge, {
     position: [j, k]
   }], b = () => ["no-repeat", {
     repeat: ["", "x", "y", "space", "round"]
-  }], R = () => ["auto", "cover", "contain", Jt, Yt, {
+  }], R = () => ["auto", "cover", "contain", tr, qt, {
     size: [j, k]
   }], S = () => [Ce, xe, ue], E = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
     "full",
-    g,
+    h,
     j,
     k
-  ], I = () => ["", P, xe, ue], W = () => ["solid", "dashed", "dotted", "double"], O = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], L = () => [P, Ce, Ge, De], B = () => [
+  ], P = () => ["", z, xe, ue], W = () => ["solid", "dashed", "dotted", "double"], O = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], L = () => [z, Ce, We, Ge], B = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
     w,
     j,
     k
-  ], se = () => ["none", P, j, k], fe = () => ["none", P, j, k], be = () => [P, j, k], ye = () => [ie, "full", ...f()];
+  ], se = () => ["none", z, j, k], fe = () => ["none", z, j, k], be = () => [z, j, k], ye = () => [ie, "full", ...f()];
   return {
     cacheSize: 500,
     theme: {
@@ -871,14 +873,14 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
       container: [le],
       "drop-shadow": [le],
       ease: ["in", "out", "in-out"],
-      font: [Ut],
+      font: [Xt],
       "font-weight": ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black"],
       "inset-shadow": [le],
       leading: ["none", "tight", "snug", "normal", "relaxed", "loose"],
       perspective: ["dramatic", "near", "normal", "midrange", "distant", "none"],
       radius: [le],
       shadow: [le],
-      spacing: ["px", P],
+      spacing: ["px", z],
       text: [le],
       "text-shadow": [le],
       tracking: ["tighter", "tight", "normal", "wide", "wider", "widest"]
@@ -905,21 +907,21 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/columns
        */
       columns: [{
-        columns: [P, k, j, i]
+        columns: [z, k, j, i]
       }],
       /**
        * Break After
        * @see https://tailwindcss.com/docs/break-after
        */
       "break-after": [{
-        "break-after": T()
+        "break-after": $()
       }],
       /**
        * Break Before
        * @see https://tailwindcss.com/docs/break-before
        */
       "break-before": [{
-        "break-before": T()
+        "break-before": $()
       }],
       /**
        * Break Inside
@@ -990,21 +992,21 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/overflow
        */
       overflow: [{
-        overflow: z()
+        overflow: I()
       }],
       /**
        * Overflow X
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-x": [{
-        "overflow-x": z()
+        "overflow-x": I()
       }],
       /**
        * Overflow Y
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-y": [{
-        "overflow-y": z()
+        "overflow-y": I()
       }],
       /**
        * Overscroll Behavior
@@ -1162,21 +1164,21 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/flex
        */
       flex: [{
-        flex: [P, ie, "auto", "initial", "none", k]
+        flex: [z, ie, "auto", "initial", "none", k]
       }],
       /**
        * Flex Grow
        * @see https://tailwindcss.com/docs/flex-grow
        */
       grow: [{
-        grow: ["", P, j, k]
+        grow: ["", z, j, k]
       }],
       /**
        * Flex Shrink
        * @see https://tailwindcss.com/docs/flex-shrink
        */
       shrink: [{
-        shrink: ["", P, j, k]
+        shrink: ["", z, j, k]
       }],
       /**
        * Order
@@ -1190,7 +1192,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/grid-template-columns
        */
       "grid-cols": [{
-        "grid-cols": V()
+        "grid-cols": U()
       }],
       /**
        * Grid Column Start / End
@@ -1218,7 +1220,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/grid-template-rows
        */
       "grid-rows": [{
-        "grid-rows": V()
+        "grid-rows": U()
       }],
       /**
        * Grid Row Start / End
@@ -1433,77 +1435,77 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/margin
        */
       m: [{
-        m: U()
+        m: H()
       }],
       /**
        * Margin Inline
        * @see https://tailwindcss.com/docs/margin
        */
       mx: [{
-        mx: U()
+        mx: H()
       }],
       /**
        * Margin Block
        * @see https://tailwindcss.com/docs/margin
        */
       my: [{
-        my: U()
+        my: H()
       }],
       /**
        * Margin Inline Start
        * @see https://tailwindcss.com/docs/margin
        */
       ms: [{
-        ms: U()
+        ms: H()
       }],
       /**
        * Margin Inline End
        * @see https://tailwindcss.com/docs/margin
        */
       me: [{
-        me: U()
+        me: H()
       }],
       /**
        * Margin Block Start
        * @see https://tailwindcss.com/docs/margin
        */
       mbs: [{
-        mbs: U()
+        mbs: H()
       }],
       /**
        * Margin Block End
        * @see https://tailwindcss.com/docs/margin
        */
       mbe: [{
-        mbe: U()
+        mbe: H()
       }],
       /**
        * Margin Top
        * @see https://tailwindcss.com/docs/margin
        */
       mt: [{
-        mt: U()
+        mt: H()
       }],
       /**
        * Margin Right
        * @see https://tailwindcss.com/docs/margin
        */
       mr: [{
-        mr: U()
+        mr: H()
       }],
       /**
        * Margin Bottom
        * @see https://tailwindcss.com/docs/margin
        */
       mb: [{
-        mb: U()
+        mb: H()
       }],
       /**
        * Margin Left
        * @see https://tailwindcss.com/docs/margin
        */
       ml: [{
-        ml: U()
+        ml: H()
       }],
       /**
        * Space Between X
@@ -1665,7 +1667,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/font-weight
        */
       "font-weight": [{
-        font: [s, er, Zt]
+        font: [s, sr, Kt]
       }],
       /**
        * Font Stretch
@@ -1679,7 +1681,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/font-family
        */
       "font-family": [{
-        font: [Kt, Xt, r]
+        font: [er, Jt, r]
       }],
       /**
        * Font Feature Settings
@@ -1730,7 +1732,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/line-clamp
        */
       "line-clamp": [{
-        "line-clamp": [P, "none", j, Oe]
+        "line-clamp": [z, "none", j, De]
       }],
       /**
        * Line Height
@@ -1803,7 +1805,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/text-decoration-thickness
        */
       "text-decoration-thickness": [{
-        decoration: [P, "from-font", "auto", j, ue]
+        decoration: [z, "from-font", "auto", j, ue]
       }],
       /**
        * Text Decoration Color
@@ -1817,7 +1819,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": [P, "auto", j, k]
+        "underline-offset": [z, "auto", j, k]
       }],
       /**
        * Text Transform
@@ -1941,7 +1943,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
           }, ce, j, k],
           radial: ["", j, k],
           conic: [ce, j, k]
-        }, Qt, qt]
+        }, rr, Qt]
       }],
       /**
        * Background Color
@@ -2105,84 +2107,84 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w": [{
-        border: I()
+        border: P()
       }],
       /**
        * Border Width Inline
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-x": [{
-        "border-x": I()
+        "border-x": P()
       }],
       /**
        * Border Width Block
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-y": [{
-        "border-y": I()
+        "border-y": P()
       }],
       /**
        * Border Width Inline Start
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-s": [{
-        "border-s": I()
+        "border-s": P()
       }],
       /**
        * Border Width Inline End
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-e": [{
-        "border-e": I()
+        "border-e": P()
       }],
       /**
        * Border Width Block Start
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-bs": [{
-        "border-bs": I()
+        "border-bs": P()
       }],
       /**
        * Border Width Block End
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-be": [{
-        "border-be": I()
+        "border-be": P()
       }],
       /**
        * Border Width Top
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-t": [{
-        "border-t": I()
+        "border-t": P()
       }],
       /**
        * Border Width Right
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-r": [{
-        "border-r": I()
+        "border-r": P()
       }],
       /**
        * Border Width Bottom
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-b": [{
-        "border-b": I()
+        "border-b": P()
       }],
       /**
        * Border Width Left
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-l": [{
-        "border-l": I()
+        "border-l": P()
       }],
       /**
        * Divide Width X
        * @see https://tailwindcss.com/docs/border-width#between-children
        */
       "divide-x": [{
-        "divide-x": I()
+        "divide-x": P()
       }],
       /**
        * Divide Width X Reverse
@@ -2194,7 +2196,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/border-width#between-children
        */
       "divide-y": [{
-        "divide-y": I()
+        "divide-y": P()
       }],
       /**
        * Divide Width Y Reverse
@@ -2311,14 +2313,14 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [P, j, k]
+        "outline-offset": [z, j, k]
       }],
       /**
        * Outline Width
        * @see https://tailwindcss.com/docs/outline-width
        */
       "outline-w": [{
-        outline: ["", P, xe, ue]
+        outline: ["", z, xe, ue]
       }],
       /**
        * Outline Color
@@ -2370,7 +2372,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-a-ring
        */
       "ring-w": [{
-        ring: I()
+        ring: P()
       }],
       /**
        * Ring Width Inset
@@ -2393,7 +2395,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
        */
       "ring-offset-w": [{
-        "ring-offset": [P, ue]
+        "ring-offset": [z, ue]
       }],
       /**
        * Ring Offset Color
@@ -2409,7 +2411,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-an-inset-ring
        */
       "inset-ring-w": [{
-        "inset-ring": I()
+        "inset-ring": P()
       }],
       /**
        * Inset Ring Color
@@ -2437,7 +2439,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/opacity
        */
       opacity: [{
-        opacity: [P, j, k]
+        opacity: [z, j, k]
       }],
       /**
        * Mix Blend Mode
@@ -2472,7 +2474,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/mask-image
        */
       "mask-image-linear-pos": [{
-        "mask-linear": [P]
+        "mask-linear": [z]
       }],
       "mask-image-linear-from-pos": [{
         "mask-linear-from": L()
@@ -2583,10 +2585,10 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
         }]
       }],
       "mask-image-radial-pos": [{
-        "mask-radial-at": _()
+        "mask-radial-at": T()
       }],
       "mask-image-conic-pos": [{
-        "mask-conic": [P]
+        "mask-conic": [z]
       }],
       "mask-image-conic-from-pos": [{
         "mask-conic-from": L()
@@ -2677,14 +2679,14 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/brightness
        */
       brightness: [{
-        brightness: [P, j, k]
+        brightness: [z, j, k]
       }],
       /**
        * Contrast
        * @see https://tailwindcss.com/docs/contrast
        */
       contrast: [{
-        contrast: [P, j, k]
+        contrast: [z, j, k]
       }],
       /**
        * Drop Shadow
@@ -2695,7 +2697,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
           // Deprecated since Tailwind CSS v4.0.0
           "",
           "none",
-          h,
+          g,
           ke,
           we
         ]
@@ -2712,35 +2714,35 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/grayscale
        */
       grayscale: [{
-        grayscale: ["", P, j, k]
+        grayscale: ["", z, j, k]
       }],
       /**
        * Hue Rotate
        * @see https://tailwindcss.com/docs/hue-rotate
        */
       "hue-rotate": [{
-        "hue-rotate": [P, j, k]
+        "hue-rotate": [z, j, k]
       }],
       /**
        * Invert
        * @see https://tailwindcss.com/docs/invert
        */
       invert: [{
-        invert: ["", P, j, k]
+        invert: ["", z, j, k]
       }],
       /**
        * Saturate
        * @see https://tailwindcss.com/docs/saturate
        */
       saturate: [{
-        saturate: [P, j, k]
+        saturate: [z, j, k]
       }],
       /**
        * Sepia
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: ["", P, j, k]
+        sepia: ["", z, j, k]
       }],
       /**
        * Backdrop Filter
@@ -2767,56 +2769,56 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/backdrop-brightness
        */
       "backdrop-brightness": [{
-        "backdrop-brightness": [P, j, k]
+        "backdrop-brightness": [z, j, k]
       }],
       /**
        * Backdrop Contrast
        * @see https://tailwindcss.com/docs/backdrop-contrast
        */
       "backdrop-contrast": [{
-        "backdrop-contrast": [P, j, k]
+        "backdrop-contrast": [z, j, k]
       }],
       /**
        * Backdrop Grayscale
        * @see https://tailwindcss.com/docs/backdrop-grayscale
        */
       "backdrop-grayscale": [{
-        "backdrop-grayscale": ["", P, j, k]
+        "backdrop-grayscale": ["", z, j, k]
       }],
       /**
        * Backdrop Hue Rotate
        * @see https://tailwindcss.com/docs/backdrop-hue-rotate
        */
       "backdrop-hue-rotate": [{
-        "backdrop-hue-rotate": [P, j, k]
+        "backdrop-hue-rotate": [z, j, k]
       }],
       /**
        * Backdrop Invert
        * @see https://tailwindcss.com/docs/backdrop-invert
        */
       "backdrop-invert": [{
-        "backdrop-invert": ["", P, j, k]
+        "backdrop-invert": ["", z, j, k]
       }],
       /**
        * Backdrop Opacity
        * @see https://tailwindcss.com/docs/backdrop-opacity
        */
       "backdrop-opacity": [{
-        "backdrop-opacity": [P, j, k]
+        "backdrop-opacity": [z, j, k]
       }],
       /**
        * Backdrop Saturate
        * @see https://tailwindcss.com/docs/backdrop-saturate
        */
       "backdrop-saturate": [{
-        "backdrop-saturate": [P, j, k]
+        "backdrop-saturate": [z, j, k]
       }],
       /**
        * Backdrop Sepia
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": ["", P, j, k]
+        "backdrop-sepia": ["", z, j, k]
       }],
       // --------------
       // --- Tables ---
@@ -2885,7 +2887,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: [P, "initial", j, k]
+        duration: [z, "initial", j, k]
       }],
       /**
        * Transition Timing Function
@@ -2899,7 +2901,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: [P, j, k]
+        delay: [z, j, k]
       }],
       /**
        * Animation
@@ -3371,7 +3373,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
        * @see https://tailwindcss.com/docs/stroke-width
        */
       "stroke-w": [{
-        stroke: [P, xe, ue, Oe]
+        stroke: [z, xe, ue, De]
       }],
       /**
        * Stroke
@@ -3446,7 +3448,7 @@ const $e = (e) => typeof e == "object" && e !== null, H = (e, r) => {
     },
     orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
   };
-}, sr = /* @__PURE__ */ zt(rr);
+}, nr = /* @__PURE__ */ Ot(ar);
 function at(e) {
   var r, a, s = "";
   if (typeof e == "string" || typeof e == "number") s += e;
@@ -3456,19 +3458,19 @@ function at(e) {
   } else for (a in e) e[a] && (s && (s += " "), s += a);
   return s;
 }
-function or() {
+function lr() {
   for (var e, r, a = 0, s = "", n = arguments.length; a < n; a++) (e = arguments[a]) && (r = at(e)) && (s && (s += " "), s += r);
   return s;
 }
-function $(...e) {
-  return sr(or(e));
+function _(...e) {
+  return nr(lr(e));
 }
-const ar = {
+const ir = {
   sm: "w-16 h-16",
   md: "w-24 h-24",
   lg: "w-32 h-32",
   xl: "w-40 h-40"
-}, kr = ({
+}, cr = ({
   progress: e,
   size: r = "md",
   radius: a = 20,
@@ -3476,11 +3478,11 @@ const ar = {
   children: n,
   ariaLabel: c
 }) => {
-  const l = 2 * Math.PI * a, i = l / 2, d = i * (1 - e / 100), g = i * (1 - e / 100);
+  const l = 2 * Math.PI * a, i = l / 2, d = i * (1 - e / 100), h = i * (1 - e / 100);
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: $("relative", ar[r], s),
+      className: _("relative", ir[r], s),
       role: "progressbar",
       "aria-label": c || "Progress",
       "aria-valuenow": Math.max(0, Math.min(100, e)),
@@ -3522,7 +3524,7 @@ const ar = {
                   strokeWidth: "4",
                   strokeLinecap: "butt",
                   strokeDasharray: `${i * 0.98} ${l}`,
-                  strokeDashoffset: g,
+                  strokeDashoffset: h,
                   transform: "rotate(90 25 25)",
                   style: {
                     filter: "drop-shadow(0 0 8px var(--color-primary))"
@@ -3536,38 +3538,40 @@ const ar = {
       ]
     }
   );
-}, nr = {
+};
+cr.displayName = "CyberUI.CircularProgress";
+const dr = {
   SEGMENT_COUNT: 20,
   SEGMENT_ANGLE: 360 / 20,
   GAP_ANGLE: 4,
   INNER_RADIUS: 18.5,
   OUTER_RADIUS: 23.5,
   OUTER_TICK_RADIUS: 30
-}, lr = {
+}, ur = {
   sm: "w-16 h-16",
   md: "w-24 h-24",
   lg: "w-32 h-32",
   xl: "w-40 h-40"
-}, ir = ({ progress: e, size: r = "md", className: a, children: s }) => {
+}, mr = ({ progress: e, size: r = "md", className: a, children: s }) => {
   const {
     SEGMENT_COUNT: n,
     SEGMENT_ANGLE: c,
     GAP_ANGLE: l,
     INNER_RADIUS: i,
     OUTER_RADIUS: d,
-    OUTER_TICK_RADIUS: g
-  } = nr, m = c - l;
-  return /* @__PURE__ */ t.jsxs("div", { className: $("relative", lr[r], a), children: [
+    OUTER_TICK_RADIUS: h
+  } = dr, m = c - l;
+  return /* @__PURE__ */ t.jsxs("div", { className: _("relative", ur[r], a), children: [
     /* @__PURE__ */ t.jsxs("svg", { className: "w-full h-full", viewBox: "0 0 60 60", style: { overflow: "visible" }, children: [
       [...Array(60)].map((y, p) => {
-        const h = 6 * p, x = p % 5 === 0 ? 6 : 3, v = 30 + g * Math.cos(h * Math.PI / 180), A = 30 + g * Math.sin(h * Math.PI / 180), N = 30 + (g - x) * Math.cos(h * Math.PI / 180), T = 30 + (g - x) * Math.sin(h * Math.PI / 180);
+        const g = 6 * p, x = p % 5 === 0 ? 6 : 3, v = 30 + h * Math.cos(g * Math.PI / 180), A = 30 + h * Math.sin(g * Math.PI / 180), N = 30 + (h - x) * Math.cos(g * Math.PI / 180), $ = 30 + (h - x) * Math.sin(g * Math.PI / 180);
         return /* @__PURE__ */ t.jsx(
           "line",
           {
             x1: v,
             y1: A,
             x2: N,
-            y2: T,
+            y2: $,
             stroke: "var(--color-muted)",
             strokeWidth: 1,
             strokeLinecap: "round",
@@ -3577,11 +3581,11 @@ const ar = {
         );
       }),
       [...Array(n)].map((y, p) => {
-        const h = c * p - 90 + l / 2, w = h + m, x = (M) => M * Math.PI / 180, v = 30 + i * Math.cos(x(h)), A = 30 + i * Math.sin(x(h)), N = 30 + d * Math.cos(x(h)), T = 30 + d * Math.sin(x(h)), _ = 30 + d * Math.cos(x(w)), C = 30 + d * Math.sin(x(w)), z = 30 + i * Math.cos(x(w)), G = 30 + i * Math.sin(x(w)), f = p < Math.floor(e / 5);
+        const g = c * p - 90 + l / 2, w = g + m, x = (M) => M * Math.PI / 180, v = 30 + i * Math.cos(x(g)), A = 30 + i * Math.sin(x(g)), N = 30 + d * Math.cos(x(g)), $ = 30 + d * Math.sin(x(g)), T = 30 + d * Math.cos(x(w)), C = 30 + d * Math.sin(x(w)), I = 30 + i * Math.cos(x(w)), G = 30 + i * Math.sin(x(w)), f = p < Math.floor(e / 5);
         return /* @__PURE__ */ t.jsx(
           "path",
           {
-            d: `M ${v} ${A} L ${N} ${T} L ${_} ${C} L ${z} ${G} Z`,
+            d: `M ${v} ${A} L ${N} ${$} L ${T} ${C} L ${I} ${G} Z`,
             fill: f ? "var(--color-accent)" : "var(--color-border-default)",
             style: {
               filter: f ? "drop-shadow(0 0 6px var(--color-accent))" : "none",
@@ -3594,19 +3598,19 @@ const ar = {
     ] }),
     s && /* @__PURE__ */ t.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: s })
   ] });
-}, cr = {
+}, fr = {
   sm: "h-3",
   md: "h-5",
   lg: "h-7",
   xl: "h-9"
-}, dr = ({ progress: e, segments: r = 10, size: a = "md", className: s }) => {
+}, pr = ({ progress: e, segments: r = 10, size: a = "md", className: s }) => {
   const n = Math.round(Math.min(100, Math.max(0, e)) / 100 * r);
-  return /* @__PURE__ */ t.jsx("div", { className: $("flex gap-1 w-full", s), children: [...Array(r)].map((c, l) => {
+  return /* @__PURE__ */ t.jsx("div", { className: _("flex gap-1 w-full", s), children: [...Array(r)].map((c, l) => {
     const i = l < n;
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: $("flex-1 rounded-sm transition-all duration-300", cr[a]),
+        className: _("flex-1 rounded-sm transition-all duration-300", fr[a]),
         style: {
           backgroundColor: i ? "var(--color-accent)" : "var(--color-border-default)",
           boxShadow: i ? "0 0 6px var(--color-accent)" : "none"
@@ -3615,12 +3619,14 @@ const ar = {
       l
     );
   }) });
-}, jr = (e) => e.variant === "block" ? /* @__PURE__ */ t.jsx(dr, { ...e }) : /* @__PURE__ */ t.jsx(ir, { ...e }), Nr = ({
+}, br = (e) => e.variant === "block" ? /* @__PURE__ */ t.jsx(pr, { ...e }) : /* @__PURE__ */ t.jsx(mr, { ...e });
+br.displayName = "CyberUI.SegmentedProgress";
+const gr = ({
   progress: e,
   size: r = "md",
   className: a = ""
 }) => {
-  const s = (g) => H(g, ae.linearProgress.width), n = (g) => H(g, ae.linearProgress.height), c = s(r), l = n(r), i = $("bg-surface rounded-full shadow-inner", l, a || c), d = $("bg-gradient-to-r from-accent to-primary rounded-full shadow-lg-accent transition-all duration-500 ease-out", l);
+  const s = (h) => V(h, ae.linearProgress.width), n = (h) => V(h, ae.linearProgress.height), c = s(r), l = n(r), i = _("bg-surface rounded-full shadow-inner", l, a || c), d = _("bg-gradient-to-r from-accent to-primary rounded-full shadow-lg-accent transition-all duration-500 ease-out", l);
   return /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -3638,14 +3644,16 @@ const ar = {
       )
     }
   );
-}, ur = ({
+};
+gr.displayName = "CyberUI.LinearProgress";
+const nt = ({
   type: e,
   title: r,
   message: a,
   size: s = "md",
   onClose: n
 }) => {
-  const c = (y) => H(y, ae.notification), i = (() => {
+  const c = (y) => V(y, ae.notification), i = (() => {
     switch (e) {
       case "success":
         return {
@@ -3693,8 +3701,8 @@ const ar = {
           icon: null
         };
     }
-  })(), d = c(s), g = e === "error" ? "alert" : "status", m = e === "warning" ? "hover:text-default/70" : "hover:text-base/70";
-  return /* @__PURE__ */ t.jsxs("div", { className: `flex items-start rounded-lg ${d} ${i.container}`, role: g, "aria-atomic": "true", children: [
+  })(), d = c(s), h = e === "error" ? "alert" : "status", m = e === "warning" ? "hover:text-default/70" : "hover:text-base/70";
+  return /* @__PURE__ */ t.jsxs("div", { className: `flex items-start rounded-lg ${d} ${i.container}`, role: h, "aria-atomic": "true", children: [
     /* @__PURE__ */ t.jsx("div", { className: "flex-shrink-0", children: i.icon }),
     /* @__PURE__ */ t.jsxs("div", { className: "flex-1", children: [
       /* @__PURE__ */ t.jsx("h4", { className: `font-bold ${i.textColor}`, children: r }),
@@ -3717,7 +3725,9 @@ const ar = {
       }
     )
   ] });
-}, We = ({
+};
+nt.displayName = "CyberUI.Notification";
+const Ee = ({
   variant: e = "primary",
   size: r = "md",
   className: a = "",
@@ -3738,7 +3748,7 @@ const ar = {
     "ease-in-out",
     "focus:outline-none",
     s ? "cursor-not-allowed" : "cursor-pointer"
-  ].join(" "), i = (y) => H(y, ae.button), d = (y, p) => ({
+  ].join(" "), i = (y) => V(y, ae.button), d = (y, p) => ({
     primary: {
       enabled: "bg-linear-(--gradient-accent) text-base shadow-primary border-none hover:shadow-lg-accent hover:brightness-110 focus-visible:ring-2 focus-visible:ring-accent/50 active:scale-95",
       disabled: "bg-base border-2 border-accent/20 text-accent/40 shadow-none opacity-50"
@@ -3755,11 +3765,11 @@ const ar = {
       enabled: "bg-surface border-2 border-accent text-accent shadow-secondary hover:bg-accent hover:text-base hover:shadow-lg-accent focus-visible:ring-2 focus-visible:ring-accent/50 active:scale-95",
       disabled: "bg-base border-2 border-accent/10 text-muted/60 shadow-none opacity-40"
     }
-  })[y][p ? "disabled" : "enabled"], g = $(l, i(r), d(e, s), a), m = e === "primary" && !s;
+  })[y][p ? "disabled" : "enabled"], h = _(l, i(r), d(e, s), a), m = e === "primary" && !s;
   return /* @__PURE__ */ t.jsxs(
     "button",
     {
-      className: g,
+      className: h,
       disabled: s,
       ...c,
       children: [
@@ -3769,7 +3779,9 @@ const ar = {
       ]
     }
   );
-}, Cr = ({
+};
+Ee.displayName = "CyberUI.Button";
+const hr = ({
   variant: e = "primary",
   size: r = "md",
   label: a,
@@ -3779,9 +3791,9 @@ const ar = {
   rightIcon: l,
   className: i = "",
   disabled: d = !1,
-  ...g
+  ...h
 }) => {
-  const m = Be(), y = g.id || m, p = [
+  const m = Be(), y = h.id || m, p = [
     "w-full",
     "rounded-lg",
     "bg-surface",
@@ -3791,25 +3803,25 @@ const ar = {
     "duration-300",
     "focus:outline-none",
     d ? "cursor-not-allowed opacity-60" : "cursor-text"
-  ].join(" "), h = (_) => H(_, ae.input), w = (_) => {
-    const C = h(_);
+  ].join(" "), g = (T) => V(T, ae.input), w = (T) => {
+    const C = g(T);
     return c && l ? `pl-10 pr-10 ${C}` : c ? `pl-10 pr-4 ${C}` : l ? `pl-4 pr-10 ${C}` : `px-4 ${C}`;
-  }, x = (_, C, z) => C ? "border-2 border-error shadow-error/30 hover:shadow-error focus:ring-2 focus:ring-error focus:shadow-error active:bg-base" : z ? {
+  }, x = (T, C, I) => C ? "border-2 border-error shadow-error/30 hover:shadow-error focus:ring-2 focus:ring-error focus:shadow-error active:bg-base" : I ? {
     primary: "border-2 border-accent/20 shadow-none",
     secondary: "border-2 border-secondary/20 shadow-none",
     danger: "border-2 border-error/20 shadow-none",
     ghost: "border border-border-default shadow-none"
-  }[_] : {
+  }[T] : {
     primary: "border-2 border-accent shadow-input-accent hover:shadow-lg-accent focus:ring-2 focus:ring-accent focus:shadow-lg-accent active:bg-base",
     secondary: "border-2 border-secondary shadow-secondary/30 hover:shadow-secondary focus:ring-2 focus:ring-secondary focus:shadow-secondary active:bg-base",
     danger: "border-2 border-error shadow-error/30 hover:shadow-error focus:ring-2 focus:ring-error focus:shadow-error active:bg-base",
     ghost: "border border-border-default shadow-none hover:border-accent focus:ring-2 focus:ring-accent focus:border-accent active:bg-base"
-  }[_], v = (_) => ({
+  }[T], v = (T) => ({
     primary: "text-accent",
     secondary: "text-secondary",
     danger: "text-error",
     ghost: "text-muted"
-  })[_], A = $(p, w(r), x(e, !!n, d), i), N = v(e), T = n ? `${y}-error` : s ? `${y}-help` : void 0;
+  })[T], A = _(p, w(r), x(e, !!n, d), i), N = v(e), $ = n ? `${y}-error` : s ? `${y}-help` : void 0;
   return /* @__PURE__ */ t.jsxs("div", { className: "space-y-2", children: [
     a && /* @__PURE__ */ t.jsx("label", { htmlFor: y, className: "block text-sm font-medium text-default", children: a }),
     /* @__PURE__ */ t.jsxs("div", { className: "relative", children: [
@@ -3821,15 +3833,17 @@ const ar = {
           disabled: d,
           id: y,
           "aria-invalid": !!n,
-          "aria-describedby": T,
-          ...g
+          "aria-describedby": $,
+          ...h
         }
       ),
       l && /* @__PURE__ */ t.jsx("div", { className: `absolute inset-y-0 right-0 flex items-center pr-3 ${N}`, children: l })
     ] }),
     (s || n) && /* @__PURE__ */ t.jsx("div", { id: n ? `${y}-error` : `${y}-help`, className: `text-xs font-mono ${n ? "text-error" : "text-muted"}`, children: n || s })
   ] });
-}, Sr = ({
+};
+hr.displayName = "CyberUI.Input";
+const xr = ({
   variant: e = "default",
   size: r = "md",
   title: a,
@@ -3838,19 +3852,21 @@ const ar = {
   className: c = "",
   ...l
 }) => {
-  const i = (m) => H(m, ae.card), d = (m) => {
+  const i = (m) => V(m, ae.card), d = (m) => {
     const y = i(r);
     return {
       default: `bg-base border border-border-default rounded-xl text-primary ${y}`,
       accent: `bg-surface border-2 border-accent rounded-xl shadow-input-accent/50 hover:shadow-lg-accent transition-all duration-300 transform text-primary ${y}`,
       small: `bg-base rounded-lg border border-border-default text-primary ${y}`
     }[m];
-  }, g = (m) => m ? "text-xl font-semibold text-secondary mb-4 border-b border-accent pb-2" : "text-xl font-semibold text-secondary mb-4";
-  return /* @__PURE__ */ t.jsxs("div", { className: $(d(e), c), ...l, children: [
-    a && /* @__PURE__ */ t.jsx("h3", { className: g(s), children: a }),
+  }, h = (m) => m ? "text-xl font-semibold text-secondary mb-4 border-b border-accent pb-2" : "text-xl font-semibold text-secondary mb-4";
+  return /* @__PURE__ */ t.jsxs("div", { className: _(d(e), c), ...l, children: [
+    a && /* @__PURE__ */ t.jsx("h3", { className: h(s), children: a }),
     n
   ] });
-}, Er = ({
+};
+xr.displayName = "CyberUI.Card";
+const yr = ({
   variant: e = "primary",
   size: r = "md",
   children: a,
@@ -3861,14 +3877,14 @@ const ar = {
   onClick: i,
   ...d
 }) => {
-  const g = (p) => H(p, ae.badge), m = (p) => ({
+  const h = (p) => V(p, ae.badge), m = (p) => ({
     primary: "bg-primary shadow-lg",
     secondary: "bg-secondary shadow-lg",
     accent: "bg-accent shadow-lg",
     success: "bg-success shadow-lg",
     error: "bg-error shadow-lg",
     warning: "bg-warning shadow-lg"
-  })[p], y = (p, h) => !h && !i ? "transition-shadow" : {
+  })[p], y = (p, g) => !g && !i ? "transition-shadow" : {
     primary: "hover:shadow-primary transition-shadow cursor-pointer",
     secondary: "hover:shadow-secondary transition-shadow cursor-pointer",
     accent: "hover:shadow-lg-accent transition-shadow cursor-pointer",
@@ -3879,7 +3895,7 @@ const ar = {
   return /* @__PURE__ */ t.jsxs(
     "span",
     {
-      className: $("inline-flex items-center rounded-full font-semibold", g(r), m(e), y(e, l || !!i), s),
+      className: _("inline-flex items-center rounded-full font-semibold", h(r), m(e), y(e, l || !!i), s),
       onClick: i,
       ...d,
       children: [
@@ -3889,7 +3905,9 @@ const ar = {
       ]
     }
   );
-}, _r = ({
+};
+yr.displayName = "CyberUI.Badge";
+const vr = ({
   label: e,
   size: r = "md",
   variant: a = "primary",
@@ -3900,9 +3918,9 @@ const ar = {
   id: i,
   ...d
 }) => {
-  const g = (x) => {
+  const h = (x) => {
     l || c && c(x.target.checked);
-  }, m = (x) => H(x, {
+  }, m = (x) => V(x, {
     sm: "w-10 h-5 after:h-4 after:w-4",
     md: "w-14 h-7 after:h-6 after:w-6",
     lg: "w-16 h-8 after:h-7 after:w-7"
@@ -3915,10 +3933,10 @@ const ar = {
       accent: "bg-gray-600 peer-checked:bg-accent peer-focus:ring-accent"
     };
     return A[x] || A.primary;
-  }, p = $(
+  }, p = _(
     "relative inline-flex items-center",
     l ? "cursor-not-allowed opacity-50" : "cursor-pointer"
-  ), h = $(
+  ), g = _(
     m(r),
     y(a, l),
     "peer-focus:outline-none rounded-full peer",
@@ -3926,7 +3944,7 @@ const ar = {
     "after:content-[''] after:absolute after:top-[2px] after:left-[2px]",
     "after:bg-white after:rounded-full after:transition-all",
     "transition-colors duration-300"
-  ), w = $("flex items-center justify-between", e && "space-x-3", s);
+  ), w = _("flex items-center justify-between", e && "space-x-3", s);
   return /* @__PURE__ */ t.jsxs("div", { className: w, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
@@ -3943,16 +3961,18 @@ const ar = {
           type: "checkbox",
           className: "sr-only peer",
           checked: n,
-          onChange: g,
+          onChange: h,
           disabled: l,
           id: i,
           ...d
         }
       ),
-      /* @__PURE__ */ t.jsx("div", { className: h })
+      /* @__PURE__ */ t.jsx("div", { className: g })
     ] })
   ] });
-}, $r = ({
+};
+vr.displayName = "CyberUI.Toggle";
+const wr = ({
   label: e,
   size: r = "md",
   variant: a = "primary",
@@ -3962,18 +3982,18 @@ const ar = {
   error: l,
   className: i = "",
   disabled: d = !1,
-  id: g,
+  id: h,
   name: m,
   onValueChange: y,
   onChange: p,
-  ...h
+  ...g
 }) => {
   const w = (f) => {
     p?.(f), y?.(f.target.value);
-  }, x = Be(), v = g || x, A = m || v, N = (f) => H(f, ae.input), T = (f, M, V) => {
+  }, x = Be(), v = h || x, A = m || v, N = (f) => V(f, ae.input), $ = (f, M, U) => {
     if (M)
       return "bg-base border-2 border-border-default/30 text-muted/50 cursor-not-allowed opacity-50";
-    if (V)
+    if (U)
       return "bg-surface border-2 border-error text-default focus:ring-2 focus:ring-error focus:border-error shadow-error";
     const X = {
       primary: "bg-surface border-2 border-border-default text-default focus:ring-2 focus:ring-primary focus:border-primary shadow-primary",
@@ -3982,27 +4002,27 @@ const ar = {
       ghost: "bg-base border-2 border-accent/20 text-default focus:ring-2 focus:ring-accent focus:border-accent shadow-secondary"
     };
     return X[f] || X.primary;
-  }, _ = $(
+  }, T = _(
     "appearance-none w-full rounded-lg font-mono transition-all duration-300 focus:outline-none px-4 pr-10",
     N(r),
-    T(a, d, !!l),
+    $(a, d, !!l),
     i
-  ), C = "relative w-full", z = $(
+  ), C = "relative w-full", I = _(
     "block text-sm font-medium mb-2 transition-colors duration-200",
     d ? "text-muted opacity-50" : l ? "text-error" : "text-default"
-  ), G = $("mt-2 text-xs transition-colors duration-200", l ? "text-error" : "text-muted");
+  ), G = _("mt-2 text-xs transition-colors duration-200", l ? "text-error" : "text-muted");
   return /* @__PURE__ */ t.jsxs("div", { className: "w-full", children: [
-    e && /* @__PURE__ */ t.jsx("label", { htmlFor: v, className: z, children: e }),
+    e && /* @__PURE__ */ t.jsx("label", { htmlFor: v, className: I, children: e }),
     /* @__PURE__ */ t.jsxs("div", { className: C, children: [
       /* @__PURE__ */ t.jsxs(
         "select",
         {
-          className: _,
+          className: T,
           disabled: d,
           id: v,
           name: A,
           onChange: w,
-          ...h,
+          ...g,
           children: [
             n && /* @__PURE__ */ t.jsx("option", { value: "", disabled: !0, children: n }),
             s.map((f) => /* @__PURE__ */ t.jsx(
@@ -4035,7 +4055,9 @@ const ar = {
     ] }),
     (c || l) && /* @__PURE__ */ t.jsx("div", { className: G, children: l || c })
   ] });
-}, Tr = ({
+};
+wr.displayName = "CyberUI.Select";
+const kr = ({
   variant: e = "text",
   size: r = "md",
   width: a,
@@ -4044,18 +4066,18 @@ const ar = {
   lines: c = 3,
   animate: l = !0
 }) => {
-  const d = $("bg-gray-600", l && "animate-pulse", ((m) => H(m, ae.skeleton))(r), n), g = () => {
+  const d = _("bg-gray-600", l && "animate-pulse", ((m) => V(m, ae.skeleton))(r), n), h = () => {
     const m = {};
     return a && (m.width = typeof a == "number" ? `${a}px` : a), s && (m.height = typeof s == "number" ? `${s}px` : s), m;
   };
   if (e === "text")
     return /* @__PURE__ */ t.jsx("div", { className: `space-y-3 ${n}`, children: Array.from({ length: c }).map((m, y) => {
-      const h = y === c - 1 ? "w-2/3" : y % 2 === 0 ? "w-full" : "w-5/6";
+      const g = y === c - 1 ? "w-2/3" : y % 2 === 0 ? "w-full" : "w-5/6";
       return /* @__PURE__ */ t.jsx(
         "div",
         {
-          className: `h-3 rounded ${d} ${h}`,
-          style: g()
+          className: `h-3 rounded ${d} ${g}`,
+          style: h()
         },
         y
       );
@@ -4066,7 +4088,7 @@ const ar = {
       "div",
       {
         className: `rounded-full ${d} ${m}`,
-        style: g()
+        style: h()
       }
     );
   }
@@ -4076,7 +4098,7 @@ const ar = {
       "div",
       {
         className: `rounded-lg ${d} w-full ${m}`,
-        style: g()
+        style: h()
       }
     );
   }
@@ -4128,10 +4150,12 @@ const ar = {
     "div",
     {
       className: `h-4 rounded ${d} w-full`,
-      style: g()
+      style: h()
     }
   );
-}, mr = {
+};
+kr.displayName = "CyberUI.Skeleton";
+const jr = {
   openDuration: 50,
   closeDuration: 350,
   cyberpunkEffects: !0
@@ -4146,33 +4170,33 @@ const ar = {
     className: l = "",
     animation: i,
     eager: d = !1,
-    previewClassName: g = "",
+    previewClassName: h = "",
     onPreviewOpen: m,
     onPreviewClose: y,
     onLoad: p,
-    onError: h,
+    onError: g,
     ...w
   }) => {
-    const x = { ...mr, ...i }, [v, A] = Z(!1), [N, T] = Z(!1), [_, C] = Z(!1), [z, G] = Z(!0), [f, M] = Z(!1), [V, X] = Z(!1), Q = te(null), re = te(null), ee = D(
-      (S) => H(S, ae.card),
+    const x = { ...jr, ...i }, [v, A] = Z(!1), [N, $] = Z(!1), [T, C] = Z(!1), [I, G] = Z(!0), [f, M] = Z(!1), [U, X] = Z(!1), Q = te(null), re = te(null), ee = D(
+      (S) => V(S, ae.card),
       []
     ), F = D(
       (S) => {
         G(!1), M(!1), p?.(S);
       },
       [p]
-    ), U = D(
+    ), H = D(
       (S) => {
-        G(!1), n && !V ? (X(!0), M(!1)) : M(!0), h?.(S);
+        G(!1), n && !U ? (X(!0), M(!1)) : M(!0), g?.(S);
       },
-      [h, n, V]
+      [g, n, U]
     ), q = D(() => {
       s && !f && (C(!0), A(!0), m?.(), setTimeout(() => {
         C(!1);
       }, x.openDuration));
     }, [s, f, m, x.openDuration]), Y = D(() => {
-      T(!0), y?.(), setTimeout(() => {
-        A(!1), T(!1);
+      $(!0), y?.(), setTimeout(() => {
+        A(!1), $(!1);
       }, x.closeDuration);
     }, [y, x.closeDuration]), K = D(
       (S) => {
@@ -4188,14 +4212,14 @@ const ar = {
     oe(() => {
       if (v) {
         document.addEventListener("keydown", o);
-        const S = document.body.style.overflow, E = document.documentElement.style.scrollbarGutter, I = document.body.style.paddingRight, W = window.innerWidth - document.documentElement.clientWidth;
+        const S = document.body.style.overflow, E = document.documentElement.style.scrollbarGutter, P = document.body.style.paddingRight, W = window.innerWidth - document.documentElement.clientWidth;
         return document.body.style.overflow = "hidden", document.body.style.paddingRight = `${W}px`, document.documentElement.style.scrollbarGutter = "auto", () => {
-          document.removeEventListener("keydown", o), document.body.style.overflow = S, document.body.style.paddingRight = I, document.documentElement.style.scrollbarGutter = E;
+          document.removeEventListener("keydown", o), document.body.style.overflow = S, document.body.style.paddingRight = P, document.documentElement.style.scrollbarGutter = E;
         };
       }
     }, [v, o]);
     const u = pe(
-      () => $(
+      () => _(
         "relative rounded-lg overflow-hidden border-2 border-accent/30 transition-all duration-300 ease-in-out transform flex justify-center content-center",
         s && !f ? "cursor-pointer hover:scale-105 hover:border-accent hover:shadow-lg-accent focus:outline-none focus:ring-4 focus:ring-accent/50" : "",
         ee(a),
@@ -4221,7 +4245,7 @@ const ar = {
           onClick: q,
           ...b,
           children: [
-            z && /* @__PURE__ */ t.jsx(
+            I && /* @__PURE__ */ t.jsx(
               "div",
               {
                 className: "absolute m-0 inset-0 flex items-center justify-center bg-surface border-2 border-accent/20",
@@ -4241,14 +4265,14 @@ const ar = {
                   /* @__PURE__ */ t.jsx("div", { className: "text-sm", children: "Failed to load image" })
                 ] })
               }
-            ) : V ? /* @__PURE__ */ t.jsx(
+            ) : U ? /* @__PURE__ */ t.jsx(
               "img",
               {
                 ref: re,
                 src: n,
                 alt: `${r} (fallback)`,
                 className: "w-full h-full m-0 object-cover transition-opacity duration-300",
-                style: { opacity: z ? 0 : 1 },
+                style: { opacity: I ? 0 : 1 },
                 onLoad: F,
                 onError: () => {
                   M(!0), X(!1);
@@ -4264,15 +4288,15 @@ const ar = {
                 src: e,
                 alt: r,
                 className: "w-full h-full m-0 object-cover transition-opacity duration-300",
-                style: { opacity: z ? 0 : 1 },
+                style: { opacity: I ? 0 : 1 },
                 onLoad: F,
-                onError: U,
+                onError: H,
                 loading: d ? "eager" : "lazy",
                 decoding: "async",
                 ...w
               }
             ),
-            s && !z && !f && /* @__PURE__ */ t.jsx(
+            s && !I && !f && /* @__PURE__ */ t.jsx(
               "div",
               {
                 className: "absolute inset-0 bg-black/0 hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 hover:opacity-100",
@@ -4287,17 +4311,17 @@ const ar = {
         u,
         q,
         b,
-        z,
+        I,
         c,
         f,
-        V,
+        U,
         n,
         r,
         F,
         d,
         w,
         e,
-        U,
+        H,
         s
       ]
     );
@@ -4308,7 +4332,7 @@ const ar = {
           "div",
           {
             ref: Q,
-            className: `fixed z-50 flex items-center justify-center p-4 transition-all ease-out ${g} ${N ? "bg-black/0 backdrop-blur-none opacity-0 duration-300" : _ ? "bg-black/80 backdrop-blur-sm opacity-100 duration-500" : "bg-black/80 backdrop-blur-sm opacity-100 duration-300"}`,
+            className: `fixed z-50 flex items-center justify-center p-4 transition-all ease-out ${h} ${N ? "bg-black/0 backdrop-blur-none opacity-0 duration-300" : T ? "bg-black/80 backdrop-blur-sm opacity-100 duration-500" : "bg-black/80 backdrop-blur-sm opacity-100 duration-300"}`,
             style: {
               top: 0,
               left: 0,
@@ -4361,7 +4385,7 @@ const ar = {
                       "button",
                       {
                         onClick: Y,
-                        className: `absolute top-4 right-4 text-white hover:text-accent/80 transition-all duration-300 font-bold z-20 rounded-full w-10 h-10 flex items-center justify-center cursor-pointer transform ${N ? "bg-black/0 scale-50 rotate-180 opacity-0" : _ ? "bg-black/50 scale-0 rotate-0 opacity-0 duration-500" : "bg-black/50 hover:bg-accent/20 scale-100 rotate-0 opacity-100 hover:scale-110"}`,
+                        className: `absolute top-4 right-4 text-white hover:text-accent/80 transition-all duration-300 font-bold z-20 rounded-full w-10 h-10 flex items-center justify-center cursor-pointer transform ${N ? "bg-black/0 scale-50 rotate-180 opacity-0" : T ? "bg-black/50 scale-0 rotate-0 opacity-0 duration-500" : "bg-black/50 hover:bg-accent/20 scale-100 rotate-0 opacity-100 hover:scale-110"}`,
                         style: { lineHeight: "1" },
                         children: /* @__PURE__ */ t.jsxs(
                           "svg",
@@ -4401,7 +4425,7 @@ const ar = {
                     /* @__PURE__ */ t.jsxs(
                       "div",
                       {
-                        className: `relative max-w-full max-h-full flex items-center justify-center transition-all ease-out ${N ? "scale-75 opacity-0 rotate-1 duration-300" : _ ? "scale-95 opacity-0 rotate-0 duration-500" : "scale-100 opacity-100 rotate-0 duration-300"}`,
+                        className: `relative max-w-full max-h-full flex items-center justify-center transition-all ease-out ${N ? "scale-75 opacity-0 rotate-1 duration-300" : T ? "scale-95 opacity-0 rotate-0 duration-500" : "scale-100 opacity-100 rotate-0 duration-300"}`,
                         onClick: (S) => S.stopPropagation(),
                         children: [
                           x.cyberpunkEffects && /* @__PURE__ */ t.jsx(
@@ -4425,8 +4449,8 @@ const ar = {
                           /* @__PURE__ */ t.jsx(
                             "img",
                             {
-                              src: V ? n : e,
-                              alt: V ? `${r} (fallback)` : r,
+                              src: U ? n : e,
+                              alt: U ? `${r} (fallback)` : r,
                               className: `max-w-[95vw] max-h-[95vh] w-auto h-auto object-contain rounded-lg transition-all duration-300 ease-out ${N ? "filter blur-sm brightness-50" : "filter blur-0 brightness-100"}`,
                               style: {
                                 maxWidth: "95vw",
@@ -4441,8 +4465,8 @@ const ar = {
                             {
                               className: `absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent p-3 rounded-b-lg transition-all duration-300 ${N ? "translate-y-4 opacity-0" : "translate-y-0 opacity-100"}`,
                               children: /* @__PURE__ */ t.jsxs("p", { className: "text-white text-sm font-medium truncate relative", children: [
-                                V ? `${r} (fallback)` : r,
-                                x.cyberpunkEffects && /* @__PURE__ */ t.jsx("span", { className: "absolute inset-0 text-accent opacity-20 animate-pulse", children: V ? `${r} (fallback)` : r })
+                                U ? `${r} (fallback)` : r,
+                                x.cyberpunkEffects && /* @__PURE__ */ t.jsx("span", { className: "absolute inset-0 text-accent opacity-20 animate-pulse", children: U ? `${r} (fallback)` : r })
                               ] })
                             }
                           ),
@@ -4491,7 +4515,7 @@ const ar = {
   }
 );
 je.displayName = "CyberUI.Image";
-const fr = ({
+const lt = ({
   images: e,
   currentIndex: r,
   onChange: a,
@@ -4501,21 +4525,21 @@ const fr = ({
   infinite: l = !0,
   transition: i = "slide",
   objectFit: d = "cover",
-  showArrows: g = !0,
+  showArrows: h = !0,
   showIndicators: m = !0,
   className: y = "",
   disableImagePreview: p = !1,
-  glitchRate: h = 1,
+  glitchRate: g = 1,
   onBeforeChange: w,
   onAfterChange: x
 }) => {
-  const [v, A] = Z(!1), [N, T] = Z(n), [_, C] = Z(!0), z = pe(
-    () => H(s, ae.carousel),
+  const [v, A] = Z(!1), [N, $] = Z(n), [T, C] = Z(!0), I = pe(
+    () => V(s, ae.carousel),
     [s]
   ), G = "w-full h-full", f = D(
     (o) => {
       if (o === r || v) return;
-      const u = i === "signal-glitch" && (typeof h == "boolean" ? h : Math.random() < h);
+      const u = i === "signal-glitch" && (typeof g == "boolean" ? g : Math.random() < g);
       C(u), A(!0), w?.(r, o), setTimeout(() => {
         a(o), A(!1), x?.(o);
       }, i === "slide" ? 0 : i === "signal-glitch" && u ? 600 : 250);
@@ -4527,7 +4551,7 @@ const fr = ({
       w,
       x,
       i,
-      h
+      g
     ]
   );
   oe(() => {
@@ -4535,7 +4559,7 @@ const fr = ({
     const o = setInterval(() => {
       const u = l ? (r + 1) % e.length : Math.min(r + 1, e.length - 1);
       if (!l && u === e.length - 1) {
-        T(!1);
+        $(!1);
         return;
       }
       f(u);
@@ -4552,23 +4576,23 @@ const fr = ({
   const M = D(() => {
     if (e.length <= 1) return;
     const o = l ? (r - 1 + e.length) % e.length : Math.max(r - 1, 0);
-    T(!1), f(o);
-  }, [r, e.length, l, f]), V = D(() => {
+    $(!1), f(o);
+  }, [r, e.length, l, f]), U = D(() => {
     if (e.length <= 1) return;
     const o = l ? (r + 1) % e.length : Math.min(r + 1, e.length - 1);
-    T(!1), f(o);
+    $(!1), f(o);
   }, [r, e.length, l, f]), X = D(
     (o) => {
-      T(!1), f(o);
+      $(!1), f(o);
     },
     [f]
   );
   oe(() => {
     const o = (u) => {
-      u.key === "ArrowLeft" && M(), u.key === "ArrowRight" && V();
+      u.key === "ArrowLeft" && M(), u.key === "ArrowRight" && U();
     };
     return window.addEventListener("keydown", o), () => window.removeEventListener("keydown", o);
-  }, [M, V]);
+  }, [M, U]);
   const Q = () => /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -4587,8 +4611,8 @@ const fr = ({
           size: "lg",
           preview: !p,
           loading: u <= 1 ? "eager" : "lazy",
-          onPreviewOpen: () => T(!1),
-          onPreviewClose: () => T(n)
+          onPreviewOpen: () => $(!1),
+          onPreviewClose: () => $(n)
         }
       ) }, u))
     }
@@ -4624,8 +4648,8 @@ const fr = ({
               size: "lg",
               preview: !p,
               loading: u <= 1 ? "eager" : "lazy",
-              onPreviewOpen: () => T(!1),
-              onPreviewClose: () => T(n)
+              onPreviewOpen: () => $(!1),
+              onPreviewClose: () => $(n)
             }
           ),
           i === "matrix" && F(b, v)
@@ -4634,7 +4658,7 @@ const fr = ({
       u
     );
   }) }), ee = () => /* @__PURE__ */ t.jsx(t.Fragment, { children: e.map((o, u) => {
-    const b = u === r, R = u === (r - 1 + e.length) % e.length, S = v && i === "signal-glitch" && _ ? {
+    const b = u === r, R = u === (r - 1 + e.length) % e.length, S = v && i === "signal-glitch" && T ? {
       opacity: b ? 1 : R ? 0.8 : 0,
       animation: b ? "signal-image-flicker-in 1s ease-out forwards" : R ? "signal-image-flicker-out 1s ease-out forwards" : "none",
       willChange: "opacity",
@@ -4661,13 +4685,13 @@ const fr = ({
               fallback: o.fallbackSrc,
               className: G,
               size: "lg",
-              preview: !p && !(v && i === "signal-glitch" && _),
+              preview: !p && !(v && i === "signal-glitch" && T),
               loading: u <= 1 ? "eager" : "lazy",
-              onPreviewOpen: () => T(!1),
-              onPreviewClose: () => T(n)
+              onPreviewOpen: () => $(!1),
+              onPreviewClose: () => $(n)
             }
           ),
-          i === "signal-glitch" && v && _ && U(b)
+          i === "signal-glitch" && v && T && H(b)
         ]
       },
       u
@@ -4678,7 +4702,7 @@ const fr = ({
   ) : (
     // Transitioning image gets more dramatic effects
     /* @__PURE__ */ t.jsx("div", { className: "w-full h-full bg-gradient-to-b from-primary/10 via-secondary/5 to-accent/10 opacity-50" })
-  ) }) }), U = (o) => /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  ) }) }), H = (o) => /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
       "div",
       {
@@ -4809,12 +4833,12 @@ const fr = ({
         }
       )
     ] })
-  ] }), q = () => g && e.length > 1 && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  ] }), q = () => h && e.length > 1 && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
       "button",
       {
         onClick: M,
-        disabled: !l && r === 0 || v && i === "signal-glitch" && _,
+        disabled: !l && r === 0 || v && i === "signal-glitch" && T,
         className: "group absolute left-2 top-1/2 -translate-y-1/2 w-16 h-16 text-primary hover:text-accent cursor-pointer disabled:cursor-not-allowed disabled:opacity-30 focus:outline-none transition-all duration-300 flex items-center justify-center hover:scale-110",
         "aria-label": "Previous image",
         children: /* @__PURE__ */ t.jsxs(
@@ -4906,8 +4930,8 @@ const fr = ({
     /* @__PURE__ */ t.jsx(
       "button",
       {
-        onClick: V,
-        disabled: !l && r === e.length - 1 || v && i === "signal-glitch" && _,
+        onClick: U,
+        disabled: !l && r === e.length - 1 || v && i === "signal-glitch" && T,
         className: "group absolute right-2 top-1/2 -translate-y-1/2 w-16 h-16 text-primary hover:text-accent cursor-pointer disabled:cursor-not-allowed disabled:opacity-30 focus:outline-none transition-all duration-300 flex items-center justify-center hover:scale-110",
         "aria-label": "Next image",
         children: /* @__PURE__ */ t.jsxs(
@@ -4961,7 +4985,7 @@ const fr = ({
     "button",
     {
       onClick: () => X(u),
-      disabled: v && i === "signal-glitch" && _,
+      disabled: v && i === "signal-glitch" && T,
       className: "group relative transition-all duration-300 hover:scale-110 focus:outline-none cursor-pointer disabled:cursor-not-allowed disabled:opacity-30",
       style: {
         width: "24px",
@@ -5028,16 +5052,16 @@ const fr = ({
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: $(z, "w-full bg-surface border border-accent rounded-lg flex items-center justify-center", y),
+        className: _(I, "w-full bg-surface border border-accent rounded-lg flex items-center justify-center", y),
         children: /* @__PURE__ */ t.jsx("p", { className: "text-muted", children: "No images to display" })
       }
     );
   const K = e[r];
-  return /* @__PURE__ */ t.jsxs("div", { className: $("relative w-full", y), children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: _("relative w-full", y), children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: `relative w-full overflow-hidden rounded-lg border border-accent bg-surface ${z}`,
+        className: `relative w-full overflow-hidden rounded-lg border border-accent bg-surface ${I}`,
         children: [
           /* @__PURE__ */ t.jsxs("div", { className: "absolute inset-0 pointer-events-none", children: [
             /* @__PURE__ */ t.jsx("div", { className: "absolute top-2 left-2 w-4 h-4 border-l-2 border-t-2 border-primary opacity-60" }),
@@ -5064,17 +5088,19 @@ const fr = ({
     ),
     Y()
   ] });
-}, Rr = _e(fr), pr = {
+};
+lt.displayName = "CyberUI.Carousel";
+const Pr = _e(lt), Nr = {
   openDuration: 600,
   closeDuration: 400,
   crtEffects: !0
-}, br = {
+}, Cr = {
   sm: "max-w-md",
   md: "max-w-lg",
   lg: "max-w-2xl",
   xl: "max-w-4xl",
   fullscreen: "max-w-none w-full h-full"
-}, hr = _e(
+}, Sr = _e(
   ({
     isOpen: e,
     onClose: r,
@@ -5085,40 +5111,40 @@ const fr = ({
     onConfirm: l,
     cancelText: i = "Cancel",
     confirmText: d = "Confirm",
-    confirmLoading: g = !1,
+    confirmLoading: h = !1,
     showCancel: m = !0,
     showConfirm: y = !0,
     size: p = "lg",
-    variant: h = "default",
+    variant: g = "default",
     closeOnOverlayClick: w = !0,
     closeOnEscape: x = !0,
     animation: v,
     className: A = "",
     overlayClassName: N = "",
-    showCloseButton: T = !0,
-    onOpen: _,
+    showCloseButton: $ = !0,
+    onOpen: T,
     onCRTBootComplete: C
   }) => {
-    const z = pe(
-      () => ({ ...pr, ...v }),
+    const I = pe(
+      () => ({ ...Nr, ...v }),
       [v]
-    ), [G, f] = Z(!1), [M, V] = Z(!0), X = te(null), Q = te(null), re = te(null), ee = te(`modal-title-${Math.random().toString(36).slice(2)}`), F = D(() => {
+    ), [G, f] = Z(!1), [M, U] = Z(!0), X = te(null), Q = te(null), re = te(null), ee = te(`modal-title-${Math.random().toString(36).slice(2)}`), F = D(() => {
       f(!0), setTimeout(() => {
-        f(!1), V(!0), r();
-      }, z.closeDuration);
-    }, [r, z.closeDuration]);
+        f(!1), U(!0), r();
+      }, I.closeDuration);
+    }, [r, I.closeDuration]);
     oe(() => {
-      e && !G && (re.current = document.activeElement || null, V(!0), _?.(), setTimeout(() => {
-        V(!1), C?.(), Q.current?.focus();
-      }, z.openDuration));
+      e && !G && (re.current = document.activeElement || null, U(!0), T?.(), setTimeout(() => {
+        U(!1), C?.(), Q.current?.focus();
+      }, I.openDuration));
     }, [
       e,
       G,
-      _,
+      T,
       C,
-      z.openDuration
+      I.openDuration
     ]);
-    const U = D(() => {
+    const H = D(() => {
       c?.(), F();
     }, [c, F]), q = D(() => {
       l?.(), F();
@@ -5143,14 +5169,14 @@ const fr = ({
       }
     }, [e, K]);
     const o = pe(() => {
-      const u = h === "danger", b = u ? "border-error" : "border-accent", R = u ? "shadow-error" : "shadow-lg-accent", S = u ? "shadow-error/50" : "shadow-input-accent/50", E = u ? "animate-danger-glow" : "animate-rgb-glow";
-      return $(
+      const u = g === "danger", b = u ? "border-error" : "border-accent", R = u ? "shadow-error" : "shadow-lg-accent", S = u ? "shadow-error/50" : "shadow-input-accent/50", E = u ? "animate-danger-glow" : "animate-rgb-glow";
+      return _(
         "relative bg-surface border-2 rounded-lg max-h-[90vh] overflow-hidden flex flex-col transform transition-all duration-300",
-        br[p],
-        z.crtEffects && M ? `animate-crt-power-on ${b} ${R}` : z.crtEffects && G ? `animate-crt-power-off ${b} ${R}` : G ? `scale-95 opacity-0 ${b}/20` : M ? `scale-105 opacity-90 ${b} ${S}` : `scale-100 opacity-100 ${E}`,
+        Cr[p],
+        I.crtEffects && M ? `animate-crt-power-on ${b} ${R}` : I.crtEffects && G ? `animate-crt-power-off ${b} ${R}` : G ? `scale-95 opacity-0 ${b}/20` : M ? `scale-105 opacity-90 ${b} ${S}` : `scale-100 opacity-100 ${E}`,
         A
       );
-    }, [p, z.crtEffects, G, M, A, h]);
+    }, [p, I.crtEffects, G, M, A, g]);
     return e ? Fe(
       /* @__PURE__ */ t.jsx(
         "div",
@@ -5176,7 +5202,7 @@ const fr = ({
               "aria-labelledby": a ? ee.current : void 0,
               tabIndex: -1,
               children: [
-                T && /* @__PURE__ */ t.jsx(
+                $ && /* @__PURE__ */ t.jsx(
                   "button",
                   {
                     onClick: F,
@@ -5207,16 +5233,16 @@ const fr = ({
                 a && /* @__PURE__ */ t.jsx(
                   "div",
                   {
-                    className: $(
+                    className: _(
                       "px-6 py-4 border-b flex-shrink-0 transition-all duration-300",
-                      h === "danger" ? "border-error/20" : "border-accent/20",
+                      g === "danger" ? "border-error/20" : "border-accent/20",
                       M ? "opacity-0 translate-y-2" : "opacity-100 translate-y-0"
                     ),
                     children: /* @__PURE__ */ t.jsx(
                       "h2",
                       {
                         id: ee.current,
-                        className: $("text-lg font-semibold", h === "danger" ? "text-error" : "text-primary"),
+                        className: _("text-lg font-semibold", g === "danger" ? "text-error" : "text-primary"),
                         children: a
                       }
                     )
@@ -5232,22 +5258,22 @@ const fr = ({
                 (n || c || l) && /* @__PURE__ */ t.jsx(
                   "div",
                   {
-                    className: $(
+                    className: _(
                       "px-6 py-4 border-t flex-shrink-0 transition-all duration-300",
-                      h === "danger" ? "border-error/20" : "border-accent/20",
+                      g === "danger" ? "border-error/20" : "border-accent/20",
                       M ? "opacity-0 translate-y-2" : "opacity-100 translate-y-0"
                     ),
                     children: n || /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col-reverse sm:flex-row justify-between items-center gap-3", children: [
                       /* @__PURE__ */ t.jsx("span", { className: "text-muted text-xs font-mono hidden sm:block", children: "> ESC to abort" }),
                       /* @__PURE__ */ t.jsxs("div", { className: "flex gap-3 w-full sm:w-auto", children: [
-                        m && c && /* @__PURE__ */ t.jsx(We, { variant: "ghost", size: "sm", onClick: U, className: "flex-1 sm:flex-none", children: i }),
+                        m && c && /* @__PURE__ */ t.jsx(Ee, { variant: "ghost", size: "sm", onClick: H, className: "flex-1 sm:flex-none", children: i }),
                         y && l && /* @__PURE__ */ t.jsx(
-                          We,
+                          Ee,
                           {
-                            variant: h === "danger" ? "danger" : "primary",
+                            variant: g === "danger" ? "danger" : "primary",
                             size: "sm",
                             onClick: q,
-                            disabled: g,
+                            disabled: h,
                             className: "flex-1 sm:flex-none",
                             children: d
                           }
@@ -5265,8 +5291,8 @@ const fr = ({
     ) : null;
   }
 );
-hr.displayName = "CyberUI.Modal";
-const Ar = ({
+Sr.displayName = "CyberUI.Modal";
+const Er = ({
   children: e,
   variant: r = "primary",
   as: a = "span",
@@ -5280,11 +5306,13 @@ const Ar = ({
   return /* @__PURE__ */ t.jsx(
     a,
     {
-      className: $("bg-clip-text text-transparent inline-block", n(r), s),
+      className: _("bg-clip-text text-transparent inline-block", n(r), s),
       children: e
     }
   );
-}, Mr = ({
+};
+Er.displayName = "CyberUI.GradientText";
+const Tr = ({
   children: e,
   showLine: r = !0,
   size: a = "md",
@@ -5302,12 +5330,14 @@ const Ar = ({
     sm: "gap-3",
     md: "gap-4",
     lg: "gap-5"
-  }, i = H(a, n), d = H(a, c), g = H(a, l), m = $("flex items-center", g, d), y = $("uppercase tracking-[0.2em] text-secondary font-bold whitespace-nowrap", i);
-  return /* @__PURE__ */ t.jsxs("div", { className: $(m, s), children: [
+  }, i = V(a, n), d = V(a, c), h = V(a, l), m = _("flex items-center", h, d), y = _("uppercase tracking-[0.2em] text-secondary font-bold whitespace-nowrap", i);
+  return /* @__PURE__ */ t.jsxs("div", { className: _(m, s), children: [
     /* @__PURE__ */ t.jsx("h2", { className: y, children: e }),
     r && /* @__PURE__ */ t.jsx("div", { className: "h-[1px] w-full bg-gradient-to-r from-secondary/50 to-transparent" })
   ] });
-}, Lr = ({
+};
+Tr.displayName = "CyberUI.SectionTitle";
+const _r = ({
   events: e,
   size: r = "md",
   className: a = ""
@@ -5336,12 +5366,12 @@ const Ar = ({
     sm: "gap-3",
     md: "gap-4",
     lg: "gap-5"
-  }, g = {
+  }, h = {
     sm: "space-y-4",
     md: "space-y-6",
     lg: "space-y-8"
-  }, m = H(r, s), y = H(r, n), p = H(r, c), h = H(r, l), w = H(r, i), x = H(r, d), v = H(r, g), A = (T) => {
-    const _ = {
+  }, m = V(r, s), y = V(r, n), p = V(r, c), g = V(r, l), w = V(r, i), x = V(r, d), v = V(r, h), A = ($) => {
+    const T = {
       success: {
         border: "border-success bg-success/30 shadow-[0_0_10px_var(--color-success)]",
         background: "border-success bg-success/30 shadow-[0_0_10px_var(--color-success)]",
@@ -5363,88 +5393,90 @@ const Ar = ({
         inner: "bg-info/60"
       }
     };
-    return _[T] || _.info;
+    return T[$] || T.info;
   }, N = "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)";
-  return /* @__PURE__ */ t.jsx("div", { className: $(v, a), children: e.map((T, _) => {
-    const C = A(T.status);
-    return /* @__PURE__ */ t.jsxs("div", { className: $("flex", x, "group"), children: [
+  return /* @__PURE__ */ t.jsx("div", { className: _(v, a), children: e.map(($, T) => {
+    const C = A($.status);
+    return /* @__PURE__ */ t.jsxs("div", { className: _("flex", x, "group"), children: [
       /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col items-center", children: [
-        /* @__PURE__ */ t.jsxs("div", { className: $("relative flex-shrink-0 mt-1.5", m), children: [
+        /* @__PURE__ */ t.jsxs("div", { className: _("relative flex-shrink-0 mt-1.5", m), children: [
           /* @__PURE__ */ t.jsx(
             "div",
             {
-              className: $("absolute inset-0 border-2 transition-all duration-300", C.border),
+              className: _("absolute inset-0 border-2 transition-all duration-300", C.border),
               style: { clipPath: N }
             }
           ),
           /* @__PURE__ */ t.jsx(
             "div",
             {
-              className: $("absolute", y, C.inner),
+              className: _("absolute", y, C.inner),
               style: { clipPath: N }
             }
           )
         ] }),
-        _ < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "w-[2px] flex-1 bg-gradient-to-b from-secondary/50 to-transparent mt-2" })
+        T < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "w-[2px] flex-1 bg-gradient-to-b from-secondary/50 to-transparent mt-2" })
       ] }),
       /* @__PURE__ */ t.jsxs("div", { className: "flex-1 pb-6", children: [
         /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between mb-1", children: [
-          /* @__PURE__ */ t.jsx("h4", { className: $("font-semibold text-default group-hover:text-secondary transition-colors", p), children: T.title }),
-          /* @__PURE__ */ t.jsx("span", { className: $("text-muted whitespace-nowrap ml-4", w), children: T.time })
+          /* @__PURE__ */ t.jsx("h4", { className: _("font-semibold text-default group-hover:text-secondary transition-colors", p), children: $.title }),
+          /* @__PURE__ */ t.jsx("span", { className: _("text-muted whitespace-nowrap ml-4", w), children: $.time })
         ] }),
-        T.description && /* @__PURE__ */ t.jsx("p", { className: $("text-muted mt-1", h), children: T.description })
+        $.description && /* @__PURE__ */ t.jsx("p", { className: _("text-muted mt-1", g), children: $.description })
       ] })
-    ] }, _);
+    ] }, T);
   }) });
-}, zr = ({
+};
+_r.displayName = "CyberUI.Timeline";
+const $r = ({
   items: e,
   current: r = 0,
   orientation: a = { base: "vertical", md: "horizontal" },
   className: s = ""
 }) => {
-  const c = Ve(a, "vertical") === "vertical", l = (p, h) => {
-    const w = p.status === "completed" || p.status === void 0 && h < r, x = p.status === "current" || p.status === void 0 && h === r && r < e.length, v = p.status === "error";
+  const c = Ue(a, "vertical") === "vertical", l = (p, g) => {
+    const w = p.status === "completed" || p.status === void 0 && g < r, x = p.status === "current" || p.status === void 0 && g === r && r < e.length, v = p.status === "error";
     return { isCompleted: w, isCurrent: x, isError: v };
-  }, i = (p, h, w) => {
-    const x = $(
+  }, i = (p, g, w) => {
+    const x = _(
       "relative px-2 py-1 pb-2 font-bold text-sm transition-colors duration-200 whitespace-nowrap overflow-hidden",
       "after:content-[''] after:absolute after:left-0 after:right-0 after:bottom-0 after:h-[2px] after:w-full after:scale-x-0 after:origin-center after:transition-transform after:duration-300 after:ease-out",
       "before:content-[''] before:absolute before:left-1/2 before:-translate-x-1/2 before:-bottom-[3px] before:w-1.5 before:h-1.5 before:bg-accent before:rotate-45 before:rounded-[2px] before:opacity-0 before:transition-opacity before:duration-200"
     );
-    return p ? $(x, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : h ? $(x, "text-secondary before:opacity-100") : w ? $(x, "text-error") : $(x, "text-muted");
-  }, d = (p, h, w, x) => ({
+    return p ? _(x, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : g ? _(x, "text-secondary before:opacity-100") : w ? _(x, "text-error") : _(x, "text-muted");
+  }, d = (p, g, w, x) => ({
     color: "var(--color-primary)",
     opacity: w ? 0.8 : 0.3,
     filter: w ? "drop-shadow(0 0 4px color-mix(in srgb, var(--color-primary), transparent 40%))" : "none",
-    animation: h && p ? `chevronFlow 1.5s ease-in-out infinite ${x * 0.2}s` : "none"
-  }), g = $(c ? "flex flex-col items-start gap-0" : "flex items-center justify-center gap-4", s), m = (p, h, w) => p ? "text-secondary drop-shadow-[0_0_4px_var(--color-secondary)]" : h ? "text-accent drop-shadow-[0_0_6px_var(--color-accent)]" : w ? "text-error drop-shadow-[0_0_4px_var(--color-error)]" : "text-muted/50", y = (p, h, w) => {
-    const x = $(
+    animation: g && p ? `chevronFlow 1.5s ease-in-out infinite ${x * 0.2}s` : "none"
+  }), h = _(c ? "flex flex-col items-start gap-0" : "flex items-center justify-center gap-4", s), m = (p, g, w) => p ? "text-secondary drop-shadow-[0_0_4px_var(--color-secondary)]" : g ? "text-accent drop-shadow-[0_0_6px_var(--color-accent)]" : w ? "text-error drop-shadow-[0_0_4px_var(--color-error)]" : "text-muted/50", y = (p, g, w) => {
+    const x = _(
       "relative font-bold text-sm transition-colors duration-200 pb-1 w-fit",
       "after:content-[''] after:absolute after:left-0 after:right-0 after:bottom-0 after:h-[2px] after:w-full after:scale-x-0 after:origin-left after:transition-transform after:duration-300 after:ease-out"
     );
-    return p ? $(x, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : h ? $(x, "text-secondary") : w ? $(x, "text-error") : $(x, "text-muted");
+    return p ? _(x, "text-secondary after:bg-linear-(--gradient-accent) after:shadow-lg-accent after:scale-x-100") : g ? _(x, "text-secondary") : w ? _(x, "text-error") : _(x, "text-muted");
   };
-  return /* @__PURE__ */ t.jsx("div", { className: g, children: e.map((p, h) => {
-    const { isCompleted: w, isCurrent: x, isError: v } = l(p, h), A = h < e.length - 1 && (e[h + 1]?.status === "current" || e[h + 1]?.status === void 0 && h + 1 === r && r < e.length), N = h < e.length - 1 && (e[h + 1]?.status === "completed" || e[h + 1]?.status === void 0 && h + 1 < r);
-    return /* @__PURE__ */ t.jsxs(Ee.Fragment, { children: [
+  return /* @__PURE__ */ t.jsx("div", { className: h, children: e.map((p, g) => {
+    const { isCompleted: w, isCurrent: x, isError: v } = l(p, g), A = g < e.length - 1 && (e[g + 1]?.status === "current" || e[g + 1]?.status === void 0 && g + 1 === r && r < e.length), N = g < e.length - 1 && (e[g + 1]?.status === "completed" || e[g + 1]?.status === void 0 && g + 1 < r);
+    return /* @__PURE__ */ t.jsxs(Te.Fragment, { children: [
       c ? (
         // Vertical layout: step row + chevrons below
         /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col w-full", children: [
           /* @__PURE__ */ t.jsxs("div", { className: "flex items-start gap-1.5", children: [
-            /* @__PURE__ */ t.jsx("span", { className: $("text-xs leading-5 flex-shrink-0", m(w, x, v)), children: "▸" }),
+            /* @__PURE__ */ t.jsx("span", { className: _("text-xs leading-5 flex-shrink-0", m(w, x, v)), children: "▸" }),
             /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col", children: [
               /* @__PURE__ */ t.jsx("div", { className: y(w, x, v), children: p.title }),
               p.description && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-muted mt-0.5 font-normal", children: p.description })
             ] })
           ] }),
-          h < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex flex-col items-center py-0.5", children: [0, 1, 2].map((T) => /* @__PURE__ */ t.jsx(
+          g < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex flex-col items-center py-0.5", children: [0, 1, 2].map(($) => /* @__PURE__ */ t.jsx(
             "div",
             {
               className: "text-sm font-bold transition-all duration-300 rotate-90 leading-[0.6]",
-              style: d(w, A, N, T),
+              style: d(w, A, N, $),
               children: "›"
             },
-            T
+            $
           )) })
         ] })
       ) : (
@@ -5454,18 +5486,20 @@ const Ar = ({
           p.description && /* @__PURE__ */ t.jsx("div", { className: "text-xs text-muted mt-1 font-normal", children: p.description })
         ] })
       ),
-      !c && h < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex", children: [0, 1, 2].map((T) => /* @__PURE__ */ t.jsx(
+      !c && g < e.length - 1 && /* @__PURE__ */ t.jsx("div", { className: "flex", children: [0, 1, 2].map(($) => /* @__PURE__ */ t.jsx(
         "div",
         {
           className: "text-2xl font-bold transition-all duration-300",
-          style: d(w, A, N, T),
+          style: d(w, A, N, $),
           children: "›"
         },
-        T
+        $
       )) })
-    ] }, h);
+    ] }, g);
   }) });
-}, Pr = ({
+};
+$r.displayName = "CyberUI.Steps";
+const Rr = ({
   variant: e = "gradient",
   orientation: r = "horizontal",
   className: a = ""
@@ -5474,13 +5508,15 @@ const Ar = ({
     gradient: i === "horizontal" ? "bg-gradient-to-r from-transparent via-secondary/50 to-transparent" : "bg-gradient-to-b from-transparent via-secondary/50 to-transparent",
     solid: "bg-secondary/30",
     dashed: `border-dashed border-secondary/50 ${i === "horizontal" ? "border-t" : "border-l"}`
-  })[l], c = $(
+  })[l], c = _(
     s(r),
     n(e, r),
     a
   );
   return /* @__PURE__ */ t.jsx("div", { className: c });
-}, Ir = ({
+};
+Rr.displayName = "CyberUI.Divider";
+const Ar = ({
   label: e,
   error: r,
   size: a = "md",
@@ -5491,9 +5527,9 @@ const Ar = ({
   disabled: i,
   ...d
 }) => {
-  const [g, m] = Ee.useState(d.defaultChecked || !1), y = n !== void 0 ? n : g, p = (C) => {
+  const [h, m] = Te.useState(d.defaultChecked || !1), y = n !== void 0 ? n : h, p = (C) => {
     i || (n === void 0 && m(C.target.checked), c?.(C), l?.(C.target.checked));
-  }, h = {
+  }, g = {
     sm: "w-4 h-4",
     md: "w-5 h-5",
     lg: "w-6 h-6"
@@ -5505,13 +5541,13 @@ const Ar = ({
     sm: "ml-6",
     md: "ml-8",
     lg: "ml-9"
-  }, v = H(a, h), A = H(a, w), N = H(a, x), T = (C) => i ? "stroke-muted/20" : $("transition-all duration-200 group-hover:stroke-secondary group-hover:stroke-[1.5]", C ? "stroke-secondary" : "stroke-secondary/50"), _ = (C) => {
-    const z = "transition-all duration-200";
-    return i ? $(z, C ? "fill-muted/20" : "fill-transparent") : $(z, C ? "fill-secondary" : "fill-transparent");
+  }, v = V(a, g), A = V(a, w), N = V(a, x), $ = (C) => i ? "stroke-muted/20" : _("transition-all duration-200 group-hover:stroke-secondary group-hover:stroke-[1.5]", C ? "stroke-secondary" : "stroke-secondary/50"), T = (C) => {
+    const I = "transition-all duration-200";
+    return i ? _(I, C ? "fill-muted/20" : "fill-transparent") : _(I, C ? "fill-secondary" : "fill-transparent");
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: $("flex flex-col gap-1", s, i && "opacity-50 cursor-not-allowed"), children: [
-    /* @__PURE__ */ t.jsxs("label", { className: $("flex items-center gap-3 group", i ? "cursor-not-allowed pointer-events-none" : "cursor-pointer"), children: [
-      /* @__PURE__ */ t.jsxs("div", { className: $("relative flex-shrink-0", v), children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: _("flex flex-col gap-1", s, i && "opacity-50 cursor-not-allowed"), children: [
+    /* @__PURE__ */ t.jsxs("label", { className: _("flex items-center gap-3 group", i ? "cursor-not-allowed pointer-events-none" : "cursor-pointer"), children: [
+      /* @__PURE__ */ t.jsxs("div", { className: _("relative flex-shrink-0", v), children: [
         /* @__PURE__ */ t.jsx(
           "input",
           {
@@ -5542,7 +5578,7 @@ const Ar = ({
                 "path",
                 {
                   d: "M 1 1 L 19 1 L 19 15 L 15 19 L 1 19 Z",
-                  className: T(y),
+                  className: $(y),
                   strokeWidth: "1",
                   fill: "none"
                 }
@@ -5551,18 +5587,20 @@ const Ar = ({
                 "path",
                 {
                   d: "M 4 4 L 16 4 L 16 13 L 13 16 L 4 16 Z",
-                  className: _(y)
+                  className: T(y)
                 }
               )
             ]
           }
         )
       ] }),
-      e && /* @__PURE__ */ t.jsx("span", { className: $("transition-colors", A, i ? "text-muted" : "text-muted group-hover:text-secondary"), children: e })
+      e && /* @__PURE__ */ t.jsx("span", { className: _("transition-colors", A, i ? "text-muted" : "text-muted group-hover:text-secondary"), children: e })
     ] }),
-    r && !i && /* @__PURE__ */ t.jsx("span", { className: $("text-xs text-error", N), children: r })
+    r && !i && /* @__PURE__ */ t.jsx("span", { className: _("text-xs text-error", N), children: r })
   ] });
-}, ne = {
+};
+Ar.displayName = "CyberUI.Checkbox";
+const ne = {
   MOBILE_BREAKPOINT: 768,
   STABLE_TIMEOUT: 1e3,
   MOBILE_HIDE_DELAY: 1e3,
@@ -5578,20 +5616,20 @@ const Ar = ({
     pageLevel: n,
     variant: c = "default",
     className: l = ""
-  } = e, i = te(null), d = te(null), g = te(Date.now()), m = te(0), y = te(void 0), p = te([]), h = te(void 0), [w, x] = Z({
+  } = e, i = te(null), d = te(null), h = te(Date.now()), m = te(0), y = te(void 0), p = te([]), g = te(void 0), [w, x] = Z({
     isScrolling: !1,
     direction: null,
     velocity: 0,
     position: 0,
     scrollDistance: 0
-  }), [v, A] = Z(!1), [N, T] = Z(() => typeof window > "u" ? !1 : window.innerWidth >= ne.MOBILE_BREAKPOINT), _ = te(0), [C, z] = Z(n ?? !1);
+  }), [v, A] = Z(!1), [N, $] = Z(() => typeof window > "u" ? !1 : window.innerWidth >= ne.MOBILE_BREAKPOINT), T = te(0), [C, I] = Z(n ?? !1);
   oe(() => {
     if (n !== void 0)
-      z(n);
+      I(n);
     else {
       const u = setTimeout(() => {
         const b = i.current !== null;
-        z(!b);
+        I(!b);
       }, 0);
       return () => clearTimeout(u);
     }
@@ -5631,9 +5669,9 @@ const Ar = ({
       arrowGap: u ? 2 : 4
     };
   }, []), M = D((u, b, R, S) => {
-    const E = (S + R) * 2, I = R * 4, O = (u - E - I) / 2;
+    const E = (S + R) * 2, P = R * 4, O = (u - E - P) / 2;
     return Math.floor(O / (b + R));
-  }, []), V = D((u) => {
+  }, []), U = D((u) => {
     if (C) {
       if (!document.querySelector("#cyber-page-scrollbar-styles")) {
         const b = document.createElement("style");
@@ -5652,13 +5690,13 @@ const Ar = ({
       u.classList.add("cyber-scrollbar-container");
     }
   }, [C]), X = D((u, b, R, S) => {
-    const E = document.createElement("div"), I = u === "arrow";
-    I && b ? (E.className = `cyber-arrow cyber-arrow-${b} cyber-arrow-${R}`, E.innerHTML = b === "up" ? "▲" : "▼") : (E.className = `cyber-line cyber-line-${R}`, E.innerHTML = "=");
+    const E = document.createElement("div"), P = u === "arrow";
+    P && b ? (E.className = `cyber-arrow cyber-arrow-${b} cyber-arrow-${R}`, E.innerHTML = b === "up" ? "▲" : "▼") : (E.className = `cyber-line cyber-line-${R}`, E.innerHTML = "=");
     const W = S.isMobile ? "none" : `drop-shadow(0 0 6px var(--color-${r}))
          drop-shadow(0 0 12px var(--color-${r}))
          drop-shadow(0 0 18px var(--color-${r}))`;
     return E.style.cssText = `
-      font-size: ${I ? S.arrowSize : S.lineSize}px;
+      font-size: ${P ? S.arrowSize : S.lineSize}px;
       color: var(--color-${r});
       opacity: 0;
       transition: all 0.2s ease;
@@ -5684,7 +5722,7 @@ const Ar = ({
   }, [C]), re = D(() => {
     if (s || !C && !i.current || (d.current && d.current.remove(), !(C ? document.body.scrollHeight > window.innerHeight : i.current.scrollHeight > i.current.clientHeight))) return;
     const b = f(), R = Q(), S = M(R.height, b.arrowSize, b.arrowGap, b.lineSize);
-    V(C ? void 0 : i.current || void 0);
+    U(C ? void 0 : i.current || void 0);
     const E = document.createElement("div");
     E.className = `cyber-scrollbar ${l}`.trim();
     const W = b.isMobile ? "transparent" : c, O = G(W);
@@ -5724,16 +5762,16 @@ const Ar = ({
     return L && (window.addEventListener("resize", L), window.addEventListener("scroll", L)), () => {
       E.remove(), !C && i.current && i.current.classList.remove("cyber-scrollbar-container"), L && (window.removeEventListener("resize", L), window.removeEventListener("scroll", L));
     };
-  }, [s, C, N, V, Q, X, f, M, G, c, l]), ee = D((u, b) => {
+  }, [s, C, N, U, Q, X, f, M, G, c, l]), ee = D((u, b) => {
     const R = Math.max(1, Math.min(3, Math.ceil(u * 0.8))), S = Math.floor(b / ne.DISTANCE_THRESHOLD);
     return R + S;
   }, []), F = D((u, b, R) => {
     const S = Array.from(u).filter(
-      (I) => I.classList.contains(`cyber-arrow-${b}`)
+      (P) => P.classList.contains(`cyber-arrow-${b}`)
     ), E = Math.min(R, S.length);
     return b === "up" ? S.slice(-E) : S.slice(0, E);
-  }, []), U = D((u, b, R) => {
-    const S = Math.min(b * a, ne.MAX_ANIMATION_SPEED), E = window.innerWidth < ne.MOBILE_BREAKPOINT, I = Math.max(300 / S, ne.MIN_GLOW_DURATION) * (E ? 1.5 : 1), W = Math.max(40, 80 / S) * (E ? 1.25 : 1), O = R === "up" ? [...u].reverse() : u;
+  }, []), H = D((u, b, R) => {
+    const S = Math.min(b * a, ne.MAX_ANIMATION_SPEED), E = window.innerWidth < ne.MOBILE_BREAKPOINT, P = Math.max(300 / S, ne.MIN_GLOW_DURATION) * (E ? 1.5 : 1), W = Math.max(40, 80 / S) * (E ? 1.25 : 1), O = R === "up" ? [...u].reverse() : u;
     O.forEach((L) => {
       L.style.opacity = "0.3";
     }), O.forEach((L, B) => {
@@ -5741,33 +5779,33 @@ const Ar = ({
         L.style.opacity = "1";
         const be = setTimeout(() => {
           L.style.opacity = "0.3";
-        }, I);
+        }, P);
         p.current.push(be);
       }, se);
       p.current.push(fe);
     });
   }, [a]), q = D(() => {
     if (!d.current) return;
-    const { isScrolling: u, direction: b, velocity: R, scrollDistance: S } = w, E = d.current.querySelectorAll(".cyber-arrow"), I = d.current.querySelectorAll(".cyber-line");
+    const { isScrolling: u, direction: b, velocity: R, scrollDistance: S } = w, E = d.current.querySelectorAll(".cyber-arrow"), P = d.current.querySelectorAll(".cyber-line");
     if (u && b) {
-      I.forEach((O) => {
+      P.forEach((O) => {
         O.style.opacity = "0";
       });
       const W = ee(R, S);
-      if (W !== _.current) {
+      if (W !== T.current) {
         p.current.forEach((L) => clearTimeout(L)), p.current = [], E.forEach((L) => {
           L.style.opacity = "0";
         });
         const O = F(Array.from(E), b, W);
-        U(O, R, b), _.current = W;
+        H(O, R, b), T.current = W;
       }
     } else
-      p.current.forEach((W) => clearTimeout(W)), p.current = [], _.current = 0, E.forEach((W) => {
+      p.current.forEach((W) => clearTimeout(W)), p.current = [], T.current = 0, E.forEach((W) => {
         W.style.opacity = "0";
-      }), v && I.forEach((W) => {
+      }), v && P.forEach((W) => {
         W.style.opacity = "0.6";
       });
-  }, [w, v, U, ee, F]), Y = te(null), K = D(() => {
+  }, [w, v, H, ee, F]), Y = te(null), K = D(() => {
     if (s || !C && !i.current) return;
     const u = Date.now(), b = C ? {
       currentScrollTop: window.scrollY,
@@ -5777,25 +5815,25 @@ const Ar = ({
       currentScrollTop: i.current.scrollTop,
       scrollHeight: i.current.scrollHeight,
       clientHeight: i.current.clientHeight
-    }, R = u - g.current, S = b.currentScrollTop - m.current, I = Math.abs(S) / Math.max(R, 1) * ne.VELOCITY_MULTIPLIER, W = S > 0 ? "down" : S < 0 ? "up" : null, O = b.currentScrollTop / (b.scrollHeight - b.clientHeight);
+    }, R = u - h.current, S = b.currentScrollTop - m.current, P = Math.abs(S) / Math.max(R, 1) * ne.VELOCITY_MULTIPLIER, W = S > 0 ? "down" : S < 0 ? "up" : null, O = b.currentScrollTop / (b.scrollHeight - b.clientHeight);
     v || A(!0);
     const L = window.innerWidth < ne.MOBILE_BREAKPOINT;
-    L && !N && T(!0), x((B) => ({
+    L && !N && $(!0), x((B) => ({
       isScrolling: !0,
       direction: W,
-      velocity: I,
+      velocity: P,
       position: O,
       scrollDistance: B.direction !== W ? Math.abs(S) : B.scrollDistance + Math.abs(S)
-    })), y.current && clearTimeout(y.current), h.current && clearTimeout(h.current), y.current = setTimeout(() => {
+    })), y.current && clearTimeout(y.current), g.current && clearTimeout(g.current), y.current = setTimeout(() => {
       p.current.forEach((B) => clearTimeout(B)), p.current = [], x((B) => ({
         ...B,
         isScrolling: !1,
         velocity: 0,
         scrollDistance: 0
-      })), L && (h.current = setTimeout(() => {
-        T(!1);
+      })), L && (g.current = setTimeout(() => {
+        $(!1);
       }, ne.MOBILE_HIDE_DELAY));
-    }, ne.STABLE_TIMEOUT), g.current = u, m.current = b.currentScrollTop;
+    }, ne.STABLE_TIMEOUT), h.current = u, m.current = b.currentScrollTop;
   }, [s, C, v, N]), o = D(() => {
     Y.current === null && (Y.current = requestAnimationFrame(() => {
       Y.current = null, K();
@@ -5805,13 +5843,13 @@ const Ar = ({
     if (s || !C && !i.current) return;
     const u = re(), b = C ? window : i.current;
     return b.addEventListener("scroll", o, { passive: !0 }), () => {
-      b.removeEventListener("scroll", o), y.current && clearTimeout(y.current), h.current && clearTimeout(h.current), p.current.forEach((R) => clearTimeout(R)), Y.current !== null && (cancelAnimationFrame(Y.current), Y.current = null), u?.();
+      b.removeEventListener("scroll", o), y.current && clearTimeout(y.current), g.current && clearTimeout(g.current), p.current.forEach((R) => clearTimeout(R)), Y.current !== null && (cancelAnimationFrame(Y.current), Y.current = null), u?.();
     };
   }, [re, o, s, C]), oe(() => {
     q();
   }, [q]), i;
-}, nt = lt(void 0), Dr = () => {
-  const e = it(nt);
+}, it = ct(void 0), Dr = () => {
+  const e = dt(it);
   if (e === void 0)
     throw new Error(
       "useCyberNotifications must be used within a CyberNotificationProvider"
@@ -5821,8 +5859,8 @@ const Ar = ({
   const { min: r = 5, max: a = 95, speed: s = 30 } = e, [n, c] = Z(0), [l, i] = Z(1);
   return oe(() => {
     const d = setInterval(() => {
-      c((g) => {
-        let m = g + l;
+      c((h) => {
+        let m = h + l;
         return m >= a ? (m = a, i(-1)) : m <= r && (m = r, i(1)), m;
       });
     }, s);
@@ -5830,8 +5868,8 @@ const Ar = ({
   }, [l, r, a, s]), n;
 }, Wr = ({ children: e, position: r = "top-right", defaultDuration: a = 2500 }) => {
   const [s, n] = Z([]), c = D(
-    (m, y, p, h = {}) => {
-      const w = Date.now().toString(), { autoHide: x = !0, duration: v = a } = h;
+    (m, y, p, g = {}) => {
+      const w = Date.now().toString(), { autoHide: x = !0, duration: v = a } = g;
       return n((A) => [...A, { id: w, type: m, title: y, message: p }]), x && setTimeout(() => {
         n(
           (A) => A.map((N) => N.id === w ? { ...N, isClosing: !0 } : N)
@@ -5851,20 +5889,20 @@ const Ar = ({
     n([]);
   }, []), d = D((m, y) => {
     n(
-      (p) => p.map((h) => h.id === m ? { ...h, width: y } : h)
+      (p) => p.map((g) => g.id === m ? { ...g, width: y } : g)
     );
-  }, []), g = {
+  }, []), h = {
     notifications: s,
     showNotification: c,
     hideNotification: l,
     clearAllNotifications: i
   };
-  return /* @__PURE__ */ t.jsxs(nt.Provider, { value: g, children: [
+  return /* @__PURE__ */ t.jsxs(it.Provider, { value: h, children: [
     e,
     s.length > 0 && /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: `fixed z-50 ${gr(r)}`,
+        className: `fixed z-50 ${Mr(r)}`,
         "aria-live": "polite",
         "aria-relevant": "additions text",
         "aria-atomic": "true",
@@ -5889,12 +5927,12 @@ const Ar = ({
                 },
                 ref: (p) => {
                   if (p && !m.width) {
-                    const h = p.scrollWidth;
-                    d(m.id, h);
+                    const g = p.scrollWidth;
+                    d(m.id, g);
                   }
                 },
                 children: /* @__PURE__ */ t.jsx(
-                  ur,
+                  nt,
                   {
                     type: m.type,
                     title: m.title,
@@ -5911,7 +5949,7 @@ const Ar = ({
       }
     )
   ] });
-}, gr = (e) => {
+}, Mr = (e) => {
   const r = {
     "top-right": "top-4 right-4",
     "top-left": "top-4 left-4",
@@ -5919,7 +5957,7 @@ const Ar = ({
     "bottom-left": "bottom-4 left-4"
   };
   return r[e] || r["top-right"];
-}, Br = "2.3.0";
+}, Br = "2.3.1";
 if (typeof window < "u") {
   const e = () => {
     getComputedStyle(document.documentElement).getPropertyValue("--color-primary").trim() || console.warn(
@@ -5934,32 +5972,32 @@ Without it all components lose colors, backgrounds, and animations.`
   document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", e, { once: !0 }) : e();
 }
 export {
-  Er as Badge,
-  We as Button,
-  Sr as Card,
-  Rr as Carousel,
-  Ir as Checkbox,
-  kr as CircularProgress,
+  yr as Badge,
+  Ee as Button,
+  xr as Card,
+  Pr as Carousel,
+  Ar as Checkbox,
+  cr as CircularProgress,
   Wr as CyberNotificationProvider,
-  Pr as Divider,
-  Ar as GradientText,
+  Rr as Divider,
+  Er as GradientText,
   je as Image,
-  Cr as Input,
-  Nr as LinearProgress,
-  hr as Modal,
-  ur as Notification,
+  hr as Input,
+  gr as LinearProgress,
+  Sr as Modal,
+  nt as Notification,
   ae as RESPONSIVE_SIZE_MAPS,
-  Mr as SectionTitle,
-  jr as SegmentedProgress,
-  $r as Select,
-  Tr as Skeleton,
-  zr as Steps,
-  wr as TabNavigation,
-  Lr as Timeline,
-  _r as Toggle,
-  $ as cn,
-  vr as combineResponsiveClasses,
-  H as getResponsiveClasses,
+  Tr as SectionTitle,
+  br as SegmentedProgress,
+  wr as Select,
+  kr as Skeleton,
+  $r as Steps,
+  ht as TabNavigation,
+  _r as Timeline,
+  vr as Toggle,
+  _ as cn,
+  zr as combineResponsiveClasses,
+  V as getResponsiveClasses,
   Gr as useAnimatedProgress,
   Dr as useCyberNotifications,
   Or as useCyberScrollbar,