fiboui 2.6.0 → 2.6.2

package/dist/{client-C9ZVisXx.js → client-toSjALhM.js}

@@ -2,21 +2,21 @@
 var kt = Object.defineProperty;
 var _t = (t, o, e) => o in t ? kt(t, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[o] = e;
 var c = (t, o, e) => _t(t, typeof o != "symbol" ? o + "" : o, e);
-import l, { useCallback as ro, useSyncExternalStore as uo, useRef as U, createContext as yo, useContext as Fo, useEffect as Z, useState as G, memo as Fe, cloneElement as St, useMemo as Ct, useLayoutEffect as oe, Component as zt, Suspense as Et } from "react";
-import { jsx as W, Fragment as re, jsxs as Po } from "react/jsx-runtime";
-class Re {
+import l, { useCallback as ro, useSyncExternalStore as uo, useRef as U, createContext as yo, useContext as Ro, useEffect as q, useState as Y, memo as Re, cloneElement as St, useMemo as Ct, useLayoutEffect as oe, Component as zt, Suspense as Et } from "react";
+import { jsx as H, Fragment as re, jsxs as Po } from "react/jsx-runtime";
+class Ne {
   constructor() {
     c(this, "activeEffect", null);
   }
 }
-const Be = new Re(), Vo = [Be];
+const Be = new Ne(), Vo = [Be];
 function Ae() {
-  return new Re();
+  return new Ne();
 }
 function Le() {
   return Vo[Vo.length - 1] ?? Be;
 }
-function Do() {
+function Xo() {
   return Le().activeEffect;
 }
 function Pe(t, o) {
@@ -27,7 +27,7 @@ function Pe(t, o) {
     Vo.pop();
   }
 }
-function No(t) {
+function $o(t) {
   const o = Le(), e = o.activeEffect;
   return o.activeEffect = t, e;
 }
@@ -38,11 +38,11 @@ class Me {
     this.fn = o, this.run();
   }
   run() {
-    const o = No(this);
+    const o = $o(this);
     try {
       this.cleanup(), this.fn();
     } finally {
-      No(o);
+      $o(o);
     }
   }
   track(o) {
@@ -65,11 +65,11 @@ class Tt {
     this._onInvalidate = o;
   }
   execute(o) {
-    const e = No(this);
+    const e = $o(this);
     try {
       return this.cleanup(), o();
     } finally {
-      No(e);
+      $o(e);
     }
   }
   track(o) {
@@ -93,7 +93,7 @@ class To {
     this._value = o;
   }
   get value() {
-    const o = Do();
+    const o = Xo();
     return o && o.track(this), this._value;
   }
   set value(o) {
@@ -125,7 +125,7 @@ class To {
 function Ln(t) {
   return new To(t);
 }
-class $t {
+class It {
   constructor(o) {
     c(this, "listeners", /* @__PURE__ */ new Set());
     c(this, "effects", /* @__PURE__ */ new Set());
@@ -138,13 +138,13 @@ class $t {
     });
   }
   get value() {
-    const o = Do();
+    const o = Xo();
     if (o && o.track(this), this._dirty) {
-      const e = No(this.internalEffect);
+      const e = $o(this.internalEffect);
       try {
         this.internalEffect.cleanup(), this._value = this.fn(), this._dirty = !1;
       } finally {
-        No(e);
+        $o(e);
       }
     }
     return this._value;
@@ -173,16 +173,16 @@ class $t {
   }
 }
 function Pn(t) {
-  return new $t(t);
+  return new It(t);
 }
-class Nt {
+class $t {
   constructor(o) {
     c(this, "listeners", /* @__PURE__ */ new Set());
     c(this, "effects", /* @__PURE__ */ new Set());
     this._value = o;
   }
   get() {
-    const o = Do();
+    const o = Xo();
     return o && o.track(this), this._value;
   }
   set(o) {
@@ -202,16 +202,16 @@ class Nt {
   }
 }
 function Mn(t) {
-  return new Nt(t);
+  return new $t(t);
 }
-class It {
+class Ft {
   constructor(o) {
     c(this, "listeners", /* @__PURE__ */ new Set());
     c(this, "effects", /* @__PURE__ */ new Set());
     this.state = o;
   }
   getState() {
-    const o = Do();
+    const o = Xo();
     return o && o.track(this), this.state;
   }
   setState(o) {
@@ -232,12 +232,12 @@ class It {
   }
 }
 function On(t) {
-  return new It(t);
+  return new Ft(t);
 }
-const Oe = "FIBO:", Ft = "", We = /\uE000FIBO:(\d+)\uE001/g, jo = [];
-function Rt(t) {
+const Oe = "FIBO:", Rt = "", We = /\uE000FIBO:(\d+)\uE001/g, jo = [];
+function Nt(t) {
   const o = jo.length;
-  return jo.push(t), `${Oe}${o}${Ft}`;
+  return jo.push(t), `${Oe}${o}${Rt}`;
 }
 function Bt(t) {
   return t.includes(Oe);
@@ -264,7 +264,7 @@ class Pt {
     this.signal = o;
   }
   toString() {
-    return Rt(this.signal);
+    return Nt(this.signal);
   }
   valueOf() {
     return this.toString();
@@ -296,11 +296,11 @@ function jn(t) {
 }
 const Ot = Ae(), He = yo(Ot);
 function Ve() {
-  return Fo(He);
+  return Ro(He);
 }
-function Xn({ children: t, scope: o }) {
+function Dn({ children: t, scope: o }) {
   const e = U(o ?? Ae()).current;
-  return /* @__PURE__ */ W(He.Provider, { value: e, children: t });
+  return /* @__PURE__ */ H(He.Provider, { value: e, children: t });
 }
 function Wt({ children: t }) {
   const o = U(0), e = U(/* @__PURE__ */ new Set()), i = U(null);
@@ -310,7 +310,7 @@ function Wt({ children: t }) {
   const r = ro((a) => (e.current.add(a), () => {
     e.current.delete(a);
   }), []), n = ro(() => o.current, []);
-  uo(r, n, n), Z(() => () => {
+  uo(r, n, n), q(() => () => {
     var a;
     (a = i.current) == null || a.dispose();
   }, []);
@@ -321,17 +321,17 @@ function Wt({ children: t }) {
   } catch {
     f = null;
   }
-  return /* @__PURE__ */ W(re, { children: f });
+  return /* @__PURE__ */ H(re, { children: f });
 }
 const Ht = yo(/* @__PURE__ */ new Map()), je = yo(null);
-function Dn(t) {
-  const o = Fo(je);
+function Xn(t) {
+  const o = Ro(je);
   if (!o)
     throw new Error("useBuilderState must be used under a builder that called .state()");
   return [o.get(t), (e) => o.set(t, e)];
 }
 function Vt({ stateMap: t = /* @__PURE__ */ new Map(), children: o }) {
-  const [e, i] = G(() => new Map(t)), r = {
+  const [e, i] = Y(() => new Map(t)), r = {
     map: e,
     get: (n) => e.get(n),
     set: (n, s) => {
@@ -343,7 +343,7 @@ function Vt({ stateMap: t = /* @__PURE__ */ new Map(), children: o }) {
       });
     }
   };
-  return /* @__PURE__ */ W(je.Provider, { value: r, children: /* @__PURE__ */ W(Ht.Provider, { value: e, children: o }) });
+  return /* @__PURE__ */ H(je.Provider, { value: r, children: /* @__PURE__ */ H(Ht.Provider, { value: e, children: o }) });
 }
 function jt({ observables: t, children: o }) {
   const e = U(0), i = ro((n) => {
@@ -354,9 +354,9 @@ function jt({ observables: t, children: o }) {
     );
     return () => s.forEach((f) => f());
   }, [t]), r = ro(() => e.current, []);
-  return uo(i, r, r), /* @__PURE__ */ W(re, { children: typeof o == "function" ? o() : o });
+  return uo(i, r, r), /* @__PURE__ */ H(re, { children: typeof o == "function" ? o() : o });
 }
-function Xt({ signals: t, children: o }) {
+function Dt({ signals: t, children: o }) {
   const e = U(0), i = ro((n) => {
     const s = Array.from(t).map(
       (f) => f.subscribe(() => {
@@ -365,17 +365,17 @@ function Xt({ signals: t, children: o }) {
     );
     return () => s.forEach((f) => f());
   }, [t]), r = ro(() => e.current, []);
-  return uo(i, r, r), /* @__PURE__ */ W(re, { children: typeof o == "function" ? o() : o });
+  return uo(i, r, r), /* @__PURE__ */ H(re, { children: typeof o == "function" ? o() : o });
 }
-const Xe = yo(/* @__PURE__ */ new Map());
+const De = yo(/* @__PURE__ */ new Map());
 function Yn(t) {
-  const o = Fo(Xe);
+  const o = Ro(De);
   return o == null ? void 0 : o.get(t);
 }
-function Dt({ providers: t = /* @__PURE__ */ new Map(), children: o }) {
-  return /* @__PURE__ */ W(Xe.Provider, { value: t, children: o });
+function Xt({ providers: t = /* @__PURE__ */ new Map(), children: o }) {
+  return /* @__PURE__ */ H(De.Provider, { value: t, children: o });
 }
-function De({
+function Xe({
   compute: t,
   as: o = "span",
   className: e,
@@ -383,7 +383,7 @@ function De({
   ...r
 }) {
   const n = Ve(), s = U(null), f = t();
-  return Z(() => Pe(n, () => {
+  return q(() => Pe(n, () => {
     const a = new Me(() => {
       const u = t();
       s.current && s.current.textContent !== u && (s.current.textContent = u);
@@ -392,7 +392,7 @@ function De({
   }), [t, n]), l.createElement(o, { ref: s, className: e, style: i, ...r }, f);
 }
 function Gn(t, o) {
-  return l.createElement(De, {
+  return l.createElement(Xe, {
     compute: () => String(t.value),
     as: o
   });
@@ -426,7 +426,7 @@ function Un(t, o, e) {
   return i < 768 && o.mobile ? r = { ...r, ...o.mobile } : i >= 768 && i < 1024 && o.tablet ? r = { ...r, ...o.tablet } : i >= 1024 && o.desktop && (r = { ...r, ...o.desktop }), r;
 }
 function Kn(t, o) {
-  const e = Fe(t, o);
+  const e = Re(t, o);
   return (i) => l.createElement(e, i);
 }
 const Kt = {
@@ -440,8 +440,8 @@ const Kt = {
   bounce: (t) => t < 1 / 2.75 ? 7.5625 * t * t : t < 2 / 2.75 ? 7.5625 * (t -= 1.5 / 2.75) * t + 0.75 : t < 2.5 / 2.75 ? 7.5625 * (t -= 2.25 / 2.75) * t + 0.9375 : 7.5625 * (t -= 2.625 / 2.75) * t + 0.984375
 };
 function qn(t, o) {
-  const { duration: e = 300, delay: i = 0, easing: r = Kt.easeOut } = o || {}, [n, s] = G(t), f = U(), a = U(n);
-  return a.current = n, Z(() => {
+  const { duration: e = 300, delay: i = 0, easing: r = Kt.easeOut } = o || {}, [n, s] = Y(t), f = U(), a = U(n);
+  return a.current = n, q(() => {
     f.current && cancelAnimationFrame(f.current);
     let u = null;
     const b = a.current, h = (d) => {
@@ -460,8 +460,8 @@ function qn(t, o) {
   }, [t, e, i]), n;
 }
 function Zn(t, o) {
-  const { stiffness: e = 170, damping: i = 26, mass: r = 1 } = o || {}, [n, s] = G(t), f = U(0), a = U();
-  return Z(() => {
+  const { stiffness: e = 170, damping: i = 26, mass: r = 1 } = o || {}, [n, s] = Y(t), f = U(0), a = U();
+  return q(() => {
     let u = n, b = f.current;
     const h = () => {
       const d = -e * (u - t), x = -i * b, m = (d + x) / r;
@@ -473,10 +473,10 @@ function Zn(t, o) {
   }, [t, e, i, r]), n;
 }
 function Jn(t, o = 300) {
-  const [e, i] = G(t), [r, n] = G(
+  const [e, i] = Y(t), [r, n] = Y(
     t ? "entered" : "exited"
   );
-  return Z(() => {
+  return q(() => {
     if (t) {
       i(!0), n("entering");
       const s = setTimeout(() => n("entered"), 50);
@@ -508,8 +508,8 @@ function os() {
   );
 }
 function es() {
-  const [t, o] = G(0);
-  return Z(() => {
+  const [t, o] = Y(0);
+  return q(() => {
     if (typeof window > "u") return;
     const e = () => {
       const i = document.documentElement.scrollHeight - window.innerHeight;
@@ -540,8 +540,8 @@ function Ye(t = {}) {
   b[b.length - 1] !== 1 && b.push(1);
   const d = Math.max(1, Math.floor((b.length - 1) / 24)), x = [];
   for (let p = 0; p < b.length; p += d) {
-    const T = p / (b.length - 1), N = Math.round(b[p] * 1e4) / 1e4;
-    x.push(p === 0 ? `${N}` : `${N} ${Math.round(T * 1e4) / 100}%`);
+    const T = p / (b.length - 1), F = Math.round(b[p] * 1e4) / 1e4;
+    x.push(p === 0 ? `${F}` : `${F} ${Math.round(T * 1e4) / 100}%`);
   }
   const m = `linear(${x.join(", ")})`;
   return ue.set(r, m), m;
@@ -911,12 +911,12 @@ function ni(t) {
   const o = t.match(/oklch\(\s*([\d.]+)\s+([\d.]+)\s+([\d.]+)\s*\)/);
   if (!o)
     return t;
-  const [, e, i, r] = o, n = parseFloat(e), s = parseFloat(i), f = parseFloat(r), a = s * Math.cos(f * Math.PI / 180), u = s * Math.sin(f * Math.PI / 180), b = n + 0.3963377774 * a + 0.2158037573 * u, h = n - 0.1055613458 * a - 0.0638541728 * u, d = n - 0.0894841775 * a - 1.291485548 * u, x = b * b * b, m = h * h * h, p = d * d * d, T = 4.0767416621 * x - 3.3077115913 * m + 0.2309699292 * p, N = -1.2684380046 * x + 2.6097574011 * m - 0.3413193965 * p, M = -0.0041960863 * x - 0.7034186147 * m + 1.707614701 * p, I = (v) => v >= 31308e-7 ? 1.055 * v ** (1 / 2.4) - 0.055 : 12.92 * v, R = Math.max(0, Math.min(1, I(T))), X = Math.max(0, Math.min(1, I(N))), $ = Math.max(0, Math.min(1, I(M))), A = (v) => {
-    var P;
-    const z = (P = Math.round(v * 255).toString(16)) == null ? void 0 : P.toUpperCase();
+  const [, e, i, r] = o, n = parseFloat(e), s = parseFloat(i), f = parseFloat(r), a = s * Math.cos(f * Math.PI / 180), u = s * Math.sin(f * Math.PI / 180), b = n + 0.3963377774 * a + 0.2158037573 * u, h = n - 0.1055613458 * a - 0.0638541728 * u, d = n - 0.0894841775 * a - 1.291485548 * u, x = b * b * b, m = h * h * h, p = d * d * d, T = 4.0767416621 * x - 3.3077115913 * m + 0.2309699292 * p, F = -1.2684380046 * x + 2.6097574011 * m - 0.3413193965 * p, M = -0.0041960863 * x - 0.7034186147 * m + 1.707614701 * p, R = (g) => g >= 31308e-7 ? 1.055 * g ** (1 / 2.4) - 0.055 : 12.92 * g, B = Math.max(0, Math.min(1, R(T))), D = Math.max(0, Math.min(1, R(F))), I = Math.max(0, Math.min(1, R(M))), $ = (g) => {
+    var O;
+    const z = (O = Math.round(g * 255).toString(16)) == null ? void 0 : O.toUpperCase();
     return z.length === 1 ? `0${z}` : z;
   };
-  return `#${A(R)}${A(X)}${A($)}`;
+  return `#${$(B)}${$(D)}${$(I)}`;
 }
 function si(t) {
   const o = {}, e = {}, i = t.split(`
@@ -1494,10 +1494,10 @@ function hi(t) {
   }), o;
 }
 function di({ animatedProps: t, animationConfig: o, children: e }) {
-  const [i, r] = G(
+  const [i, r] = Y(
     () => hi(t)
   );
-  Z(() => {
+  q(() => {
     const a = [];
     return t.forEach((u, b) => {
       const h = (d) => {
@@ -3425,7 +3425,7 @@ class no {
     return this.parentBuilder;
   }
 }
-function $i({
+function Ii({
   preset: t = "fadeUp",
   once: o = !0,
   rootMargin: e = "0px 0px -8% 0px",
@@ -3435,7 +3435,7 @@ function $i({
   children: s
 }) {
   const f = U(null);
-  Z(() => {
+  q(() => {
     fo();
     const u = f.current;
     if (!u) return;
@@ -3486,13 +3486,13 @@ function fs(t) {
 function as() {
   return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "view()");
 }
-function Ni() {
+function $i() {
   return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "scroll()");
 }
-function Ii({ children: t }) {
+function Fi({ children: t }) {
   const o = U(null);
-  return Z(() => {
-    if (fo(), Ni()) return;
+  return q(() => {
+    if (fo(), $i()) return;
     const e = () => {
       var n, s;
       return ((n = o.current) == null ? void 0 : n.querySelector(".fibo-scroll-progress")) ?? ((s = o.current) == null ? void 0 : s.firstElementChild);
@@ -3511,7 +3511,7 @@ function Ii({ children: t }) {
     t
   );
 }
-function Fi({
+function Ri({
   signal: t,
   builder: o,
   loading: e,
@@ -3528,7 +3528,7 @@ function Fi({
   ), n = r == null ? void 0 : r.error;
   return n && i ? i(n) : ((r == null ? void 0 : r.isLoading) || (r == null ? void 0 : r.loading)) === !0 && e ? e() : o ? o(r) : null;
 }
-const Ri = Fe(Fi), Bi = {
+const Ni = Re(Ri), Bi = {
   name: "material",
   colors: {
     primary: "#6750A4",
@@ -3994,6 +3994,11 @@ class ao {
     c(this, "_explicitScrollMargin", !1);
     /** Shrink-wrap: skip the default `w-full` / `self-stretch` on Row and Column. */
     c(this, "_hug", !1);
+    /**
+     * Drop the built-in chrome (padding, border, fill, radius, shadow, fixed height, type size).
+     * Layout (flex, width, gap) stays. Chain `.style()`, `.px()`, `.border()` after this to put back only what you want.
+     */
+    c(this, "_resetStyle", !1);
     // Transition properties
     c(this, "_transitionDuration", 200);
     // ms
@@ -4003,6 +4008,12 @@ class ao {
     c(this, "_transitionProperties", ["all"]);
     c(this, "_childFunction");
   }
+  resetStyle() {
+    return this._resetStyle = !0, this.addClassName("fibo-reset"), this;
+  }
+  isReset() {
+    return this._resetStyle;
+  }
   hug() {
     return this._hug = !0, this;
   }
@@ -4060,11 +4071,36 @@ class ao {
     const e = typeof o == "number" ? `${o}px` : o, i = E.register("margin-top", e), r = E.register("margin-bottom", e);
     return this._classNames.push(i, r), this;
   }
+  /** Inline layout wins over a host that hardcodes flex on the element (Form, Scaffold). */
+  layoutStyle(o) {
+    return this._style = { ...this._style, ...o }, this;
+  }
   flexDirection(o) {
-    return this._classNames.push(`flex-${o}`), this;
+    return this.layoutStyle({ flexDirection: o });
   }
   alignItems(o) {
-    return this._classNames.push(`items-${o}`), this;
+    const e = {
+      start: "flex-start",
+      center: "center",
+      end: "flex-end",
+      stretch: "stretch",
+      baseline: "baseline"
+    };
+    return this.layoutStyle({ alignItems: e[o] });
+  }
+  alignSelf(o) {
+    const e = {
+      auto: "auto",
+      start: "flex-start",
+      center: "center",
+      end: "flex-end",
+      stretch: "stretch",
+      baseline: "baseline"
+    };
+    return this.layoutStyle({ alignSelf: e[o] });
+  }
+  flexWrap(o) {
+    return this.layoutStyle({ flexWrap: o });
   }
   /**
    * Main-axis distribution. Accepts Tailwind shortcuts (`between`) and CSS/Flutter
@@ -4072,73 +4108,78 @@ class ao {
    */
   justifyContent(o) {
     const e = {
-      start: "justify-start",
-      center: "justify-center",
-      end: "justify-end",
-      between: "justify-between",
-      around: "justify-around",
-      evenly: "justify-evenly",
-      "space-between": "justify-between",
-      "space-around": "justify-around",
-      "space-evenly": "justify-evenly",
-      spaceBetween: "justify-between",
-      spaceAround: "justify-around",
-      spaceEvenly: "justify-evenly"
+      start: "flex-start",
+      center: "center",
+      end: "flex-end",
+      between: "space-between",
+      around: "space-around",
+      evenly: "space-evenly",
+      "space-between": "space-between",
+      "space-around": "space-around",
+      "space-evenly": "space-evenly",
+      spaceBetween: "space-between",
+      spaceAround: "space-around",
+      spaceEvenly: "space-evenly"
     };
-    return this._classNames.push(e[o] ?? `justify-${o}`), this;
+    return this.layoutStyle({ justifyContent: e[o] ?? o });
   }
   flex(o) {
-    if (this._classNames.push("flex"), o !== void 0)
-      if (typeof o == "number") {
-        const e = E.register("flex", String(o));
-        this._classNames.push(e);
-      } else typeof o == "string" && this._classNames.push(`flex-${o}`);
-    return this;
+    const i = o === void 0 ? void 0 : typeof o == "number" ? String(o) : {
+      1: "1 1 0%",
+      auto: "1 1 auto",
+      initial: "0 1 auto",
+      none: "none"
+    }[o] ?? o;
+    return this.layoutStyle({ display: "flex", ...i !== void 0 ? { flex: i } : {} });
   }
   grid() {
-    return this._classNames.push("grid"), this;
+    return this.layoutStyle({ display: "grid" });
   }
   inlineFlex() {
-    return this._classNames.push("inline-flex"), this;
+    return this.layoutStyle({ display: "inline-flex" });
   }
   inlineGrid() {
-    return this._classNames.push("inline-grid"), this;
+    return this.layoutStyle({ display: "inline-grid" });
   }
   block() {
-    return this._classNames.push("block"), this;
+    return this.layoutStyle({ display: "block" });
   }
   inlineBlock() {
-    return this._classNames.push("inline-block"), this;
+    return this.layoutStyle({ display: "inline-block" });
   }
   hidden() {
-    return this._classNames.push("hidden"), this;
+    return this.layoutStyle({ display: "none" });
   }
   center() {
-    return this._classNames.push("flex", "items-center", "justify-center"), this;
+    return this.layoutStyle({
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center"
+    });
   }
   centerX() {
-    return this._classNames.push("flex", "justify-center"), this;
+    return this.layoutStyle({ display: "flex", justifyContent: "center" });
   }
   centerY() {
-    return this._classNames.push("flex", "items-center"), this;
+    return this.layoutStyle({ display: "flex", alignItems: "center" });
   }
   spaceBetween() {
-    return this._classNames.push("justify-between"), this;
+    return this.layoutStyle({ justifyContent: "space-between" });
   }
   spaceAround() {
-    return this._classNames.push("justify-around"), this;
+    return this.layoutStyle({ justifyContent: "space-around" });
   }
   spaceEvenly() {
-    return this._classNames.push("justify-evenly"), this;
+    return this.layoutStyle({ justifyContent: "space-evenly" });
   }
   fill() {
-    return this._classNames.push("w-full", "h-full"), this;
+    return this.layoutStyle({ width: "100%", height: "100%" });
   }
   fillWidth() {
-    return this._classNames.push("w-full"), this;
+    return this.layoutStyle({ width: "100%" });
   }
   fillHeight() {
-    return this._classNames.push("h-full"), this;
+    return this.layoutStyle({ height: "100%" });
   }
   square(o) {
     const e = typeof o == "number" ? `${o}px` : o, i = E.register("width", e), r = E.register("height", e);
@@ -4409,16 +4450,10 @@ class ao {
     return this;
   }
   gap(o) {
-    if (typeof o == "number") {
-      const e = E.register("gap", `${o}px`);
-      this._classNames.push(e);
-    } else if (typeof o == "string" && o.startsWith("gap-"))
-      this._classNames.push(o);
-    else {
-      const e = E.register("gap", o);
-      this._classNames.push(e);
-    }
-    return this;
+    if (typeof o == "string" && o.startsWith("gap-"))
+      return this._classNames.push(o), this;
+    const e = typeof o == "number" ? `${o}px` : o;
+    return this.layoutStyle({ gap: e });
   }
   clean() {
     return this._classNames.push(
@@ -4924,14 +4959,14 @@ const ji = /* @__PURE__ */ new Set([
   "_debugTask",
   "_debugInfo"
 ]);
-function Xi(t) {
+function Di(t) {
   var e;
   const o = (e = t._props) == null ? void 0 : e.key;
   if (!(o == null || o === ""))
     return o;
 }
-function Di(t) {
-  const o = t._isObserver, e = t._signals, i = t._observers, r = t._state, n = t._providers, s = Xi(t), f = () => {
+function Xi(t) {
+  const o = t._isObserver, e = t._signals, i = t._observers, r = t._state, n = t._providers, s = Di(t), f = () => {
     let d = t.build();
     const x = t._animatedProps, m = t._animationConfig;
     x && x.size > 0 && (d = l.createElement(di, {
@@ -4942,10 +4977,10 @@ function Di(t) {
     }));
     const p = t._reveal;
     if (p) {
-      const N = t._style || {}, M = {};
-      for (const I of ["--fibo-dur", "--fibo-ease", "--fibo-delay", "--fibo-stagger", "--fibo-from"])
-        N[I] != null && (M[I] = N[I]);
-      d = l.createElement($i, {
+      const F = t._style || {}, M = {};
+      for (const R of ["--fibo-dur", "--fibo-ease", "--fibo-delay", "--fibo-stagger", "--fibo-from"])
+        F[R] != null && (M[R] = F[R]);
+      d = l.createElement(Ii, {
         key: s,
         preset: p.preset,
         once: p.once,
@@ -4956,7 +4991,7 @@ function Di(t) {
         children: d
       });
     }
-    t._scrollProgress && (d = l.createElement(Ii, { key: s, children: d })), t._usesCssMotion && (d = l.createElement(
+    t._scrollProgress && (d = l.createElement(Fi, { key: s, children: d })), t._usesCssMotion && (d = l.createElement(
       l.Fragment,
       { key: s },
       l.createElement(ei),
@@ -4969,7 +5004,7 @@ function Di(t) {
     children: f
   }) : null, b = () => u ?? f();
   let h = b();
-  return a && e && e.size > 0 ? h = l.createElement(Xt, {
+  return a && e && e.size > 0 ? h = l.createElement(Dt, {
     key: s,
     signals: e,
     children: b
@@ -4981,7 +5016,7 @@ function Di(t) {
     key: s,
     stateMap: r,
     children: h
-  })), a && n && n.size > 0 && (h = l.createElement(Dt, {
+  })), a && n && n.size > 0 && (h = l.createElement(Xt, {
     key: s,
     providers: n,
     children: h
@@ -5006,7 +5041,7 @@ function st(t, o, e) {
 }
 function co(t) {
   return (...o) => {
-    const e = new t(...o), i = t.name.replace(/Builder$/, "") || "Fibo", r = () => Di(e);
+    const e = new t(...o), i = t.name.replace(/Builder$/, "") || "Fibo", r = () => Xi(e);
     return st(e, r, i), new Proxy(e, {
       get(n, s, f) {
         var a, u;
@@ -5065,7 +5100,7 @@ class Yi {
     return this._builder = o, this;
   }
   build() {
-    return l.createElement(Ri, {
+    return l.createElement(Ni, {
       signal: this._signal,
       builder: this._builder,
       loading: this._loading,
@@ -5099,8 +5134,8 @@ function Zi(t) {
   return Oo(t) ? !!t.value : !!t;
 }
 function Ji(t) {
-  const [o, e] = G(() => Zi(t));
-  return Z(() => {
+  const [o, e] = Y(() => Zi(t));
+  return q(() => {
     if (!Oo(t)) {
       e(!!t);
       return;
@@ -5116,8 +5151,8 @@ function ft({
   reducedMotion: r = "reduce",
   children: n
 }) {
-  const s = Ji(t), [f, a] = G(s), [u, b] = G(s ? "enter" : "idle"), h = r !== "never" && qi();
-  if (Z(() => {
+  const s = Ji(t), [f, a] = Y(s), [u, b] = Y(s ? "enter" : "idle"), h = r !== "never" && qi();
+  if (q(() => {
     if (fo(), s) {
       a(!0), b(h ? "idle" : "enter");
       return;
@@ -5200,7 +5235,7 @@ function hs({
   className: e,
   style: i
 }) {
-  const r = rr(t), [n, s] = G(r), [f, a] = G(null);
+  const r = rr(t), [n, s] = Y(r), [f, a] = Y(null);
   r !== n && (s(r), a(null));
   const u = et(f ?? t), b = ro((m) => {
     a(m);
@@ -5218,10 +5253,10 @@ function hs({
     fontFamily: u.fontFamily,
     ...i
   };
-  return /* @__PURE__ */ W(at.Provider, { value: h, children: /* @__PURE__ */ W("div", { className: d, "data-fibo-theme": u.name, style: x, children: o }) });
+  return /* @__PURE__ */ H(at.Provider, { value: h, children: /* @__PURE__ */ H("div", { className: d, "data-fibo-theme": u.name, style: x, children: o }) });
 }
 function ds() {
-  const t = Fo(at);
+  const t = Ro(at);
   if (!t)
     throw new Error("useFiboTheme must be used within a FiboThemeProvider");
   return t;
@@ -5375,7 +5410,7 @@ class fr extends ao {
     };
     if (typeof this._text == "function") {
       const r = this._text;
-      return l.createElement(De, {
+      return l.createElement(Xe, {
         compute: r,
         as: e[this._type],
         className: `fibo-text fibo-text-${this._type} min-w-0 ${this.getClassName()}`,
@@ -5395,13 +5430,13 @@ class fr extends ao {
 }
 const ar = co(fr), fe = yo(null);
 function Go() {
-  const t = Fo(fe);
+  const t = Ro(fe);
   if (!t)
     throw new Error("useRouter must be used within a Router");
   return t;
 }
 function ps() {
-  return Fo(fe);
+  return Ro(fe);
 }
 function xs() {
   const { navigate: t } = Go();
@@ -5425,7 +5460,7 @@ function vs() {
   };
 }
 const cr = l.memo((t) => {
-  const { sidebar: o, header: e, children: i, className: r, style: n, ...s } = t, [f, a] = G(!1);
+  const { sidebar: o, header: e, children: i, className: r, style: n, ...s } = t, [f, a] = Y(!1);
   return l.createElement(
     "div",
     {
@@ -5510,7 +5545,7 @@ const ws = co(lr), ur = l.memo((t) => {
     containerHeight: s = 500,
     className: f,
     style: a
-  } = t, [u, b] = G(0), h = U(null), d = U(/* @__PURE__ */ new Map()), x = U(/* @__PURE__ */ new Map()), m = o.length, p = e !== void 0, T = (S) => p ? e : x.current.get(S) ?? i, N = (S) => {
+  } = t, [u, b] = Y(0), h = U(null), d = U(/* @__PURE__ */ new Map()), x = U(/* @__PURE__ */ new Map()), m = o.length, p = e !== void 0, T = (S) => p ? e : x.current.get(S) ?? i, F = (S) => {
     if (p)
       return S * e;
     let C = 0;
@@ -5524,39 +5559,39 @@ const ws = co(lr), ur = l.memo((t) => {
     for (let C = 0; C < m; C++)
       S += T(C);
     return S;
-  }, R = Math.max(0, ((S) => {
+  }, B = Math.max(0, ((S) => {
     if (p)
       return Math.floor(S / e);
     let C = 0, V = m - 1;
     for (; C < V; ) {
       const y = Math.floor((C + V) / 2);
-      N(y) < S ? C = y + 1 : V = y;
+      F(y) < S ? C = y + 1 : V = y;
     }
     return Math.max(0, C - 1);
   })(u) - n);
-  let X;
+  let D;
   if (p) {
     const S = Math.ceil(s / e);
-    X = Math.min(m, R + S + n * 2);
+    D = Math.min(m, B + S + n * 2);
   } else {
-    let S = N(R), C = R;
+    let S = F(B), C = B;
     for (; S < u + s + n * i && C < m; )
       S += T(C), C++;
-    X = Math.min(m, C);
+    D = Math.min(m, C);
   }
-  const $ = o.slice(R, X), A = N(R), v = M(), [z, P] = G(0);
+  const I = o.slice(B, D), $ = F(B), g = M(), [z, O] = Y(0);
   oe(() => {
     if (!r || p) return;
     let S = !1;
-    $.forEach((C, V) => {
-      const y = R + V, F = d.current.get(y);
-      if (F) {
-        const g = F.getBoundingClientRect().height;
-        g > 0 && x.current.get(y) !== g && (x.current.set(y, g), S = !0);
+    I.forEach((C, V) => {
+      const y = B + V, N = d.current.get(y);
+      if (N) {
+        const w = N.getBoundingClientRect().height;
+        w > 0 && x.current.get(y) !== w && (x.current.set(y, w), S = !0);
       }
-    }), S && P((C) => C + 1);
-  }, [$, R, r, p, z]);
-  const D = (S) => {
+    }), S && O((C) => C + 1);
+  }, [I, B, r, p, z]);
+  const W = (S) => {
     b(S.currentTarget.scrollTop);
   };
   return l.createElement(
@@ -5570,11 +5605,11 @@ const ws = co(lr), ur = l.memo((t) => {
         position: "relative",
         ...a
       },
-      onScroll: D
+      onScroll: W
     },
     l.createElement("div", {
       style: {
-        height: `${v}px`,
+        height: `${g}px`,
         width: "1px",
         position: "absolute",
         top: 0,
@@ -5587,12 +5622,12 @@ const ws = co(lr), ur = l.memo((t) => {
       "div",
       {
         style: {
-          transform: `translateY(${A}px)`,
+          transform: `translateY(${$}px)`,
           width: "100%"
         }
       },
-      $.map((S, C) => {
-        const V = R + C;
+      I.map((S, C) => {
+        const V = B + C;
         return l.createElement(
           "div",
           {
@@ -5673,7 +5708,7 @@ class dr extends ao {
     return l.createElement(hr, n);
   }
 }
-const $o = co(dr), pr = (t, o) => {
+const Io = co(dr), pr = (t, o) => {
   const e = new Array(t.length + o.length);
   for (let i = 0; i < t.length; i++)
     e[i] = t[i];
@@ -5687,7 +5722,7 @@ const $o = co(dr), pr = (t, o) => {
   nextPart: t,
   validators: o,
   classGroupId: e
-}), Xo = "-", ke = [], mr = "arbitrary..", gr = (t) => {
+}), Do = "-", ke = [], mr = "arbitrary..", gr = (t) => {
   const o = wr(t), {
     conflictingClassGroups: e,
     conflictingClassGroupModifiers: i
@@ -5696,7 +5731,7 @@ const $o = co(dr), pr = (t, o) => {
     getClassGroupId: (s) => {
       if (s.startsWith("[") && s.endsWith("]"))
         return vr(s);
-      const f = s.split(Xo), a = f[0] === "" && f.length > 1 ? 1 : 0;
+      const f = s.split(Do), a = f[0] === "" && f.length > 1 ? 1 : 0;
       return ut(f, a, o);
     },
     getConflictingClassGroupIds: (s, f) => {
@@ -5718,7 +5753,7 @@ const $o = co(dr), pr = (t, o) => {
   const s = e.validators;
   if (s === null)
     return;
-  const f = o === 0 ? t.join(Xo) : t.slice(o).join(Xo), a = s.length;
+  const f = o === 0 ? t.join(Do) : t.slice(o).join(Do), a = s.length;
   for (let u = 0; u < a; u++) {
     const b = s[u];
     if (b.validator(f))
@@ -5773,7 +5808,7 @@ const $o = co(dr), pr = (t, o) => {
   }
 }, bt = (t, o) => {
   let e = t;
-  const i = o.split(Xo), r = i.length;
+  const i = o.split(Do), r = i.length;
   for (let n = 0; n < r; n++) {
     const s = i[n];
     let f = e.nextPart.get(s);
@@ -5810,7 +5845,7 @@ const $o = co(dr), pr = (t, o) => {
   baseClassName: e,
   maybePostfixModifierPosition: i,
   isExternal: r
-}), $r = (t) => {
+}), Ir = (t) => {
   const {
     prefix: o,
     experimentalParseClassName: e
@@ -5857,7 +5892,7 @@ const $o = co(dr), pr = (t, o) => {
     });
   }
   return i;
-}, Nr = (t) => {
+}, $r = (t) => {
   const o = /* @__PURE__ */ new Map();
   return t.orderSensitiveModifiers.forEach((e, i) => {
     o.set(e, 1e6 + i);
@@ -5870,18 +5905,18 @@ const $o = co(dr), pr = (t, o) => {
     }
     return r.length > 0 && (r.sort(), i.push(...r)), i;
   };
-}, Ir = (t) => ({
+}, Fr = (t) => ({
   cache: Er(t.cacheSize),
-  parseClassName: $r(t),
-  sortModifiers: Nr(t),
+  parseClassName: Ir(t),
+  sortModifiers: $r(t),
   ...gr(t)
-}), Fr = /\s+/, Rr = (t, o) => {
+}), Rr = /\s+/, Nr = (t, o) => {
   const {
     parseClassName: e,
     getClassGroupId: i,
     getConflictingClassGroupIds: r,
     sortModifiers: n
-  } = o, s = [], f = t.trim().split(Fr);
+  } = o, s = [], f = t.trim().split(Rr);
   let a = "";
   for (let u = f.length - 1; u >= 0; u -= 1) {
     const b = f[u], {
@@ -5895,26 +5930,26 @@ const $o = co(dr), pr = (t, o) => {
       a = b + (a.length > 0 ? " " + a : a);
       continue;
     }
-    let T = !!p, N = i(T ? m.substring(0, p) : m);
-    if (!N) {
+    let T = !!p, F = i(T ? m.substring(0, p) : m);
+    if (!F) {
       if (!T) {
         a = b + (a.length > 0 ? " " + a : a);
         continue;
       }
-      if (N = i(m), !N) {
+      if (F = i(m), !F) {
         a = b + (a.length > 0 ? " " + a : a);
         continue;
       }
       T = !1;
     }
-    const M = d.length === 0 ? "" : d.length === 1 ? d[0] : n(d).join(":"), I = x ? M + te : M, R = I + N;
-    if (s.indexOf(R) > -1)
+    const M = d.length === 0 ? "" : d.length === 1 ? d[0] : n(d).join(":"), R = x ? M + te : M, B = R + F;
+    if (s.indexOf(B) > -1)
       continue;
-    s.push(R);
-    const X = r(N, T);
-    for (let $ = 0; $ < X.length; ++$) {
-      const A = X[$];
-      s.push(I + A);
+    s.push(B);
+    const D = r(F, T);
+    for (let I = 0; I < D.length; ++I) {
+      const $ = D[I];
+      s.push(R + $);
     }
     a = b + (a.length > 0 ? " " + a : a);
   }
@@ -5935,31 +5970,31 @@ const $o = co(dr), pr = (t, o) => {
   let e, i, r, n;
   const s = (a) => {
     const u = o.reduce((b, h) => h(b), t());
-    return e = Ir(u), i = e.cache.get, r = e.cache.set, n = f, f(a);
+    return e = Fr(u), i = e.cache.get, r = e.cache.set, n = f, f(a);
   }, f = (a) => {
     const u = i(a);
     if (u)
       return u;
-    const b = Rr(a, e);
+    const b = Nr(a, e);
     return r(a, b), b;
   };
   return n = s, (...a) => n(Br(...a));
 }, Lr = [], oo = (t) => {
   const o = (e) => e[t] || Lr;
   return o.isThemeGetter = !0, o;
-}, dt = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, pt = /^\((?:(\w[\w-]*):)?(.+)\)$/i, Pr = /^\d+\/\d+$/, Mr = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Or = /\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$/, Wr = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Hr = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Vr = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, Eo = (t) => Pr.test(t), B = (t) => !!t && !Number.isNaN(Number(t)), xo = (t) => !!t && Number.isInteger(Number(t)), qo = (t) => t.endsWith("%") && B(t.slice(0, -1)), ho = (t) => Mr.test(t), jr = () => !0, Xr = (t) => (
+}, dt = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, pt = /^\((?:(\w[\w-]*):)?(.+)\)$/i, Pr = /^\d+\/\d+$/, Mr = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Or = /\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$/, Wr = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Hr = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Vr = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, Eo = (t) => Pr.test(t), L = (t) => !!t && !Number.isNaN(Number(t)), xo = (t) => !!t && Number.isInteger(Number(t)), qo = (t) => t.endsWith("%") && L(t.slice(0, -1)), ho = (t) => Mr.test(t), jr = () => !0, Dr = (t) => (
   // `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.
   Or.test(t) && !Wr.test(t)
-), xt = () => !1, Dr = (t) => Hr.test(t), Yr = (t) => Vr.test(t), Gr = (t) => !k(t) && !_(t), Ur = (t) => Ro(t, vt, xt), k = (t) => dt.test(t), vo = (t) => Ro(t, wt, Xr), Zo = (t) => Ro(t, Qr, B), Ce = (t) => Ro(t, mt, xt), Kr = (t) => Ro(t, gt, Yr), Wo = (t) => Ro(t, yt, Dr), _ = (t) => pt.test(t), Lo = (t) => Bo(t, wt), qr = (t) => Bo(t, on), ze = (t) => Bo(t, mt), Zr = (t) => Bo(t, vt), Jr = (t) => Bo(t, gt), Ho = (t) => Bo(t, yt, !0), Ro = (t, o, e) => {
+), xt = () => !1, Xr = (t) => Hr.test(t), Yr = (t) => Vr.test(t), Gr = (t) => !k(t) && !_(t), Ur = (t) => No(t, vt, xt), k = (t) => dt.test(t), vo = (t) => No(t, wt, Dr), Zo = (t) => No(t, Qr, L), Ce = (t) => No(t, mt, xt), Kr = (t) => No(t, gt, Yr), Wo = (t) => No(t, yt, Xr), _ = (t) => pt.test(t), Lo = (t) => Bo(t, wt), qr = (t) => Bo(t, on), ze = (t) => Bo(t, mt), Zr = (t) => Bo(t, vt), Jr = (t) => Bo(t, gt), Ho = (t) => Bo(t, yt, !0), No = (t, o, e) => {
   const i = dt.exec(t);
   return i ? i[1] ? o(i[1]) : e(i[2]) : !1;
 }, Bo = (t, o, e = !1) => {
   const i = pt.exec(t);
   return i ? i[1] ? o(i[1]) : e : !1;
 }, mt = (t) => t === "position" || t === "percentage", gt = (t) => t === "image" || t === "url", vt = (t) => t === "length" || t === "size" || t === "bg-size", wt = (t) => t === "length", Qr = (t) => t === "number", on = (t) => t === "family-name", yt = (t) => t === "shadow", en = () => {
-  const t = oo("color"), o = oo("font"), e = oo("text"), i = oo("font-weight"), r = oo("tracking"), n = oo("leading"), s = oo("breakpoint"), f = oo("container"), a = oo("spacing"), u = oo("radius"), b = oo("shadow"), h = oo("inset-shadow"), d = oo("text-shadow"), x = oo("drop-shadow"), m = oo("blur"), p = oo("perspective"), T = oo("aspect"), N = oo("ease"), M = oo("animate"), I = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], R = () => [
+  const t = oo("color"), o = oo("font"), e = oo("text"), i = oo("font-weight"), r = oo("tracking"), n = oo("leading"), s = oo("breakpoint"), f = oo("container"), a = oo("spacing"), u = oo("radius"), b = oo("shadow"), h = oo("inset-shadow"), d = oo("text-shadow"), x = oo("drop-shadow"), m = oo("blur"), p = oo("perspective"), T = oo("aspect"), F = oo("ease"), M = oo("animate"), R = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], B = () => [
     "center",
     "top",
     "bottom",
@@ -5977,15 +6012,15 @@ const $o = co(dr), pr = (t, o) => {
     "bottom-left",
     // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
     "left-bottom"
-  ], X = () => [...R(), _, k], $ = () => ["auto", "hidden", "clip", "visible", "scroll"], A = () => ["auto", "contain", "none"], v = () => [_, k, a], z = () => [Eo, "full", "auto", ...v()], P = () => [xo, "none", "subgrid", _, k], D = () => ["auto", {
+  ], D = () => [...B(), _, k], I = () => ["auto", "hidden", "clip", "visible", "scroll"], $ = () => ["auto", "contain", "none"], g = () => [_, k, a], z = () => [Eo, "full", "auto", ...g()], O = () => [xo, "none", "subgrid", _, k], W = () => ["auto", {
     span: ["full", xo, _, k]
-  }, xo, _, k], S = () => [xo, "auto", _, k], C = () => ["auto", "min", "max", "fr", _, k], V = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], y = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], F = () => ["auto", ...v()], H = () => [Eo, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...v()], g = () => [t, _, k], K = () => [...R(), ze, Ce, {
+  }, xo, _, k], S = () => [xo, "auto", _, k], C = () => ["auto", "min", "max", "fr", _, k], V = () => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], y = () => ["start", "end", "center", "stretch", "center-safe", "end-safe"], N = () => ["auto", ...g()], G = () => [Eo, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...g()], w = () => [t, _, k], Z = () => [...B(), ze, Ce, {
     position: [_, k]
-  }], w = () => ["no-repeat", {
+  }], v = () => ["no-repeat", {
     repeat: ["", "x", "y", "space", "round"]
-  }], O = () => ["auto", "cover", "contain", Zr, Ur, {
+  }], A = () => ["auto", "cover", "contain", Zr, Ur, {
     size: [_, k]
-  }], q = () => [qo, Lo, vo], Y = () => [
+  }], K = () => [qo, Lo, vo], X = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
@@ -5993,14 +6028,14 @@ const $o = co(dr), pr = (t, o) => {
     u,
     _,
     k
-  ], to = () => ["", B, Lo, vo], ko = () => ["solid", "dashed", "dotted", "double"], Ao = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], J = () => [B, qo, ze, Ce], _o = () => [
+  ], to = () => ["", L, Lo, vo], ko = () => ["solid", "dashed", "dotted", "double"], Ao = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], J = () => [L, qo, ze, Ce], _o = () => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
     m,
     _,
     k
-  ], go = () => ["none", B, _, k], io = () => ["none", B, _, k], So = () => [B, _, k], L = () => [Eo, "full", ...v()];
+  ], go = () => ["none", L, _, k], io = () => ["none", L, _, k], So = () => [L, _, k], P = () => [Eo, "full", ...g()];
   return {
     cacheSize: 500,
     theme: {
@@ -6019,7 +6054,7 @@ const $o = co(dr), pr = (t, o) => {
       perspective: ["dramatic", "near", "normal", "midrange", "distant", "none"],
       radius: [ho],
       shadow: [ho],
-      spacing: ["px", B],
+      spacing: ["px", L],
       text: [ho],
       "text-shadow": [ho],
       tracking: ["tighter", "tight", "normal", "wide", "wider", "widest"]
@@ -6046,21 +6081,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/columns
        */
       columns: [{
-        columns: [B, k, _, f]
+        columns: [L, k, _, f]
       }],
       /**
        * Break After
        * @see https://tailwindcss.com/docs/break-after
        */
       "break-after": [{
-        "break-after": I()
+        "break-after": R()
       }],
       /**
        * Break Before
        * @see https://tailwindcss.com/docs/break-before
        */
       "break-before": [{
-        "break-before": I()
+        "break-before": R()
       }],
       /**
        * Break Inside
@@ -6124,49 +6159,49 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/object-position
        */
       "object-position": [{
-        object: X()
+        object: D()
       }],
       /**
        * Overflow
        * @see https://tailwindcss.com/docs/overflow
        */
       overflow: [{
-        overflow: $()
+        overflow: I()
       }],
       /**
        * Overflow X
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-x": [{
-        "overflow-x": $()
+        "overflow-x": I()
       }],
       /**
        * Overflow Y
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-y": [{
-        "overflow-y": $()
+        "overflow-y": I()
       }],
       /**
        * Overscroll Behavior
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       overscroll: [{
-        overscroll: A()
+        overscroll: $()
       }],
       /**
        * Overscroll Behavior X
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-x": [{
-        "overscroll-x": A()
+        "overscroll-x": $()
       }],
       /**
        * Overscroll Behavior Y
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-y": [{
-        "overscroll-y": A()
+        "overscroll-y": $()
       }],
       /**
        * Position
@@ -6256,7 +6291,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/flex-basis
        */
       basis: [{
-        basis: [Eo, "full", "auto", f, ...v()]
+        basis: [Eo, "full", "auto", f, ...g()]
       }],
       /**
        * Flex Direction
@@ -6277,21 +6312,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/flex
        */
       flex: [{
-        flex: [B, Eo, "auto", "initial", "none", k]
+        flex: [L, Eo, "auto", "initial", "none", k]
       }],
       /**
        * Flex Grow
        * @see https://tailwindcss.com/docs/flex-grow
        */
       grow: [{
-        grow: ["", B, _, k]
+        grow: ["", L, _, k]
       }],
       /**
        * Flex Shrink
        * @see https://tailwindcss.com/docs/flex-shrink
        */
       shrink: [{
-        shrink: ["", B, _, k]
+        shrink: ["", L, _, k]
       }],
       /**
        * Order
@@ -6305,14 +6340,14 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/grid-template-columns
        */
       "grid-cols": [{
-        "grid-cols": P()
+        "grid-cols": O()
       }],
       /**
        * Grid Column Start / End
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-start-end": [{
-        col: D()
+        col: W()
       }],
       /**
        * Grid Column Start
@@ -6333,14 +6368,14 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/grid-template-rows
        */
       "grid-rows": [{
-        "grid-rows": P()
+        "grid-rows": O()
       }],
       /**
        * Grid Row Start / End
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-start-end": [{
-        row: D()
+        row: W()
       }],
       /**
        * Grid Row Start
@@ -6382,21 +6417,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/gap
        */
       gap: [{
-        gap: v()
+        gap: g()
       }],
       /**
        * Gap X
        * @see https://tailwindcss.com/docs/gap
        */
       "gap-x": [{
-        "gap-x": v()
+        "gap-x": g()
       }],
       /**
        * Gap Y
        * @see https://tailwindcss.com/docs/gap
        */
       "gap-y": [{
-        "gap-y": v()
+        "gap-y": g()
       }],
       /**
        * Justify Content
@@ -6471,133 +6506,133 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/padding
        */
       p: [{
-        p: v()
+        p: g()
       }],
       /**
        * Padding X
        * @see https://tailwindcss.com/docs/padding
        */
       px: [{
-        px: v()
+        px: g()
       }],
       /**
        * Padding Y
        * @see https://tailwindcss.com/docs/padding
        */
       py: [{
-        py: v()
+        py: g()
       }],
       /**
        * Padding Start
        * @see https://tailwindcss.com/docs/padding
        */
       ps: [{
-        ps: v()
+        ps: g()
       }],
       /**
        * Padding End
        * @see https://tailwindcss.com/docs/padding
        */
       pe: [{
-        pe: v()
+        pe: g()
       }],
       /**
        * Padding Top
        * @see https://tailwindcss.com/docs/padding
        */
       pt: [{
-        pt: v()
+        pt: g()
       }],
       /**
        * Padding Right
        * @see https://tailwindcss.com/docs/padding
        */
       pr: [{
-        pr: v()
+        pr: g()
       }],
       /**
        * Padding Bottom
        * @see https://tailwindcss.com/docs/padding
        */
       pb: [{
-        pb: v()
+        pb: g()
       }],
       /**
        * Padding Left
        * @see https://tailwindcss.com/docs/padding
        */
       pl: [{
-        pl: v()
+        pl: g()
       }],
       /**
        * Margin
        * @see https://tailwindcss.com/docs/margin
        */
       m: [{
-        m: F()
+        m: N()
       }],
       /**
        * Margin X
        * @see https://tailwindcss.com/docs/margin
        */
       mx: [{
-        mx: F()
+        mx: N()
       }],
       /**
        * Margin Y
        * @see https://tailwindcss.com/docs/margin
        */
       my: [{
-        my: F()
+        my: N()
       }],
       /**
        * Margin Start
        * @see https://tailwindcss.com/docs/margin
        */
       ms: [{
-        ms: F()
+        ms: N()
       }],
       /**
        * Margin End
        * @see https://tailwindcss.com/docs/margin
        */
       me: [{
-        me: F()
+        me: N()
       }],
       /**
        * Margin Top
        * @see https://tailwindcss.com/docs/margin
        */
       mt: [{
-        mt: F()
+        mt: N()
       }],
       /**
        * Margin Right
        * @see https://tailwindcss.com/docs/margin
        */
       mr: [{
-        mr: F()
+        mr: N()
       }],
       /**
        * Margin Bottom
        * @see https://tailwindcss.com/docs/margin
        */
       mb: [{
-        mb: F()
+        mb: N()
       }],
       /**
        * Margin Left
        * @see https://tailwindcss.com/docs/margin
        */
       ml: [{
-        ml: F()
+        ml: N()
       }],
       /**
        * Space Between X
        * @see https://tailwindcss.com/docs/margin#adding-space-between-children
        */
       "space-x": [{
-        "space-x": v()
+        "space-x": g()
       }],
       /**
        * Space Between X Reverse
@@ -6609,7 +6644,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/margin#adding-space-between-children
        */
       "space-y": [{
-        "space-y": v()
+        "space-y": g()
       }],
       /**
        * Space Between Y Reverse
@@ -6624,14 +6659,14 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/width#setting-both-width-and-height
        */
       size: [{
-        size: H()
+        size: G()
       }],
       /**
        * Width
        * @see https://tailwindcss.com/docs/width
        */
       w: [{
-        w: [f, "screen", ...H()]
+        w: [f, "screen", ...G()]
       }],
       /**
        * Min-Width
@@ -6643,7 +6678,7 @@ const $o = co(dr), pr = (t, o) => {
           "screen",
           /** Deprecated. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
           "none",
-          ...H()
+          ...G()
         ]
       }],
       /**
@@ -6661,7 +6696,7 @@ const $o = co(dr), pr = (t, o) => {
           {
             screen: [s]
           },
-          ...H()
+          ...G()
         ]
       }],
       /**
@@ -6669,21 +6704,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/height
        */
       h: [{
-        h: ["screen", "lh", ...H()]
+        h: ["screen", "lh", ...G()]
       }],
       /**
        * Min-Height
        * @see https://tailwindcss.com/docs/min-height
        */
       "min-h": [{
-        "min-h": ["screen", "lh", "none", ...H()]
+        "min-h": ["screen", "lh", "none", ...G()]
       }],
       /**
        * Max-Height
        * @see https://tailwindcss.com/docs/max-height
        */
       "max-h": [{
-        "max-h": ["screen", "lh", ...H()]
+        "max-h": ["screen", "lh", ...G()]
       }],
       // ------------------
       // --- Typography ---
@@ -6768,7 +6803,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/line-clamp
        */
       "line-clamp": [{
-        "line-clamp": [B, "none", _, Zo]
+        "line-clamp": [L, "none", _, Zo]
       }],
       /**
        * Line Height
@@ -6778,7 +6813,7 @@ const $o = co(dr), pr = (t, o) => {
         leading: [
           /** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
           n,
-          ...v()
+          ...g()
         ]
       }],
       /**
@@ -6815,14 +6850,14 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://v3.tailwindcss.com/docs/placeholder-color
        */
       "placeholder-color": [{
-        placeholder: g()
+        placeholder: w()
       }],
       /**
        * Text Color
        * @see https://tailwindcss.com/docs/text-color
        */
       "text-color": [{
-        text: g()
+        text: w()
       }],
       /**
        * Text Decoration
@@ -6841,21 +6876,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/text-decoration-thickness
        */
       "text-decoration-thickness": [{
-        decoration: [B, "from-font", "auto", _, vo]
+        decoration: [L, "from-font", "auto", _, vo]
       }],
       /**
        * Text Decoration Color
        * @see https://tailwindcss.com/docs/text-decoration-color
        */
       "text-decoration-color": [{
-        decoration: g()
+        decoration: w()
       }],
       /**
        * Text Underline Offset
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": [B, "auto", _, k]
+        "underline-offset": [L, "auto", _, k]
       }],
       /**
        * Text Transform
@@ -6879,7 +6914,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/text-indent
        */
       indent: [{
-        indent: v()
+        indent: g()
       }],
       /**
        * Vertical Alignment
@@ -6952,21 +6987,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/background-position
        */
       "bg-position": [{
-        bg: K()
+        bg: Z()
       }],
       /**
        * Background Repeat
        * @see https://tailwindcss.com/docs/background-repeat
        */
       "bg-repeat": [{
-        bg: w()
+        bg: v()
       }],
       /**
        * Background Size
        * @see https://tailwindcss.com/docs/background-size
        */
       "bg-size": [{
-        bg: O()
+        bg: A()
       }],
       /**
        * Background Image
@@ -6986,49 +7021,49 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/background-color
        */
       "bg-color": [{
-        bg: g()
+        bg: w()
       }],
       /**
        * Gradient Color Stops From Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-from-pos": [{
-        from: q()
+        from: K()
       }],
       /**
        * Gradient Color Stops Via Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-via-pos": [{
-        via: q()
+        via: K()
       }],
       /**
        * Gradient Color Stops To Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-to-pos": [{
-        to: q()
+        to: K()
       }],
       /**
        * Gradient Color Stops From
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-from": [{
-        from: g()
+        from: w()
       }],
       /**
        * Gradient Color Stops Via
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-via": [{
-        via: g()
+        via: w()
       }],
       /**
        * Gradient Color Stops To
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-to": [{
-        to: g()
+        to: w()
       }],
       // ---------------
       // --- Borders ---
@@ -7038,105 +7073,105 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/border-radius
        */
       rounded: [{
-        rounded: Y()
+        rounded: X()
       }],
       /**
        * Border Radius Start
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-s": [{
-        "rounded-s": Y()
+        "rounded-s": X()
       }],
       /**
        * Border Radius End
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-e": [{
-        "rounded-e": Y()
+        "rounded-e": X()
       }],
       /**
        * Border Radius Top
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-t": [{
-        "rounded-t": Y()
+        "rounded-t": X()
       }],
       /**
        * Border Radius Right
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-r": [{
-        "rounded-r": Y()
+        "rounded-r": X()
       }],
       /**
        * Border Radius Bottom
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-b": [{
-        "rounded-b": Y()
+        "rounded-b": X()
       }],
       /**
        * Border Radius Left
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-l": [{
-        "rounded-l": Y()
+        "rounded-l": X()
       }],
       /**
        * Border Radius Start Start
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-ss": [{
-        "rounded-ss": Y()
+        "rounded-ss": X()
       }],
       /**
        * Border Radius Start End
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-se": [{
-        "rounded-se": Y()
+        "rounded-se": X()
       }],
       /**
        * Border Radius End End
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-ee": [{
-        "rounded-ee": Y()
+        "rounded-ee": X()
       }],
       /**
        * Border Radius End Start
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-es": [{
-        "rounded-es": Y()
+        "rounded-es": X()
       }],
       /**
        * Border Radius Top Left
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-tl": [{
-        "rounded-tl": Y()
+        "rounded-tl": X()
       }],
       /**
        * Border Radius Top Right
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-tr": [{
-        "rounded-tr": Y()
+        "rounded-tr": X()
       }],
       /**
        * Border Radius Bottom Right
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-br": [{
-        "rounded-br": Y()
+        "rounded-br": X()
       }],
       /**
        * Border Radius Bottom Left
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-bl": [{
-        "rounded-bl": Y()
+        "rounded-bl": X()
       }],
       /**
        * Border Width
@@ -7244,70 +7279,70 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color": [{
-        border: g()
+        border: w()
       }],
       /**
        * Border Color X
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-x": [{
-        "border-x": g()
+        "border-x": w()
       }],
       /**
        * Border Color Y
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-y": [{
-        "border-y": g()
+        "border-y": w()
       }],
       /**
        * Border Color S
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-s": [{
-        "border-s": g()
+        "border-s": w()
       }],
       /**
        * Border Color E
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-e": [{
-        "border-e": g()
+        "border-e": w()
       }],
       /**
        * Border Color Top
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-t": [{
-        "border-t": g()
+        "border-t": w()
       }],
       /**
        * Border Color Right
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-r": [{
-        "border-r": g()
+        "border-r": w()
       }],
       /**
        * Border Color Bottom
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-b": [{
-        "border-b": g()
+        "border-b": w()
       }],
       /**
        * Border Color Left
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-l": [{
-        "border-l": g()
+        "border-l": w()
       }],
       /**
        * Divide Color
        * @see https://tailwindcss.com/docs/divide-color
        */
       "divide-color": [{
-        divide: g()
+        divide: w()
       }],
       /**
        * Outline Style
@@ -7321,21 +7356,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [B, _, k]
+        "outline-offset": [L, _, k]
       }],
       /**
        * Outline Width
        * @see https://tailwindcss.com/docs/outline-width
        */
       "outline-w": [{
-        outline: ["", B, Lo, vo]
+        outline: ["", L, Lo, vo]
       }],
       /**
        * Outline Color
        * @see https://tailwindcss.com/docs/outline-color
        */
       "outline-color": [{
-        outline: g()
+        outline: w()
       }],
       // ---------------
       // --- Effects ---
@@ -7359,7 +7394,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/box-shadow#setting-the-shadow-color
        */
       "shadow-color": [{
-        shadow: g()
+        shadow: w()
       }],
       /**
        * Inset Box Shadow
@@ -7373,7 +7408,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/box-shadow#setting-the-inset-shadow-color
        */
       "inset-shadow-color": [{
-        "inset-shadow": g()
+        "inset-shadow": w()
       }],
       /**
        * Ring Width
@@ -7394,7 +7429,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/box-shadow#setting-the-ring-color
        */
       "ring-color": [{
-        ring: g()
+        ring: w()
       }],
       /**
        * Ring Offset Width
@@ -7403,7 +7438,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
        */
       "ring-offset-w": [{
-        "ring-offset": [B, vo]
+        "ring-offset": [L, vo]
       }],
       /**
        * Ring Offset Color
@@ -7412,7 +7447,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
        */
       "ring-offset-color": [{
-        "ring-offset": g()
+        "ring-offset": w()
       }],
       /**
        * Inset Ring Width
@@ -7426,7 +7461,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/box-shadow#setting-the-inset-ring-color
        */
       "inset-ring-color": [{
-        "inset-ring": g()
+        "inset-ring": w()
       }],
       /**
        * Text Shadow
@@ -7440,14 +7475,14 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/text-shadow#setting-the-shadow-color
        */
       "text-shadow-color": [{
-        "text-shadow": g()
+        "text-shadow": w()
       }],
       /**
        * Opacity
        * @see https://tailwindcss.com/docs/opacity
        */
       opacity: [{
-        opacity: [B, _, k]
+        opacity: [L, _, k]
       }],
       /**
        * Mix Blend Mode
@@ -7482,7 +7517,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/mask-image
        */
       "mask-image-linear-pos": [{
-        "mask-linear": [B]
+        "mask-linear": [L]
       }],
       "mask-image-linear-from-pos": [{
         "mask-linear-from": J()
@@ -7491,10 +7526,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-linear-to": J()
       }],
       "mask-image-linear-from-color": [{
-        "mask-linear-from": g()
+        "mask-linear-from": w()
       }],
       "mask-image-linear-to-color": [{
-        "mask-linear-to": g()
+        "mask-linear-to": w()
       }],
       "mask-image-t-from-pos": [{
         "mask-t-from": J()
@@ -7503,10 +7538,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-t-to": J()
       }],
       "mask-image-t-from-color": [{
-        "mask-t-from": g()
+        "mask-t-from": w()
       }],
       "mask-image-t-to-color": [{
-        "mask-t-to": g()
+        "mask-t-to": w()
       }],
       "mask-image-r-from-pos": [{
         "mask-r-from": J()
@@ -7515,10 +7550,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-r-to": J()
       }],
       "mask-image-r-from-color": [{
-        "mask-r-from": g()
+        "mask-r-from": w()
       }],
       "mask-image-r-to-color": [{
-        "mask-r-to": g()
+        "mask-r-to": w()
       }],
       "mask-image-b-from-pos": [{
         "mask-b-from": J()
@@ -7527,10 +7562,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-b-to": J()
       }],
       "mask-image-b-from-color": [{
-        "mask-b-from": g()
+        "mask-b-from": w()
       }],
       "mask-image-b-to-color": [{
-        "mask-b-to": g()
+        "mask-b-to": w()
       }],
       "mask-image-l-from-pos": [{
         "mask-l-from": J()
@@ -7539,10 +7574,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-l-to": J()
       }],
       "mask-image-l-from-color": [{
-        "mask-l-from": g()
+        "mask-l-from": w()
       }],
       "mask-image-l-to-color": [{
-        "mask-l-to": g()
+        "mask-l-to": w()
       }],
       "mask-image-x-from-pos": [{
         "mask-x-from": J()
@@ -7551,10 +7586,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-x-to": J()
       }],
       "mask-image-x-from-color": [{
-        "mask-x-from": g()
+        "mask-x-from": w()
       }],
       "mask-image-x-to-color": [{
-        "mask-x-to": g()
+        "mask-x-to": w()
       }],
       "mask-image-y-from-pos": [{
         "mask-y-from": J()
@@ -7563,10 +7598,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-y-to": J()
       }],
       "mask-image-y-from-color": [{
-        "mask-y-from": g()
+        "mask-y-from": w()
       }],
       "mask-image-y-to-color": [{
-        "mask-y-to": g()
+        "mask-y-to": w()
       }],
       "mask-image-radial": [{
         "mask-radial": [_, k]
@@ -7578,10 +7613,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-radial-to": J()
       }],
       "mask-image-radial-from-color": [{
-        "mask-radial-from": g()
+        "mask-radial-from": w()
       }],
       "mask-image-radial-to-color": [{
-        "mask-radial-to": g()
+        "mask-radial-to": w()
       }],
       "mask-image-radial-shape": [{
         "mask-radial": ["circle", "ellipse"]
@@ -7593,10 +7628,10 @@ const $o = co(dr), pr = (t, o) => {
         }]
       }],
       "mask-image-radial-pos": [{
-        "mask-radial-at": R()
+        "mask-radial-at": B()
       }],
       "mask-image-conic-pos": [{
-        "mask-conic": [B]
+        "mask-conic": [L]
       }],
       "mask-image-conic-from-pos": [{
         "mask-conic-from": J()
@@ -7605,10 +7640,10 @@ const $o = co(dr), pr = (t, o) => {
         "mask-conic-to": J()
       }],
       "mask-image-conic-from-color": [{
-        "mask-conic-from": g()
+        "mask-conic-from": w()
       }],
       "mask-image-conic-to-color": [{
-        "mask-conic-to": g()
+        "mask-conic-to": w()
       }],
       /**
        * Mask Mode
@@ -7629,21 +7664,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/mask-position
        */
       "mask-position": [{
-        mask: K()
+        mask: Z()
       }],
       /**
        * Mask Repeat
        * @see https://tailwindcss.com/docs/mask-repeat
        */
       "mask-repeat": [{
-        mask: w()
+        mask: v()
       }],
       /**
        * Mask Size
        * @see https://tailwindcss.com/docs/mask-size
        */
       "mask-size": [{
-        mask: O()
+        mask: A()
       }],
       /**
        * Mask Type
@@ -7687,14 +7722,14 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/brightness
        */
       brightness: [{
-        brightness: [B, _, k]
+        brightness: [L, _, k]
       }],
       /**
        * Contrast
        * @see https://tailwindcss.com/docs/contrast
        */
       contrast: [{
-        contrast: [B, _, k]
+        contrast: [L, _, k]
       }],
       /**
        * Drop Shadow
@@ -7715,42 +7750,42 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/filter-drop-shadow#setting-the-shadow-color
        */
       "drop-shadow-color": [{
-        "drop-shadow": g()
+        "drop-shadow": w()
       }],
       /**
        * Grayscale
        * @see https://tailwindcss.com/docs/grayscale
        */
       grayscale: [{
-        grayscale: ["", B, _, k]
+        grayscale: ["", L, _, k]
       }],
       /**
        * Hue Rotate
        * @see https://tailwindcss.com/docs/hue-rotate
        */
       "hue-rotate": [{
-        "hue-rotate": [B, _, k]
+        "hue-rotate": [L, _, k]
       }],
       /**
        * Invert
        * @see https://tailwindcss.com/docs/invert
        */
       invert: [{
-        invert: ["", B, _, k]
+        invert: ["", L, _, k]
       }],
       /**
        * Saturate
        * @see https://tailwindcss.com/docs/saturate
        */
       saturate: [{
-        saturate: [B, _, k]
+        saturate: [L, _, k]
       }],
       /**
        * Sepia
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: ["", B, _, k]
+        sepia: ["", L, _, k]
       }],
       /**
        * Backdrop Filter
@@ -7777,56 +7812,56 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/backdrop-brightness
        */
       "backdrop-brightness": [{
-        "backdrop-brightness": [B, _, k]
+        "backdrop-brightness": [L, _, k]
       }],
       /**
        * Backdrop Contrast
        * @see https://tailwindcss.com/docs/backdrop-contrast
        */
       "backdrop-contrast": [{
-        "backdrop-contrast": [B, _, k]
+        "backdrop-contrast": [L, _, k]
       }],
       /**
        * Backdrop Grayscale
        * @see https://tailwindcss.com/docs/backdrop-grayscale
        */
       "backdrop-grayscale": [{
-        "backdrop-grayscale": ["", B, _, k]
+        "backdrop-grayscale": ["", L, _, k]
       }],
       /**
        * Backdrop Hue Rotate
        * @see https://tailwindcss.com/docs/backdrop-hue-rotate
        */
       "backdrop-hue-rotate": [{
-        "backdrop-hue-rotate": [B, _, k]
+        "backdrop-hue-rotate": [L, _, k]
       }],
       /**
        * Backdrop Invert
        * @see https://tailwindcss.com/docs/backdrop-invert
        */
       "backdrop-invert": [{
-        "backdrop-invert": ["", B, _, k]
+        "backdrop-invert": ["", L, _, k]
       }],
       /**
        * Backdrop Opacity
        * @see https://tailwindcss.com/docs/backdrop-opacity
        */
       "backdrop-opacity": [{
-        "backdrop-opacity": [B, _, k]
+        "backdrop-opacity": [L, _, k]
       }],
       /**
        * Backdrop Saturate
        * @see https://tailwindcss.com/docs/backdrop-saturate
        */
       "backdrop-saturate": [{
-        "backdrop-saturate": [B, _, k]
+        "backdrop-saturate": [L, _, k]
       }],
       /**
        * Backdrop Sepia
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": ["", B, _, k]
+        "backdrop-sepia": ["", L, _, k]
       }],
       // --------------
       // --- Tables ---
@@ -7843,21 +7878,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/border-spacing
        */
       "border-spacing": [{
-        "border-spacing": v()
+        "border-spacing": g()
       }],
       /**
        * Border Spacing X
        * @see https://tailwindcss.com/docs/border-spacing
        */
       "border-spacing-x": [{
-        "border-spacing-x": v()
+        "border-spacing-x": g()
       }],
       /**
        * Border Spacing Y
        * @see https://tailwindcss.com/docs/border-spacing
        */
       "border-spacing-y": [{
-        "border-spacing-y": v()
+        "border-spacing-y": g()
       }],
       /**
        * Table Layout
@@ -7895,21 +7930,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: [B, "initial", _, k]
+        duration: [L, "initial", _, k]
       }],
       /**
        * Transition Timing Function
        * @see https://tailwindcss.com/docs/transition-timing-function
        */
       ease: [{
-        ease: ["linear", "initial", N, _, k]
+        ease: ["linear", "initial", F, _, k]
       }],
       /**
        * Transition Delay
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: [B, _, k]
+        delay: [L, _, k]
       }],
       /**
        * Animation
@@ -7940,7 +7975,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/perspective-origin
        */
       "perspective-origin": [{
-        "perspective-origin": X()
+        "perspective-origin": D()
       }],
       /**
        * Rotate
@@ -8036,7 +8071,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/transform-origin
        */
       "transform-origin": [{
-        origin: X()
+        origin: D()
       }],
       /**
        * Transform Style
@@ -8050,28 +8085,28 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/translate
        */
       translate: [{
-        translate: L()
+        translate: P()
       }],
       /**
        * Translate X
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-x": [{
-        "translate-x": L()
+        "translate-x": P()
       }],
       /**
        * Translate Y
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-y": [{
-        "translate-y": L()
+        "translate-y": P()
       }],
       /**
        * Translate Z
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-z": [{
-        "translate-z": L()
+        "translate-z": P()
       }],
       /**
        * Translate None
@@ -8086,7 +8121,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/accent-color
        */
       accent: [{
-        accent: g()
+        accent: w()
       }],
       /**
        * Appearance
@@ -8100,7 +8135,7 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
        */
       "caret-color": [{
-        caret: g()
+        caret: w()
       }],
       /**
        * Color Scheme
@@ -8149,126 +8184,126 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-m": [{
-        "scroll-m": v()
+        "scroll-m": g()
       }],
       /**
        * Scroll Margin X
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mx": [{
-        "scroll-mx": v()
+        "scroll-mx": g()
       }],
       /**
        * Scroll Margin Y
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-my": [{
-        "scroll-my": v()
+        "scroll-my": g()
       }],
       /**
        * Scroll Margin Start
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ms": [{
-        "scroll-ms": v()
+        "scroll-ms": g()
       }],
       /**
        * Scroll Margin End
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-me": [{
-        "scroll-me": v()
+        "scroll-me": g()
       }],
       /**
        * Scroll Margin Top
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mt": [{
-        "scroll-mt": v()
+        "scroll-mt": g()
       }],
       /**
        * Scroll Margin Right
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mr": [{
-        "scroll-mr": v()
+        "scroll-mr": g()
       }],
       /**
        * Scroll Margin Bottom
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mb": [{
-        "scroll-mb": v()
+        "scroll-mb": g()
       }],
       /**
        * Scroll Margin Left
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ml": [{
-        "scroll-ml": v()
+        "scroll-ml": g()
       }],
       /**
        * Scroll Padding
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-p": [{
-        "scroll-p": v()
+        "scroll-p": g()
       }],
       /**
        * Scroll Padding X
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-px": [{
-        "scroll-px": v()
+        "scroll-px": g()
       }],
       /**
        * Scroll Padding Y
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-py": [{
-        "scroll-py": v()
+        "scroll-py": g()
       }],
       /**
        * Scroll Padding Start
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-ps": [{
-        "scroll-ps": v()
+        "scroll-ps": g()
       }],
       /**
        * Scroll Padding End
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pe": [{
-        "scroll-pe": v()
+        "scroll-pe": g()
       }],
       /**
        * Scroll Padding Top
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pt": [{
-        "scroll-pt": v()
+        "scroll-pt": g()
       }],
       /**
        * Scroll Padding Right
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pr": [{
-        "scroll-pr": v()
+        "scroll-pr": g()
       }],
       /**
        * Scroll Padding Bottom
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pb": [{
-        "scroll-pb": v()
+        "scroll-pb": g()
       }],
       /**
        * Scroll Padding Left
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pl": [{
-        "scroll-pl": v()
+        "scroll-pl": g()
       }],
       /**
        * Scroll Snap Align
@@ -8346,21 +8381,21 @@ const $o = co(dr), pr = (t, o) => {
        * @see https://tailwindcss.com/docs/fill
        */
       fill: [{
-        fill: ["none", ...g()]
+        fill: ["none", ...w()]
       }],
       /**
        * Stroke Width
        * @see https://tailwindcss.com/docs/stroke-width
        */
       "stroke-w": [{
-        stroke: [B, Lo, vo, Zo]
+        stroke: [L, Lo, vo, Zo]
       }],
       /**
        * Stroke
        * @see https://tailwindcss.com/docs/stroke
        */
       stroke: [{
-        stroke: ["none", ...g()]
+        stroke: ["none", ...w()]
       }],
       // ---------------------
       // --- Accessibility ---
@@ -8428,7 +8463,7 @@ const $o = co(dr), pr = (t, o) => {
     },
     orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
   };
-}, Io = /* @__PURE__ */ Ar(en), tn = (t, o) => {
+}, Fo = /* @__PURE__ */ Ar(en), tn = (t, o) => {
   let e = 0;
   const i = t.replace(/\D/g, "").split("");
   let r = "";
@@ -8447,81 +8482,82 @@ const $o = co(dr), pr = (t, o) => {
     value: m,
     controlled: p,
     rules: T,
-    onChange: N,
+    onChange: F,
     onCommit: M,
-    leadingIcon: I,
-    trailingIcon: R,
-    ...X
-  } = t, $ = m instanceof To, A = typeof m == "string" ? m : $ ? m.value : "", [v, z] = G(A);
-  Z(() => {
+    leadingIcon: R,
+    trailingIcon: B,
+    bare: D,
+    ...I
+  } = t, $ = m instanceof To, g = typeof m == "string" ? m : $ ? m.value : "", [z, O] = Y(g);
+  q(() => {
     if (p) {
       if ($)
-        return m.subscribe(z);
-      z(typeof m == "string" ? m : "");
+        return m.subscribe(O);
+      O(typeof m == "string" ? m : "");
     }
-  }, [p, m, $]), Z(() => p || !$ ? void 0 : m.subscribe((K) => {
+  }, [p, m, $]), q(() => p || !$ ? void 0 : m.subscribe((v) => {
     if (s.current) return;
-    const w = n.current;
-    w && w.value !== K && (w.value = K);
+    const A = n.current;
+    A && A.value !== v && (A.value = v);
   }), [m, $, p]), l.useEffect(() => {
-    const g = n.current;
-    if (!g) return;
-    T && (g.__fiboRules = T);
-    const K = g.closest(".fibo-textfield-container"), w = K == null ? void 0 : K.querySelector(".fibo-field-error");
-    K && (K.__fiboShowError = (O) => {
-      w && (w.textContent = O ?? "", w.style.display = O ? "" : "none");
+    const Z = n.current;
+    if (!Z) return;
+    T && (Z.__fiboRules = T);
+    const v = Z.closest(".fibo-textfield-container"), A = v == null ? void 0 : v.querySelector(".fibo-field-error");
+    v && (v.__fiboShowError = (K) => {
+      A && (A.textContent = K ?? "", A.style.display = K ? "" : "none");
     });
   }, [T]);
-  const P = x === "password", D = P && i ? "text" : x, S = (g) => d ? tn(g, d) : g, H = {
+  const W = x === "password", S = W && i ? "text" : x, C = (Z) => d ? tn(Z, d) : Z, w = {
     key: "input",
     ref: n,
     id: e,
-    className: "fibo-textfield-input w-full h-full bg-transparent outline-none py-2.5 text-sm",
-    style: { paddingLeft: I ? "2.75rem" : "1rem", paddingRight: R || P ? "2.75rem" : "1rem" },
-    type: D,
-    onChange: (g) => {
-      let K = S(g.target.value);
-      d && g.target.value !== K && (g.target.value = K), p && z(K), $ && (s.current = !0, m.value = K, s.current = !1), N == null || N(K);
+    className: D ? "fibo-textfield-input w-full bg-transparent outline-none" : "fibo-textfield-input w-full h-full bg-transparent outline-none py-2.5 text-sm",
+    style: { paddingLeft: D ? 0 : R ? "2.75rem" : "1rem", paddingRight: D ? 0 : B || W ? "2.75rem" : "1rem" },
+    type: S,
+    onChange: (Z) => {
+      let v = C(Z.target.value);
+      d && Z.target.value !== v && (Z.target.value = v), p && O(v), $ && (s.current = !0, m.value = v, s.current = !1), F == null || F(v);
     },
-    onBlur: (g) => {
-      var K;
-      M == null || M(S(g.target.value)), (K = X.onBlur) == null || K.call(X, g);
+    onBlur: (Z) => {
+      var v;
+      M == null || M(C(Z.target.value)), (v = I.onBlur) == null || v.call(I, Z);
     },
-    ...X
+    ...I
   };
-  return p ? H.value = v : H.defaultValue = A, l.createElement(
+  return p ? w.value = z : w.defaultValue = g, l.createElement(
     "div",
     { className: f, style: a },
     l.createElement(
       "div",
       { className: u || "relative w-full h-14 flex items-center" },
       [
-        I && l.createElement(
+        R && l.createElement(
           "div",
           {
             key: "leading-icon",
             className: "absolute left-3 top-1/2 transform -translate-y-1/2 flex items-center justify-center pointer-events-none z-10"
           },
-          I
+          R
         ),
-        l.createElement("input", H),
+        l.createElement("input", w),
         b && l.createElement(
           "label",
           {
             key: "label",
             htmlFor: e,
             className: "fibo-textfield-label",
-            style: { left: I ? "2.75rem" : "1rem" }
+            style: { left: D ? 0 : R ? "2.75rem" : "1rem" }
           },
           b
         ),
-        (R || P) && l.createElement(
+        (B || W) && l.createElement(
           "div",
           {
             key: "trailing-icon",
             className: "absolute right-3 top-1/2 transform -translate-y-1/2 flex items-center justify-center z-10"
           },
-          P ? l.createElement(
+          W ? l.createElement(
             "button",
             {
               type: "button",
@@ -8562,7 +8598,7 @@ const $o = co(dr), pr = (t, o) => {
               }),
               l.createElement("circle", { cx: 12, cy: 12, r: 3 })
             )
-          ) : R
+          ) : B
         )
       ]
     ),
@@ -8653,14 +8689,15 @@ class nn extends ao {
     return this._variant = e, this;
   }
   build() {
-    let e = "relative w-full h-14 flex items-center";
-    this._variant === "outlined" ? e += " border border-[var(--fibo-outline)] rounded-[4px] bg-transparent" : e += " bg-[var(--fibo-surface-variant)] rounded-t-[4px] border-b border-[var(--fibo-outline)]";
+    let e = this.isReset() ? "relative w-full flex items-center" : "relative w-full h-14 flex items-center";
+    this.isReset() || (this._variant === "outlined" ? e += " border border-[var(--fibo-outline)] rounded-[4px] bg-transparent" : e += " bg-[var(--fibo-surface-variant)] rounded-t-[4px] border-b border-[var(--fibo-outline)]");
     const r = {
-      containerClass: Io(
+      containerClass: Fo(
         "fibo-textfield-container w-full flex flex-col",
         ...this._classNames
       ),
       fieldClass: e,
+      bare: this.isReset(),
       containerStyle: this.getStyle(),
       label: this._label,
       error: this._error,
@@ -8696,37 +8733,37 @@ const ks = co(nn), sn = l.memo((t) => {
     className: h,
     style: d,
     id: x
-  } = t, m = U(null), p = U(null), T = o, [N, M] = G(T), I = e ? !!o : N, R = I || s;
-  Z(() => {
+  } = t, m = U(null), p = U(null), T = o, [F, M] = Y(T), R = e ? !!o : F, B = R || s;
+  q(() => {
     m.current && (m.current.indeterminate = !!s);
-  }, [s]), Z(() => {
+  }, [s]), q(() => {
     if (e) return;
-    const v = m.current;
-    if (!v) return;
-    const z = () => M(v.checked), P = () => {
+    const g = m.current;
+    if (!g) return;
+    const z = () => M(g.checked), O = () => {
       requestAnimationFrame(z);
     };
-    v.addEventListener("fibo-sync", z);
-    const D = v.closest("form");
-    return D == null || D.addEventListener("reset", P), () => {
-      v.removeEventListener("fibo-sync", z), D == null || D.removeEventListener("reset", P);
+    g.addEventListener("fibo-sync", z);
+    const W = g.closest("form");
+    return W == null || W.addEventListener("reset", O), () => {
+      g.removeEventListener("fibo-sync", z), W == null || W.removeEventListener("reset", O);
     };
-  }, [e]), Z(() => {
-    const v = m.current, z = p.current;
-    if (!v) return;
-    u && (v.__fiboRules = u);
-    const P = z == null ? void 0 : z.querySelector(".fibo-field-error");
-    z && (z.__fiboShowError = (D) => {
-      P && (P.textContent = D ?? "", P.style.display = D ? "" : "none");
+  }, [e]), q(() => {
+    const g = m.current, z = p.current;
+    if (!g) return;
+    u && (g.__fiboRules = u);
+    const O = z == null ? void 0 : z.querySelector(".fibo-field-error");
+    z && (z.__fiboShowError = (W) => {
+      O && (O.textContent = W ?? "", O.style.display = W ? "" : "none");
     });
   }, [u]);
-  const X = (v) => {
+  const D = (g) => {
     if (n) return;
-    const z = v.target.checked;
+    const z = g.target.checked;
     e || M(z), i == null || i(z);
   };
-  let $ = null;
-  s ? $ = l.createElement("div", { className: "w-[10px] h-[2px] bg-white rounded-[1px]" }) : I && ($ = l.createElement(
+  let I = null;
+  s ? I = l.createElement("div", { className: "w-[10px] h-[2px] bg-white rounded-[1px]" }) : R && (I = l.createElement(
     "svg",
     {
       width: "12",
@@ -8744,7 +8781,7 @@ const ks = co(nn), sn = l.memo((t) => {
       strokeLinejoin: "round"
     })
   ));
-  const A = {
+  const $ = {
     ref: m,
     id: x,
     type: "checkbox",
@@ -8752,13 +8789,13 @@ const ks = co(nn), sn = l.memo((t) => {
     value: a,
     disabled: n,
     className: "sr-only",
-    onChange: X
+    onChange: D
   };
-  return e ? A.checked = !!o : A.defaultChecked = T, l.createElement(
+  return e ? $.checked = !!o : $.defaultChecked = T, l.createElement(
     "div",
     {
       ref: p,
-      className: Io("fibo-checkbox-container", h)
+      className: Fo("fibo-checkbox-container", h)
     },
     l.createElement(
       "label",
@@ -8768,18 +8805,18 @@ const ks = co(nn), sn = l.memo((t) => {
       l.createElement(
         "div",
         {
-          className: Io(
+          className: Fo(
             "fibo-checkbox-box w-5 h-5 rounded-[6px] border-2 flex items-center justify-center transition-all duration-200",
             n ? "cursor-not-allowed opacity-50" : "cursor-pointer",
-            R ? "border-transparent bg-[var(--fibo-primary,#3B82F6)]" : "border-gray-300 bg-transparent"
+            B ? "border-transparent bg-[var(--fibo-primary,#3B82F6)]" : "border-gray-300 bg-transparent"
           ),
           style: d,
           "aria-hidden": !0
         },
-        $
+        I
       ),
       r && l.createElement("span", { className: "text-sm text-gray-700 select-none" }, r),
-      l.createElement("input", A)
+      l.createElement("input", $)
     ),
     l.createElement(
       "span",
@@ -8865,7 +8902,7 @@ function an(t) {
   return Array.isArray(t) ? t.join(",") : t ?? "";
 }
 const cn = l.memo((t) => {
-  const o = l.useId(), e = t.id || o, i = `${e}-listbox`, [r, n] = G(!1), [s, f] = G(0), a = U(null), u = U(null), {
+  const o = l.useId(), e = t.id || o, i = `${e}-listbox`, [r, n] = Y(!1), [s, f] = Y(0), a = U(null), u = U(null), {
     containerClass: b,
     containerStyle: h,
     label: d,
@@ -8873,48 +8910,48 @@ const cn = l.memo((t) => {
     value: m,
     options: p = [],
     placeholder: T,
-    onChange: N,
+    onChange: F,
     disabled: M,
-    multiple: I,
-    name: R,
-    controlled: X = !1,
-    rules: $
-  } = t, [A, v] = G(
-    () => m ?? (I ? [] : "")
-  ), z = X ? m ?? (I ? [] : "") : A;
-  Z(() => {
-    const y = (F) => {
-      a.current && !a.current.contains(F.target) && n(!1);
+    multiple: R,
+    name: B,
+    controlled: D = !1,
+    rules: I
+  } = t, [$, g] = Y(
+    () => m ?? (R ? [] : "")
+  ), z = D ? m ?? (R ? [] : "") : $;
+  q(() => {
+    const y = (N) => {
+      a.current && !a.current.contains(N.target) && n(!1);
     };
     return document.addEventListener("mousedown", y), () => document.removeEventListener("mousedown", y);
-  }, []), Z(() => {
+  }, []), q(() => {
     const y = u.current;
     if (!y) return;
-    $ && (y.__fiboRules = $);
-    const F = y.closest(".fibo-textfield-container"), H = F == null ? void 0 : F.querySelector(".fibo-field-error");
-    F && (F.__fiboShowError = (g) => {
-      H && (H.textContent = g ?? "", H.style.display = g ? "" : "none");
+    I && (y.__fiboRules = I);
+    const N = y.closest(".fibo-textfield-container"), G = N == null ? void 0 : N.querySelector(".fibo-field-error");
+    N && (N.__fiboShowError = (w) => {
+      G && (G.textContent = w ?? "", G.style.display = w ? "" : "none");
     });
-  }, [$]);
-  const P = (y) => I ? Array.isArray(z) && z.includes(y) : z === y;
-  let D = "";
-  if (I)
-    Array.isArray(z) && z.length > 0 && (D = p.filter((y) => z.includes(y.value)).map((y) => y.label).join(", "));
+  }, [I]);
+  const O = (y) => R ? Array.isArray(z) && z.includes(y) : z === y;
+  let W = "";
+  if (R)
+    Array.isArray(z) && z.length > 0 && (W = p.filter((y) => z.includes(y.value)).map((y) => y.label).join(", "));
   else {
-    const y = p.find((F) => F.value === z);
-    D = y ? y.label : "";
+    const y = p.find((N) => N.value === z);
+    W = y ? y.label : "";
   }
   const S = (y) => {
     if (M) return;
-    let F;
-    if (I) {
-      const H = Array.isArray(z) ? [...z] : [], g = H.indexOf(y);
-      g > -1 ? H.splice(g, 1) : H.push(y), F = H;
+    let N;
+    if (R) {
+      const G = Array.isArray(z) ? [...z] : [], w = G.indexOf(y);
+      w > -1 ? G.splice(w, 1) : G.push(y), N = G;
     } else
-      F = y, n(!1);
-    X || v(F), N == null || N(F);
+      N = y, n(!1);
+    D || g(N), F == null || F(N);
   }, C = (y) => {
-    p.length !== 0 && f((F) => (F + y + p.length) % p.length);
+    p.length !== 0 && f((N) => (N + y + p.length) % p.length);
   }, V = (y) => {
     if (!M)
       switch (y.key) {
@@ -8947,11 +8984,11 @@ const cn = l.memo((t) => {
       style: h
     },
     l.createElement("div", { className: "relative w-full h-full" }, [
-      R ? l.createElement("input", {
+      B ? l.createElement("input", {
         key: "hidden",
         ref: u,
         type: "hidden",
-        name: R,
+        name: B,
         value: an(z)
       }) : null,
       l.createElement("button", {
@@ -8964,11 +9001,11 @@ const cn = l.memo((t) => {
         "aria-controls": i,
         "aria-activedescendant": r && p[s] ? `${i}-opt-${p[s].value}` : void 0,
         disabled: M,
-        className: `fibo-textfield-input text-left w-full flex items-center justify-between ${D ? "" : "text-gray-400"}`,
+        className: `fibo-textfield-input text-left w-full flex items-center justify-between ${W ? "" : "text-gray-400"}`,
         onClick: () => !M && n(!r),
         onKeyDown: V
       }, [
-        l.createElement("span", { key: "text", className: "truncate" }, D || T || " "),
+        l.createElement("span", { key: "text", className: "truncate" }, W || T || " "),
         l.createElement("svg", {
           key: "icon",
           className: `w-4 h-4 transition-transform ${r ? "rotate-180" : ""}`,
@@ -8991,21 +9028,21 @@ const cn = l.memo((t) => {
         key: "dropdown",
         id: i,
         role: "listbox",
-        "aria-multiselectable": I || void 0,
+        "aria-multiselectable": R || void 0,
         className: "absolute z-50 w-full mt-1 bg-[var(--fibo-surface)] border border-[var(--fibo-outline)] rounded-md shadow-lg max-h-60 overflow-auto focus:outline-none"
-      }, p.map((y, F) => {
-        const H = P(y.value), g = F === s;
+      }, p.map((y, N) => {
+        const G = O(y.value), w = N === s;
         return l.createElement("div", {
           key: y.value,
           id: `${i}-opt-${y.value}`,
           role: "option",
-          "aria-selected": H,
-          className: `px-4 py-2 cursor-pointer text-sm hover:bg-[var(--fibo-primary-container)] hover:text-[var(--fibo-on-primary-container)] flex items-center justify-between ${H || g ? "bg-[var(--fibo-primary-container)] text-[var(--fibo-on-primary-container)] font-medium" : "text-[var(--fibo-on-surface)]"}`,
+          "aria-selected": G,
+          className: `px-4 py-2 cursor-pointer text-sm hover:bg-[var(--fibo-primary-container)] hover:text-[var(--fibo-on-primary-container)] flex items-center justify-between ${G || w ? "bg-[var(--fibo-primary-container)] text-[var(--fibo-on-primary-container)] font-medium" : "text-[var(--fibo-on-surface)]"}`,
           onClick: () => S(y.value),
-          onMouseEnter: () => f(F)
+          onMouseEnter: () => f(N)
         }, [
           l.createElement("span", { key: "label" }, y.label),
-          H && l.createElement("svg", {
+          G && l.createElement("svg", {
             key: "check",
             className: "w-4 h-4 text-[var(--fibo-primary)]",
             viewBox: "0 0 20 20",
@@ -9082,7 +9119,7 @@ class ln extends ao {
   }
   build() {
     const i = {
-      containerClass: Io("fibo-textfield-container relative", ...this._classNames),
+      containerClass: Fo("fibo-textfield-container relative", ...this._classNames),
       containerStyle: this.getStyle(),
       label: this._label,
       error: this._error,
@@ -9105,84 +9142,84 @@ function un(t) {
   return Array.isArray(t) ? t.join(",") : t ?? "";
 }
 const bn = l.memo((t) => {
-  const o = l.useId(), e = t.id || o, i = `${e}-listbox`, [r, n] = G(!1), [s, f] = G(""), [a, u] = G(0), b = U(null), h = U(null), {
+  const o = l.useId(), e = t.id || o, i = `${e}-listbox`, [r, n] = Y(!1), [s, f] = Y(""), [a, u] = Y(0), b = U(null), h = U(null), {
     containerClass: d,
     containerStyle: x,
     label: m,
     error: p,
     value: T,
-    options: N = [],
+    options: F = [],
     placeholder: M,
-    onChange: I,
-    onAdd: R,
-    disabled: X,
-    multiple: $,
-    name: A,
-    controlled: v = !1,
+    onChange: R,
+    onAdd: B,
+    disabled: D,
+    multiple: I,
+    name: $,
+    controlled: g = !1,
     rules: z
-  } = t, [P, D] = G(
-    () => T ?? ($ ? [] : "")
-  ), S = v ? T ?? ($ ? [] : "") : P;
-  Z(() => {
-    if (!$) {
-      const w = N.find((O) => O.value === S);
-      w && !r && s !== w.label && f(w.label);
+  } = t, [O, W] = Y(
+    () => T ?? (I ? [] : "")
+  ), S = g ? T ?? (I ? [] : "") : O;
+  q(() => {
+    if (!I) {
+      const v = F.find((A) => A.value === S);
+      v && !r && s !== v.label && f(v.label);
     }
-  }, [S, N, r, $]);
-  const C = N.filter(
-    (w) => w.label.toLowerCase().includes(s.toLowerCase())
+  }, [S, F, r, I]);
+  const C = F.filter(
+    (v) => v.label.toLowerCase().includes(s.toLowerCase())
   );
-  Z(() => {
+  q(() => {
     u(0);
-  }, [s, r]), Z(() => {
-    const w = (O) => {
-      if (b.current && !b.current.contains(O.target))
-        if (n(!1), $)
+  }, [s, r]), q(() => {
+    const v = (A) => {
+      if (b.current && !b.current.contains(A.target))
+        if (n(!1), I)
           f("");
         else {
-          const q = N.find((Y) => Y.value === S);
-          f(q ? q.label : "");
+          const K = F.find((X) => X.value === S);
+          f(K ? K.label : "");
         }
     };
-    return document.addEventListener("mousedown", w), () => document.removeEventListener("mousedown", w);
-  }, [S, N, $]), Z(() => {
-    const w = h.current;
-    if (!w) return;
-    z && (w.__fiboRules = z);
-    const O = w.closest(".fibo-textfield-container"), q = O == null ? void 0 : O.querySelector(".fibo-field-error");
-    O && (O.__fiboShowError = (Y) => {
-      q && (q.textContent = Y ?? "", q.style.display = Y ? "" : "none");
+    return document.addEventListener("mousedown", v), () => document.removeEventListener("mousedown", v);
+  }, [S, F, I]), q(() => {
+    const v = h.current;
+    if (!v) return;
+    z && (v.__fiboRules = z);
+    const A = v.closest(".fibo-textfield-container"), K = A == null ? void 0 : A.querySelector(".fibo-field-error");
+    A && (A.__fiboShowError = (X) => {
+      K && (K.textContent = X ?? "", K.style.display = X ? "" : "none");
     });
   }, [z]);
-  const V = (w) => {
-    v || D(w), I == null || I(w);
-  }, y = (w) => {
-    if ($) {
-      const O = Array.isArray(S) ? [...S] : [];
-      O.includes(w.value) || (O.push(w.value), V(O)), f("");
+  const V = (v) => {
+    g || W(v), R == null || R(v);
+  }, y = (v) => {
+    if (I) {
+      const A = Array.isArray(S) ? [...S] : [];
+      A.includes(v.value) || (A.push(v.value), V(A)), f("");
     } else
-      f(w.label), V(w.value), n(!1);
-  }, F = (w) => {
-    if ($ && Array.isArray(S)) {
-      const O = S.filter((q) => q !== w);
-      V(O);
+      f(v.label), V(v.value), n(!1);
+  }, N = (v) => {
+    if (I && Array.isArray(S)) {
+      const A = S.filter((K) => K !== v);
+      V(A);
     }
-  }, H = () => {
-    R == null || R(s), $ ? f("") : n(!1);
-  }, g = (w) => $ ? Array.isArray(S) && S.includes(w) : S === w, K = (w) => {
-    if (!X)
-      switch (w.key) {
+  }, G = () => {
+    B == null || B(s), I ? f("") : n(!1);
+  }, w = (v) => I ? Array.isArray(S) && S.includes(v) : S === v, Z = (v) => {
+    if (!D)
+      switch (v.key) {
         case "ArrowDown":
-          w.preventDefault(), r ? C.length && u((O) => (O + 1) % C.length) : n(!0);
+          v.preventDefault(), r ? C.length && u((A) => (A + 1) % C.length) : n(!0);
           break;
         case "ArrowUp":
-          w.preventDefault(), r ? C.length && u((O) => (O - 1 + C.length) % C.length) : n(!0);
+          v.preventDefault(), r ? C.length && u((A) => (A - 1 + C.length) % C.length) : n(!0);
           break;
         case "Enter":
-          w.preventDefault(), C[a] ? y(C[a]) : s && R && H();
+          v.preventDefault(), C[a] ? y(C[a]) : s && B && G();
           break;
         case "Escape":
-          w.preventDefault(), n(!1);
+          v.preventDefault(), n(!1);
           break;
       }
   };
@@ -9194,11 +9231,11 @@ const bn = l.memo((t) => {
       style: x
     },
     l.createElement("div", { className: "relative w-full h-full" }, [
-      A ? l.createElement("input", {
+      $ ? l.createElement("input", {
         key: "hidden",
         ref: h,
         type: "hidden",
-        name: A,
+        name: $,
         value: un(S)
       }) : null,
       l.createElement("div", {
@@ -9206,19 +9243,19 @@ const bn = l.memo((t) => {
         className: `fibo-textfield-input flex flex-wrap items-center gap-1 ${r ? "ring-2 ring-[var(--fibo-primary-container)] border-[var(--fibo-primary)]" : ""}`,
         style: { minHeight: "42px", padding: "4px 8px" }
       }, [
-        $ && Array.isArray(S) && S.map((w) => {
-          const O = N.find((Y) => Y.value === w), q = O ? O.label : w;
+        I && Array.isArray(S) && S.map((v) => {
+          const A = F.find((X) => X.value === v), K = A ? A.label : v;
           return l.createElement("span", {
-            key: w,
+            key: v,
             className: "bg-[var(--fibo-primary-container)] text-[var(--fibo-on-primary-container)] text-xs font-medium px-2 py-1 rounded-md flex items-center"
           }, [
-            q,
+            K,
             l.createElement("button", {
               type: "button",
               className: "ml-1 hover:text-[var(--fibo-primary)] focus:outline-none",
-              "aria-label": `Remove ${q}`,
-              onClick: (Y) => {
-                Y.stopPropagation(), F(w);
+              "aria-label": `Remove ${K}`,
+              onClick: (X) => {
+                X.stopPropagation(), N(v);
               }
             }, "×")
           ]);
@@ -9233,13 +9270,13 @@ const bn = l.memo((t) => {
           "aria-activedescendant": r && C[a] ? `${i}-opt-${C[a].value}` : void 0,
           className: "bg-transparent outline-none flex-1 min-w-[60px] text-sm h-8",
           value: s,
-          placeholder: $ && Array.isArray(S) && S.length > 0 ? "" : M || " ",
-          disabled: X,
-          onChange: (w) => {
-            f(w.target.value), r || n(!0);
+          placeholder: I && Array.isArray(S) && S.length > 0 ? "" : M || " ",
+          disabled: D,
+          onChange: (v) => {
+            f(v.target.value), r || n(!0);
           },
           onFocus: () => n(!0),
-          onKeyDown: K
+          onKeyDown: Z
         })
       ]),
       m && l.createElement(
@@ -9255,27 +9292,27 @@ const bn = l.memo((t) => {
         key: "dropdown",
         id: i,
         role: "listbox",
-        "aria-multiselectable": $ || void 0,
+        "aria-multiselectable": I || void 0,
         className: "absolute z-50 w-full mt-1 bg-[var(--fibo-surface)] border border-[var(--fibo-outline)] rounded-md shadow-lg max-h-60 overflow-auto focus:outline-none left-0"
       }, [
-        ...C.length > 0 ? C.map((w, O) => {
-          const q = g(w.value), Y = O === a;
+        ...C.length > 0 ? C.map((v, A) => {
+          const K = w(v.value), X = A === a;
           return l.createElement("div", {
-            key: w.value,
-            id: `${i}-opt-${w.value}`,
+            key: v.value,
+            id: `${i}-opt-${v.value}`,
             role: "option",
-            "aria-selected": q,
-            className: `px-4 py-2 cursor-pointer text-sm hover:bg-[var(--fibo-primary-container)] hover:text-[var(--fibo-on-primary-container)] ${q || Y ? "bg-[var(--fibo-primary-container)] text-[var(--fibo-on-primary-container)] font-medium" : "text-[var(--fibo-on-surface)]"} ${q ? "opacity-50" : ""}`,
-            onClick: () => !q && y(w),
-            onMouseEnter: () => u(O)
-          }, w.label);
+            "aria-selected": K,
+            className: `px-4 py-2 cursor-pointer text-sm hover:bg-[var(--fibo-primary-container)] hover:text-[var(--fibo-on-primary-container)] ${K || X ? "bg-[var(--fibo-primary-container)] text-[var(--fibo-on-primary-container)] font-medium" : "text-[var(--fibo-on-surface)]"} ${K ? "opacity-50" : ""}`,
+            onClick: () => !K && y(v),
+            onMouseEnter: () => u(A)
+          }, v.label);
         }) : [l.createElement("div", { key: "empty", className: "px-4 py-2 text-sm text-gray-500" }, "No results found.")],
-        s && !C.some((w) => w.label.toLowerCase() === s.toLowerCase()) && R ? l.createElement("div", {
+        s && !C.some((v) => v.label.toLowerCase() === s.toLowerCase()) && B ? l.createElement("div", {
           key: "add-new",
           role: "option",
           "aria-selected": !1,
           className: "border-t border-[var(--fibo-outline)] px-4 py-2 cursor-pointer text-sm text-[var(--fibo-primary)] hover:bg-[var(--fibo-primary-container)] font-medium flex items-center",
-          onClick: H
+          onClick: G
         }, [
           l.createElement("span", { key: "plus", className: "mr-1" }, "+"),
           `Add "${s}"`
@@ -9353,7 +9390,7 @@ class hn extends ao {
   }
   build() {
     const i = {
-      containerClass: Io("fibo-textfield-container relative", ...this._classNames),
+      containerClass: Fo("fibo-textfield-container relative", ...this._classNames),
       containerStyle: this.getStyle(),
       label: this._label,
       error: this._error,
@@ -9489,7 +9526,7 @@ function Ee(t, o) {
 function Te(t, o, e) {
   return lo(e ? e(t, o) : t);
 }
-const gn = 100, $e = 60, Ne = 5;
+const gn = 100, Ie = 60, $e = 5;
 function Qo(t) {
   return t.split(";").map((o) => o.trim()).filter(Boolean).map((o) => /\s!important\s*$/i.test(o) ? o : `${o} !important`).join("; ");
 }
@@ -9511,70 +9548,70 @@ const vn = l.memo((t) => {
     customItemActive: m,
     customItemFocus: p,
     itemStyle: T
-  } = t, M = l.useId().replace(/:/g, ""), I = `fibo-list-${M}`, R = `fibo-list-custom-styles-${M}`, [X, $] = G(0), [A, v] = G(0), z = U(null), P = U(/* @__PURE__ */ new Map()), D = U(/* @__PURE__ */ new Map()), S = U(null), C = d === "horizontal", V = o.length, y = V > gn, F = (L) => D.current.get(L) ?? $e, H = (L) => {
+  } = t, M = l.useId().replace(/:/g, ""), R = `fibo-list-${M}`, B = `fibo-list-custom-styles-${M}`, [D, I] = Y(0), [$, g] = Y(0), z = U(null), O = U(/* @__PURE__ */ new Map()), W = U(/* @__PURE__ */ new Map()), S = U(null), C = d === "horizontal", V = o.length, y = V > gn, N = (P) => W.current.get(P) ?? Ie, G = (P) => {
     let j = 0;
-    for (let eo = 0; eo < L; eo++)
-      j += F(eo);
+    for (let eo = 0; eo < P; eo++)
+      j += N(eo);
     return j;
-  }, g = () => {
-    let L = 0;
+  }, w = () => {
+    let P = 0;
     for (let j = 0; j < V; j++)
-      L += F(j);
-    return L;
-  }, K = (L) => {
+      P += N(j);
+    return P;
+  }, Z = (P) => {
     let j = 0, eo = V - 1;
     for (; j < eo; ) {
       const so = Math.floor((j + eo) / 2);
-      H(so) < L ? j = so + 1 : eo = so;
+      G(so) < P ? j = so + 1 : eo = so;
     }
     return Math.max(0, j - 1);
   };
-  let w = 0, O = V, q = 0, Y = 0;
+  let v = 0, A = V, K = 0, X = 0;
   if (y) {
-    w = Math.max(0, K(X) - Ne);
-    let L = H(w), j = w;
-    for (; L < X + b + Ne * $e && j < V; )
-      L += F(j), j++;
-    O = Math.min(V, j), q = H(w), Y = g();
+    v = Math.max(0, Z(D) - $e);
+    let P = G(v), j = v;
+    for (; P < D + b + $e * Ie && j < V; )
+      P += N(j), j++;
+    A = Math.min(V, j), K = G(v), X = w();
   }
-  const to = o.slice(w, O);
+  const to = o.slice(v, A);
   oe(() => {
     if (!y) return;
-    let L = !1;
+    let P = !1;
     to.forEach((j, eo) => {
-      const so = w + eo, Co = P.current.get(so);
+      const so = v + eo, Co = O.current.get(so);
       if (Co) {
         const ce = Co.getBoundingClientRect(), Uo = C ? ce.width : ce.height;
-        Uo > 0 && D.current.get(so) !== Uo && (D.current.set(so, Uo), L = !0);
+        Uo > 0 && W.current.get(so) !== Uo && (W.current.set(so, Uo), P = !0);
       }
-    }), L && v((j) => j + 1);
-  }, [to, w, y, C, A]), oe(() => {
+    }), P && g((j) => j + 1);
+  }, [to, v, y, C, $]), oe(() => {
     if (!f || n) return;
-    const L = new IntersectionObserver(
+    const P = new IntersectionObserver(
       (j) => {
         j[0].isIntersecting && (f == null || f());
       },
       { threshold: s }
     );
-    return S.current && L.observe(S.current), () => L.disconnect();
+    return S.current && P.observe(S.current), () => P.disconnect();
   }, [n, o.length, f, s]);
-  const ko = (L) => {
-    y && $(C ? L.currentTarget.scrollLeft : L.currentTarget.scrollTop);
+  const ko = (P) => {
+    y && I(C ? P.currentTarget.scrollLeft : P.currentTarget.scrollTop);
   };
-  Z(() => {
+  q(() => {
     if (typeof document > "u" || !x && !m && !p) return;
-    let L = document.getElementById(R);
-    L || (L = document.createElement("style"), L.id = R, document.head.appendChild(L));
+    let P = document.getElementById(B);
+    P || (P = document.createElement("style"), P.id = B, document.head.appendChild(P));
     let j = "";
-    const eo = `.${I}`;
+    const eo = `.${R}`;
     return x && (j += `${eo} .fibo-list-item-custom-hover:hover { ${Qo(x)} }
 `), m && (j += `${eo} .fibo-list-item-custom-active:active { ${Qo(m)} }
 `), p && (j += `${eo} .fibo-list-item-custom-focus:focus-within { ${Qo(p)} }
-`), L.textContent = j, () => {
-      const so = document.getElementById(R);
+`), P.textContent = j, () => {
+      const so = document.getElementById(B);
       so && so.remove();
     };
-  }, [x, m, p, I, R]);
+  }, [x, m, p, R, B]);
   const Ao = {
     default: { gap: "0px" },
     card: { gap: "12px" },
@@ -9619,7 +9656,7 @@ const vn = l.memo((t) => {
     "div",
     {
       ref: z,
-      className: `fibo-list fibo-list-virtualized ${I} ${a || ""}`,
+      className: `fibo-list fibo-list-virtualized ${R} ${a || ""}`,
       style: {
         height: C ? void 0 : `${b}px`,
         width: C ? `${b}px` : void 0,
@@ -9635,8 +9672,8 @@ const vn = l.memo((t) => {
     },
     l.createElement("div", {
       style: {
-        height: C ? "1px" : `${Y}px`,
-        width: C ? `${Y}px` : "1px",
+        height: C ? "1px" : `${X}px`,
+        width: C ? `${X}px` : "1px",
         position: "absolute",
         top: 0,
         left: 0,
@@ -9648,21 +9685,21 @@ const vn = l.memo((t) => {
       "div",
       {
         style: {
-          transform: C ? `translateX(${q}px)` : `translateY(${q}px)`,
+          transform: C ? `translateX(${K}px)` : `translateY(${K}px)`,
           width: C ? "auto" : "100%",
           height: C ? "100%" : void 0,
           display: C ? "flex" : void 0,
           flexDirection: C ? "row" : void 0
         }
       },
-      to.map((L, j) => {
-        const eo = w + j, so = Te(L, eo, e);
+      to.map((P, j) => {
+        const eo = v + j, so = Te(P, eo, e);
         return l.cloneElement(
-          $o().style(go[i]).classNames(So[i]).children(so).build(),
+          Io().style(go[i]).classNames(So[i]).children(so).build(),
           {
-            key: Ee(L, eo),
+            key: Ee(P, eo),
             ref: (Co) => {
-              Co ? P.current.set(eo, Co) : P.current.delete(eo);
+              Co ? O.current.set(eo, Co) : O.current.delete(eo);
             }
           }
         );
@@ -9672,15 +9709,15 @@ const vn = l.memo((t) => {
       ref: S,
       className: "py-4 flex justify-center w-full"
     }, n ? l.createElement("div", { className: "animate-spin rounded-full h-5 w-5 border-2 border-gray-300 border-b-blue-600" }) : l.createElement("div", { style: { height: "20px" } }))
-  ) : $o().className(a).classNames(["fibo-list", I, "flex", d === "horizontal" ? "flex-row" : "flex-col", "w-full"]).style({
+  ) : Io().className(a).classNames(["fibo-list", R, "flex", d === "horizontal" ? "flex-row" : "flex-col", "w-full"]).style({
     ...Ao[i],
     ...u
   }).children(
     l.createElement(l.Fragment, {}, [
       ...o.map(
-        (L, j) => l.cloneElement(
-          $o().style(go[i]).classNames(So[i]).children(Te(L, j, e)).build(),
-          { key: Ee(L, j) }
+        (P, j) => l.cloneElement(
+          Io().style(go[i]).classNames(So[i]).children(Te(P, j, e)).build(),
+          { key: Ee(P, j) }
         )
       ),
       f && l.createElement("div", {
@@ -9891,7 +9928,7 @@ const zs = co(wn), yn = () => l.createElement(
   return l.createElement(
     "div",
     {
-      className: Io("fibo-list-tile flex flex-row items-center w-full", u),
+      className: Fo("fibo-list-tile flex flex-row items-center w-full", u),
       style: {
         padding: x,
         borderBottom: s ? `1px solid ${f || "#3b3b3b"}` : "none",
@@ -10025,10 +10062,10 @@ class Sn extends ao {
   }
 }
 const Cn = l.memo(({ builder: t }) => {
-  const o = l.useId(), e = `${o}-content`, i = t._expanded !== void 0, [r, n] = G(t._defaultExpanded), s = i ? t._expanded : r, f = () => {
+  const o = l.useId(), e = `${o}-content`, i = t._expanded !== void 0, [r, n] = Y(t._defaultExpanded), s = i ? t._expanded : r, f = () => {
     i || n(!s), t._onToggle && t._onToggle(!s);
   };
-  return $o().classNames(["w-full", "border", "border-gray-200", "rounded-xl", "overflow-hidden", "bg-white", "transition-all", "duration-300"]).className(t.getClassName()).style(t.getStyle()).children([
+  return Io().classNames(["w-full", "border", "border-gray-200", "rounded-xl", "overflow-hidden", "bg-white", "transition-all", "duration-300"]).className(t.getClassName()).style(t.getStyle()).children([
     l.createElement("button", {
       key: "header",
       type: "button",
@@ -10060,7 +10097,7 @@ const Cn = l.memo(({ builder: t }) => {
         className: "text-gray-400"
       }, l.createElement("polyline", { points: "6 9 12 15 18 9" })))
     ]),
-    $o().props({
+    Io().props({
       id: e,
       role: "region",
       "aria-labelledby": o,
@@ -10069,7 +10106,7 @@ const Cn = l.memo(({ builder: t }) => {
       maxHeight: s ? "500px" : "0px",
       opacity: s ? 1 : 0
     }).children(
-      $o().classNames(["p-4", "pt-0", "text-gray-600", "text-sm"]).children(t._content).build()
+      Io().classNames(["p-4", "pt-0", "text-gray-600", "text-sm"]).children(t._content).build()
     ).build()
   ]).build();
 }), Ts = co(Sn);
@@ -10135,8 +10172,8 @@ class En extends zt {
     if (this.state.hasError && this.state.error) {
       const { fallback: e } = this.props;
       return typeof e == "function" ? e(this.state.error, this.state.errorInfo) : e || /* @__PURE__ */ Po("div", { style: { padding: "2rem", textAlign: "center" }, children: [
-        /* @__PURE__ */ W("h1", { children: "Something went wrong" }),
-        /* @__PURE__ */ W("p", { children: this.state.error.message })
+        /* @__PURE__ */ H("h1", { children: "Something went wrong" }),
+        /* @__PURE__ */ H("p", { children: this.state.error.message })
       ] });
     }
     return this.props.children;
@@ -10148,7 +10185,7 @@ const Tn = ({ error: t, onReset: o }) => {
   }, i = () => {
     window.location.reload();
   };
-  return /* @__PURE__ */ W(
+  return /* @__PURE__ */ H(
     "div",
     {
       style: {
@@ -10174,7 +10211,7 @@ const Tn = ({ error: t, onReset: o }) => {
             textAlign: "center"
           },
           children: [
-            /* @__PURE__ */ W(
+            /* @__PURE__ */ H(
               "div",
               {
                 style: {
@@ -10199,15 +10236,15 @@ const Tn = ({ error: t, onReset: o }) => {
                     strokeLinecap: "round",
                     strokeLinejoin: "round",
                     children: [
-                      /* @__PURE__ */ W("circle", { cx: "12", cy: "12", r: "10" }),
-                      /* @__PURE__ */ W("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
-                      /* @__PURE__ */ W("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
+                      /* @__PURE__ */ H("circle", { cx: "12", cy: "12", r: "10" }),
+                      /* @__PURE__ */ H("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
+                      /* @__PURE__ */ H("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
                     ]
                   }
                 )
               }
             ),
-            /* @__PURE__ */ W(
+            /* @__PURE__ */ H(
               "h1",
               {
                 style: {
@@ -10219,7 +10256,7 @@ const Tn = ({ error: t, onReset: o }) => {
                 children: "Oops! Something went wrong"
               }
             ),
-            t && /* @__PURE__ */ W(
+            t && /* @__PURE__ */ H(
               "div",
               {
                 style: {
@@ -10229,7 +10266,7 @@ const Tn = ({ error: t, onReset: o }) => {
                   borderRadius: "8px",
                   border: "1px solid #fecaca"
                 },
-                children: /* @__PURE__ */ W(
+                children: /* @__PURE__ */ H(
                   "p",
                   {
                     style: {
@@ -10244,7 +10281,7 @@ const Tn = ({ error: t, onReset: o }) => {
                 )
               }
             ),
-            /* @__PURE__ */ W(
+            /* @__PURE__ */ H(
               "p",
               {
                 style: {
@@ -10266,7 +10303,7 @@ const Tn = ({ error: t, onReset: o }) => {
                   flexWrap: "wrap"
                 },
                 children: [
-                  o && /* @__PURE__ */ W(
+                  o && /* @__PURE__ */ H(
                     "button",
                     {
                       onClick: o,
@@ -10290,7 +10327,7 @@ const Tn = ({ error: t, onReset: o }) => {
                       children: "Try Again"
                     }
                   ),
-                  /* @__PURE__ */ W(
+                  /* @__PURE__ */ H(
                     "button",
                     {
                       onClick: i,
@@ -10314,7 +10351,7 @@ const Tn = ({ error: t, onReset: o }) => {
                       children: "Reload Page"
                     }
                   ),
-                  /* @__PURE__ */ W(
+                  /* @__PURE__ */ H(
                     "button",
                     {
                       onClick: e,
@@ -10349,7 +10386,7 @@ const Tn = ({ error: t, onReset: o }) => {
                   textAlign: "left"
                 },
                 children: [
-                  /* @__PURE__ */ W(
+                  /* @__PURE__ */ H(
                     "summary",
                     {
                       style: {
@@ -10361,7 +10398,7 @@ const Tn = ({ error: t, onReset: o }) => {
                       children: "Stack Trace"
                     }
                   ),
-                  /* @__PURE__ */ W(
+                  /* @__PURE__ */ H(
                     "pre",
                     {
                       style: {
@@ -10386,16 +10423,16 @@ const Tn = ({ error: t, onReset: o }) => {
     }
   );
 };
-function Ie(t, o) {
+function Fe(t, o) {
   return o && t.startsWith(o) ? t.slice(o.length) || "/" : t || "/";
 }
-function $n(t) {
+function In(t) {
   return t ? t.startsWith("?") ? t.slice(1) : t : "";
 }
-function Nn(t) {
+function $n(t) {
   return t ? t.startsWith("#") ? t : `#${t}` : "";
 }
-const In = yo(null), $s = ({
+const Fn = yo(null), Is = ({
   routes: t,
   fallback: o,
   loading: e,
@@ -10406,69 +10443,69 @@ const In = yo(null), $s = ({
   errorBoundary: f,
   onError: a
 }) => {
-  const [u, b] = G(() => Ie(r, i)), [h, d] = G(() => new URLSearchParams($n(n))), [x, m] = G(() => Nn(s)), { route: p, params: T } = ie(t, u), N = l.useRef(p);
-  N.current = p;
-  const M = ro(async (A, v = {}) => {
-    const z = N.current, { route: P } = ie(t, A);
-    if (z != null && z.beforeLeave && P) {
-      const S = await z.beforeLeave(P, z);
+  const [u, b] = Y(() => Fe(r, i)), [h, d] = Y(() => new URLSearchParams(In(n))), [x, m] = Y(() => $n(s)), { route: p, params: T } = ie(t, u), F = l.useRef(p);
+  F.current = p;
+  const M = ro(async ($, g = {}) => {
+    const z = F.current, { route: O } = ie(t, $);
+    if (z != null && z.beforeLeave && O) {
+      const S = await z.beforeLeave(O, z);
       if (S === !1)
         return;
       if (typeof S == "string")
-        return M(S, v);
+        return M(S, g);
     }
-    if (P != null && P.beforeEnter) {
-      const S = await P.beforeEnter(P, z);
+    if (O != null && O.beforeEnter) {
+      const S = await O.beforeEnter(O, z);
       if (S === !1)
         return;
-      typeof S == "string" && (A = S);
+      typeof S == "string" && ($ = S);
     }
-    const D = i + A;
-    typeof window < "u" && (v.replace ? window.history.replaceState(v.state || {}, "", D) : window.history.pushState(v.state || {}, "", D), d(new URLSearchParams(window.location.search))), b(A);
-  }, [i, t]), I = ro(() => {
+    const W = i + $;
+    typeof window < "u" && (g.replace ? window.history.replaceState(g.state || {}, "", W) : window.history.pushState(g.state || {}, "", W), d(new URLSearchParams(window.location.search))), b($);
+  }, [i, t]), R = ro(() => {
     typeof window < "u" && window.history.back();
-  }, []), R = ro((A) => {
-    M(A, { replace: !0 });
+  }, []), B = ro(($) => {
+    M($, { replace: !0 });
   }, [M]);
-  Z(() => {
+  q(() => {
     if (typeof window > "u") return;
-    const A = () => {
-      b(Ie(window.location.pathname, i)), d(new URLSearchParams(window.location.search)), m(window.location.hash || "");
+    const $ = () => {
+      b(Fe(window.location.pathname, i)), d(new URLSearchParams(window.location.search)), m(window.location.hash || "");
     };
-    return A(), window.addEventListener("popstate", A), () => window.removeEventListener("popstate", A);
+    return $(), window.addEventListener("popstate", $), () => window.removeEventListener("popstate", $);
   }, [i]);
-  const X = {
+  const D = {
     currentPath: u,
     basename: i,
     navigate: M,
-    goBack: I,
-    replace: R,
+    goBack: R,
+    replace: B,
     params: T,
     query: h,
     hash: x
-  }, $ = () => {
+  }, I = () => {
     if (!p)
-      return o ? /* @__PURE__ */ W(o, {}) : /* @__PURE__ */ W("div", { children: "404 - Page Not Found" });
-    const A = p.component, v = /* @__PURE__ */ W(In.Provider, { value: p, children: /* @__PURE__ */ W(A, {}) });
-    return /* @__PURE__ */ W(
+      return o ? /* @__PURE__ */ H(o, {}) : /* @__PURE__ */ H("div", { children: "404 - Page Not Found" });
+    const $ = p.component, g = /* @__PURE__ */ H(Fn.Provider, { value: p, children: /* @__PURE__ */ H($, {}) });
+    return /* @__PURE__ */ H(
       En,
       {
-        fallback: f || /* @__PURE__ */ W(Tn, {}),
+        fallback: f || /* @__PURE__ */ H(Tn, {}),
         onError: a,
-        children: v
+        children: g
       }
     );
   };
-  return /* @__PURE__ */ W(fe.Provider, { value: X, children: e ? /* @__PURE__ */ W(Et, { fallback: e, children: $() }) : $() });
+  return /* @__PURE__ */ H(fe.Provider, { value: D, children: e ? /* @__PURE__ */ H(Et, { fallback: e, children: I() }) : I() });
 };
 export {
   ar as $,
   as as A,
-  Ni as B,
-  $t as C,
+  $i as B,
+  It as C,
   Ye as D,
   Kt as E,
-  De as F,
+  Xe as F,
   wo as G,
   xi as H,
   Je as I,
@@ -10477,10 +10514,10 @@ export {
   vi as L,
   be as M,
   wi as N,
-  Nt as O,
-  Dt as P,
+  $t as O,
+  Xt as P,
   ei as Q,
-  Xn as R,
+  Dn as R,
   To as S,
   ns as T,
   ts as U,
@@ -10495,11 +10532,11 @@ export {
   _s as a1,
   Ss as a2,
   Cs as a3,
-  $o as a4,
+  Io as a4,
   zs as a5,
   Es as a6,
   Ts as a7,
-  $s as a8,
+  Is as a8,
   Go as a9,
   le as aA,
   Wn as aB,
@@ -10535,13 +10572,13 @@ export {
   lo as av,
   Vt as aw,
   Yt as ax,
-  Io as ay,
+  Fo as ay,
   Gt as az,
   Ae as b,
   Pn as c,
   Vn as d,
   jn as e,
-  Dn as f,
+  Xn as f,
   Le as g,
   Wt as h,
   Yn as i,
@@ -10558,8 +10595,8 @@ export {
   es as t,
   Hn as u,
   er as v,
-  $i as w,
-  Ii as x,
+  Ii as w,
+  Fi as x,
   ss as y,
   fs as z
 };