@lumx/vue 4.18.1-alpha.1 → 4.19.0-next.0

package/index.js

@@ -1,7 +1,7 @@
 import { ColorVariant as ld, Size as rt, VISUALLY_HIDDEN as cd, DIALOG_TRANSITION_DURATION as ac, AspectRatio as oc, IS_BROWSER as Yr, ColorPalette as ud } from "@lumx/core/js/constants";
 export * from "@lumx/core/js/constants";
 export * from "@lumx/core/js/types";
-import { createVNode as m, mergeProps as S, Fragment as ne, isVNode as K, useAttrs as D, computed as w, toValue as Me, getCurrentScope as rc, onScopeDispose as mr, toRef as Q, readonly as dd, customRef as fd, ref as R, shallowRef as Re, watch as X, getCurrentInstance as sc, onMounted as Ke, inject as qe, defineComponent as E, toRefs as hd, reactive as ic, provide as je, watchEffect as Xe, isRef as lt, onUnmounted as He, watchPostEffect as md, onBeforeUnmount as en, Comment as pr, unref as xt, useSlots as ke, useTemplateRef as pd, toRaw as Ye, Text as lc, nextTick as cc, shallowReadonly as nt, h as Zr, cloneVNode as gd, onWatcherCleanup as vd, createTextVNode as bd, withDirectives as yd, resolveDirective as Ad } from "vue";
+import { createVNode as m, mergeProps as S, Fragment as ne, isVNode as K, useAttrs as D, computed as C, toValue as Me, getCurrentScope as rc, onScopeDispose as mr, toRef as Q, readonly as dd, customRef as fd, ref as R, shallowRef as Re, watch as X, getCurrentInstance as sc, onMounted as Ke, inject as qe, defineComponent as E, toRefs as hd, reactive as ic, provide as je, watchEffect as Xe, isRef as lt, onUnmounted as He, watchPostEffect as md, onBeforeUnmount as en, Comment as pr, unref as xt, useSlots as ke, useTemplateRef as pd, toRaw as Ye, Text as lc, nextTick as cc, shallowReadonly as nt, h as Zr, cloneVNode as gd, onWatcherCleanup as vd, createTextVNode as bd, withDirectives as yd, resolveDirective as Ad } from "vue";
 import { classNames as fe } from "@lumx/core/js/utils";
 import { k as $, u as U, T as gr, P as tn, C as vr, I as uc } from "./_internal/CHaqSUjw.js";
 import { getDisabledState as Sd } from "@lumx/core/js/utils/disabledState";
@@ -184,7 +184,7 @@ const an = () => cd;
 function jd(e, t, n, a) {
   return Sr(`${e}__${t}`, n, a);
 }
-function F(e) {
+function B(e) {
   function t(a, o) {
     return Sr(e, a, o);
   }
@@ -239,7 +239,7 @@ const Wd = {
   }
 }, Ud = "AlertDialog", Gd = "lumx-alert-dialog", {
   block: Kd
-} = F(Gd), as = {
+} = B(Gd), as = {
   size: H.tiny,
   kind: ie.info
 }, Xd = (e) => {
@@ -266,10 +266,10 @@ const Wd = {
   } = e, {
     color: N,
     icon: x
-  } = Wd[i] || {}, C = `${t}-title`, O = `${t}-description`, {
+  } = Wd[i] || {}, w = `${t}-title`, k = `${t}-description`, {
     label: P,
     onClick: T,
-    ...k
+    ...O
   } = r, {
     label: _,
     onClick: q,
@@ -282,8 +282,8 @@ const Wd = {
     dialogProps: {
       id: t,
       role: "alertdialog",
-      "aria-labelledby": C,
-      "aria-describedby": O,
+      "aria-labelledby": w,
+      "aria-describedby": k,
       ...c
     },
     className: L(a, Kd({
@@ -298,11 +298,11 @@ const Wd = {
         color: N
       }, null),
       label: m("h2", {
-        id: C,
+        id: w,
         className: "lumx-typography-title"
       }, [n])
     }, null)]), d && m(u, {
-      id: O,
+      id: k,
       className: "lumx-typography-body2 lumx-spacing-padding-vertical-big lumx-spacing-padding-horizontal-huge"
     }, Ln(d) ? d : {
       default: () => [d]
@@ -314,7 +314,7 @@ const Wd = {
         onClick: q
       }), Ln(_) ? _ : {
         default: () => [_]
-      }), m(v, S(k, {
+      }), m(v, S(O, {
         ref: f,
         color: N,
         className: "lumx-spacing-margin-left-regular",
@@ -331,7 +331,7 @@ function re() {
 }
 function yc(e, t, n) {
   const a = D();
-  return w(() => {
+  return C(() => {
     const o = Me(e), r = a[t];
     return n ? n(o, r) : o ?? r;
   });
@@ -377,14 +377,14 @@ function Jd() {
 // @__NO_SIDE_EFFECTS__
 function xr(e) {
   const t = /* @__PURE__ */ Jd();
-  return w(() => (t.value, !!e()));
+  return C(() => (t.value, !!e()));
 }
 function Qd(e, t, n = {}) {
   const { window: a = Pr, ...o } = n;
   let r;
   const s = /* @__PURE__ */ xr(() => a && "MutationObserver" in a), i = () => {
     r && (r.disconnect(), r = void 0);
-  }, l = X(w(() => {
+  }, l = X(C(() => {
     const u = Sc(Me(e)).map(st).filter(Ac);
     return new Set(u);
   }), (u) => {
@@ -406,7 +406,7 @@ function ef(e, t, n = {}) {
   let r;
   const s = /* @__PURE__ */ xr(() => a && "ResizeObserver" in a), i = () => {
     r && (r.disconnect(), r = void 0);
-  }, l = X(w(() => {
+  }, l = X(C(() => {
     const d = Me(e);
     return Array.isArray(d) ? d.map((u) => st(u)) : [st(d)];
   }), (d) => {
@@ -426,7 +426,7 @@ function ef(e, t, n = {}) {
   };
 }
 function rs(e, t, n = {}) {
-  const { root: a, rootMargin: o = "0px", threshold: r = 0, window: s = Pr, immediate: i = !0 } = n, l = /* @__PURE__ */ xr(() => s && "IntersectionObserver" in s), c = w(() => Sc(Me(e)).map(st).filter(Ac));
+  const { root: a, rootMargin: o = "0px", threshold: r = 0, window: s = Pr, immediate: i = !0 } = n, l = /* @__PURE__ */ xr(() => s && "IntersectionObserver" in s), c = C(() => Sc(Me(e)).map(st).filter(Ac));
   let d = Vt;
   const u = Re(i), h = l.value ? X(() => [
     c.value,
@@ -482,7 +482,7 @@ function tf(e, t = !1) {
     const s = En(Me(e));
     !s || !n.value || (s.style.overflow = a, $n.delete(s), n.value = !1);
   };
-  return on(r), w({
+  return on(r), C({
     get() {
       return n.value;
     },
@@ -494,7 +494,7 @@ function tf(e, t = !1) {
 const nf = "lumx-dialog", {
   block: af,
   element: xe
-} = F(nf), Nc = {
+} = B(nf), Nc = {
   size: H.big
 }, of = (e) => {
   const {
@@ -519,23 +519,23 @@ const nf = "lumx-dialog", {
     ClickAwayProvider: A,
     shouldPreventCloseOnClickAway: N,
     clickAwayRefs: x,
-    rootRef: C,
-    wrapperRef: O,
+    rootRef: w,
+    wrapperRef: k,
     hasTopIntersection: P,
     headerChildProps: T,
-    setSentinelTop: k,
+    setSentinelTop: O,
     content: _,
     setSentinelBottom: q,
     footerChildContent: j,
     footerChildProps: I,
-    ProgressCircular: B,
-    hasBottomIntersection: z,
-    ...V
+    ProgressCircular: F,
+    hasBottomIntersection: V,
+    ...W
   } = e;
   return m(b, null, {
     default: () => [m("div", S({
       ref: n
-    }, V, {
+    }, W, {
       className: L(t, af({
         "is-hidden": !l,
         "is-loading": i,
@@ -560,11 +560,11 @@ const nf = "lumx-dialog", {
         }, f), [m(A, {
           callback: !N && c,
           childrenRefs: x,
-          parentRef: C
+          parentRef: w
         }, {
           default: () => [m("section", {
             className: xe("wrapper"),
-            ref: O
+            ref: k
           }, [(a || g) && m("header", S(T, {
             className: L(xe("header", {
               "has-divider": !!(r || P)
@@ -576,7 +576,7 @@ const nf = "lumx-dialog", {
             className: xe("sentinel", {
               top: !0
             }),
-            ref: k
+            ref: O
           }, null), _, m("div", {
             className: xe("sentinel", {
               bottom: !0
@@ -584,11 +584,11 @@ const nf = "lumx-dialog", {
             ref: q
           }, null)]), (s || j) && m("footer", S(I, {
             className: L(xe("footer", {
-              "has-divider": !!(o || z)
+              "has-divider": !!(o || V)
             }), I?.className)
           }), [s, j]), i && m("div", {
             className: xe("progress-overlay")
-          }, [m(B, null, null)])])]
+          }, [m(F, null, null)])])]
         })])]
       })]
     })])]
@@ -608,7 +608,7 @@ const nf = "lumx-dialog", {
 }) => {
   const {
     level: n
-  } = hd(e), a = xc(), o = w(() => lf(n?.value, a.level)), r = w(() => `h${o.value}`), s = ic({
+  } = hd(e), a = xc(), o = C(() => lf(n?.value, a.level)), r = C(() => `h${o.value}`), s = ic({
     level: o,
     headingElement: r
   });
@@ -619,7 +619,7 @@ const nf = "lumx-dialog", {
 }), cf = "lumx-progress-circular", {
   block: uf,
   element: Gt
-} = F(cf), is = {
+} = B(cf), is = {
   size: H.m,
   display: "block"
 }, df = (e) => {
@@ -1224,7 +1224,7 @@ function Dc(e, t, n) {
     s !== r && (r = s, n?.value?.(s));
   }), en(() => {
     clearTimeout(o);
-  }), w(() => e.value || a.value);
+  }), C(() => e.value || a.value);
 }
 function Bc(e) {
   const t = tf(typeof document < "u" ? document.body : null);
@@ -1240,29 +1240,29 @@ const qf = {
   slots: n,
   attrs: a
 }) => {
-  const o = M(() => e.class), r = R(null), s = R(null), i = R(null), l = R(null), c = R(null), d = (C) => {
-    l.value = C;
-  }, u = (C) => {
-    c.value = C;
+  const o = M(() => e.class), r = R(null), s = R(null), i = R(null), l = R(null), c = R(null), d = (w) => {
+    l.value = w;
+  }, u = (w) => {
+    c.value = w;
   }, h = R(null), f = R(null);
-  rs(l, (C) => {
-    const O = C[0];
-    h.value = O ? !O.isIntersecting : null;
-  }), rs(c, (C) => {
-    const O = C[0];
-    f.value = O ? !O.isIntersecting : null;
+  rs(l, (w) => {
+    const k = w[0];
+    h.value = k ? !k.isIntersecting : null;
+  }), rs(c, (w) => {
+    const k = w[0];
+    f.value = k ? !k.isIntersecting : null;
   });
-  const g = w(() => e.preventAutoClose || e.preventCloseOnEscape), p = () => t("close");
-  ln(p, w(() => !!(e.isOpen && !g.value)));
-  const b = w(() => e.isOpen && s.value || !1);
-  Cr(b, w(() => e.focusElement)), Or(w(() => !0), w(() => {
-  }), w(() => e.parentElement), s, w(() => !!e.isOpen)), Bc(w(() => e.disableBodyScroll !== !1 && !!e.isOpen));
-  const v = Dc(w(() => !!e.isOpen), ac, w(() => (C) => t("visibilityChange", C))), y = w(() => e.isOpen || v.value || e.closeMode === "hide"), A = w(() => [s]), N = w(() => e.preventAutoClose || e.preventCloseOnClick), x = (C) => {
-    i.value = C, e.contentRef && (e.contentRef.value = C);
+  const g = C(() => e.preventAutoClose || e.preventCloseOnEscape), p = () => t("close");
+  ln(p, C(() => !!(e.isOpen && !g.value)));
+  const b = C(() => e.isOpen && s.value || !1);
+  Cr(b, C(() => e.focusElement)), Or(C(() => !0), C(() => {
+  }), C(() => e.parentElement), s, C(() => !!e.isOpen)), Bc(C(() => e.disableBodyScroll !== !1 && !!e.isOpen));
+  const v = Dc(C(() => !!e.isOpen), ac, C(() => (w) => t("visibilityChange", w))), y = C(() => e.isOpen || v.value || e.closeMode === "hide"), A = C(() => [s]), N = C(() => e.preventAutoClose || e.preventCloseOnClick), x = (w) => {
+    i.value = w, e.contentRef && (e.contentRef.value = w);
   };
   return () => {
     if (!y.value) return null;
-    const C = n.default?.() ?? [], O = C.find((_) => _.type === "header"), P = C.find((_) => _.type === "footer"), k = !!(O || P) ? C.filter((_) => _.type !== "header" && _.type !== "footer" && _.type !== pr) : C;
+    const w = n.default?.() ?? [], k = w.find((_) => _.type === "header"), P = w.find((_) => _.type === "footer"), O = !!(k || P) ? w.filter((_) => _.type !== "header" && _.type !== "footer" && _.type !== pr) : w;
     return of({
       ...a,
       ClickAwayProvider: vr,
@@ -1272,7 +1272,7 @@ const qf = {
       ProgressCircular: ff,
       className: o.value,
       clickAwayRefs: A,
-      content: k.length ? k : void 0,
+      content: O.length ? O : void 0,
       contentRef: x,
       dialogProps: e.dialogProps,
       footer: void 0,
@@ -1284,7 +1284,7 @@ const qf = {
       hasBottomIntersection: f.value,
       hasTopIntersection: h.value,
       header: void 0,
-      headerChildContent: n.header?.() ?? O?.children,
+      headerChildContent: n.header?.() ?? k?.children,
       headerChildProps: void 0,
       isLoading: e.isLoading,
       isOpen: e.isOpen,
@@ -1390,9 +1390,9 @@ function Xf() {
   ei = 1;
   var e = Wf(), t = qc(), n = Uf(), a = Gf(), o = Kf(), r = Tt(), s = Tc(), i = "[object Map]", l = "[object Object]", c = "[object Promise]", d = "[object Set]", u = "[object WeakMap]", h = "[object DataView]", f = s(e), g = s(t), p = s(n), b = s(a), v = s(o), y = r;
   return (e && y(new e(new ArrayBuffer(1))) != h || t && y(new t()) != i || n && y(n.resolve()) != c || a && y(new a()) != d || o && y(new o()) != u) && (y = function(A) {
-    var N = r(A), x = N == l ? A.constructor : void 0, C = x ? s(x) : "";
-    if (C)
-      switch (C) {
+    var N = r(A), x = N == l ? A.constructor : void 0, w = x ? s(x) : "";
+    if (w)
+      switch (w) {
         case f:
           return h;
         case g:
@@ -1485,8 +1485,8 @@ var $a, ci;
 function eh() {
   if (ci) return $a;
   ci = 1;
-  var e = Tt(), t = Tr(), n = cn(), a = "[object Arguments]", o = "[object Array]", r = "[object Boolean]", s = "[object Date]", i = "[object Error]", l = "[object Function]", c = "[object Map]", d = "[object Number]", u = "[object Object]", h = "[object RegExp]", f = "[object Set]", g = "[object String]", p = "[object WeakMap]", b = "[object ArrayBuffer]", v = "[object DataView]", y = "[object Float32Array]", A = "[object Float64Array]", N = "[object Int8Array]", x = "[object Int16Array]", C = "[object Int32Array]", O = "[object Uint8Array]", P = "[object Uint8ClampedArray]", T = "[object Uint16Array]", k = "[object Uint32Array]", _ = {};
-  _[y] = _[A] = _[N] = _[x] = _[C] = _[O] = _[P] = _[T] = _[k] = !0, _[a] = _[o] = _[b] = _[r] = _[v] = _[s] = _[i] = _[l] = _[c] = _[d] = _[u] = _[h] = _[f] = _[g] = _[p] = !1;
+  var e = Tt(), t = Tr(), n = cn(), a = "[object Arguments]", o = "[object Array]", r = "[object Boolean]", s = "[object Date]", i = "[object Error]", l = "[object Function]", c = "[object Map]", d = "[object Number]", u = "[object Object]", h = "[object RegExp]", f = "[object Set]", g = "[object String]", p = "[object WeakMap]", b = "[object ArrayBuffer]", v = "[object DataView]", y = "[object Float32Array]", A = "[object Float64Array]", N = "[object Int8Array]", x = "[object Int16Array]", w = "[object Int32Array]", k = "[object Uint8Array]", P = "[object Uint8ClampedArray]", T = "[object Uint16Array]", O = "[object Uint32Array]", _ = {};
+  _[y] = _[A] = _[N] = _[x] = _[w] = _[k] = _[P] = _[T] = _[O] = !0, _[a] = _[o] = _[b] = _[r] = _[v] = _[s] = _[i] = _[l] = _[c] = _[d] = _[u] = _[h] = _[f] = _[g] = _[p] = !1;
   function q(j) {
     return n(j) && t(j.length) && !!_[e(j)];
   }
@@ -1574,9 +1574,9 @@ const ft = (e) => {
   });
 }, sh = "ButtonRoot", ih = "lumx-button-wrapper", {
   block: lh
-} = F(ih), ch = "lumx-button", {
+} = B(ih), ch = "lumx-button", {
   block: uh
-} = F(ch), dh = (e) => {
+} = B(ch), dh = (e) => {
   const {
     color: t,
     emphasis: n,
@@ -1648,7 +1648,7 @@ _t.displayName = sh;
 _t.defaultProps = {};
 const fh = "Button", jc = "lumx-button", {
   modifier: hh
-} = F(jc), er = {
+} = B(jc), er = {
   emphasis: ve.high,
   size: H.m
 }, un = (e) => {
@@ -1679,16 +1679,16 @@ function ph() {
   return qe(mh, { state: null });
 }
 function te(e) {
-  const t = ph(), n = w(() => {
+  const t = ph(), n = C(() => {
     const r = typeof e == "function" ? e() : xt(e);
     return Sd(t, {
       disabled: r.disabled,
       isDisabled: r.isDisabled,
       "aria-disabled": r["aria-disabled"] ?? r.ariaDisabled
     });
-  }), a = w(
+  }), a = C(
     () => n.value["aria-disabled"] || n.value.disabled || void 0
-  ), o = w(() => {
+  ), o = C(() => {
     const r = typeof e == "function" ? e() : xt(e), { disabled: s, isDisabled: i, "aria-disabled": l, ariaDisabled: c, onClick: d, onChange: u, ...h } = r;
     return a.value || (d && (h.onClick = d), u && (h.onChange = u)), h;
   });
@@ -1701,7 +1701,7 @@ const hi = E({
   }
 }), gh = "Icon", vh = "lumx-icon", Hc = vh, {
   block: bh
-} = F(Hc), yh = {}, ee = (e) => {
+} = B(Hc), yh = {}, ee = (e) => {
   const {
     className: t,
     color: n,
@@ -1768,7 +1768,7 @@ const De = /* @__PURE__ */ E((e) => {
   props: $()("icon", "color", "colorVariant", "hasShape", "size", "alt", "verticalAlign", "theme", "class")
 }), Ah = "lumx-text", {
   block: Sh
-} = F(Ah), zc = (e) => {
+} = B(Ah), zc = (e) => {
   const {
     className: t,
     color: n,
@@ -1858,10 +1858,10 @@ const me = /* @__PURE__ */ E((e, {
 }) => {
   const n = D(), a = Wc(), o = pd("tooltip-label"), {
     tooltipLabel: r
-  } = wh(o), s = M(() => e.class), i = w(() => zc({
+  } = wh(o), s = M(() => e.class), i = C(() => zc({
     ...e,
     className: s.value
-  })), l = w(() => {
+  })), l = C(() => {
     const {
       children: c,
       ...d
@@ -1897,7 +1897,7 @@ const me = /* @__PURE__ */ E((e, {
     isAnyDisabled: s,
     disabledStateProps: i,
     otherProps: l
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), c = (u) => {
@@ -1937,7 +1937,7 @@ const me = /* @__PURE__ */ E((e, {
 }), pN = "Toolbar", kh = "lumx-toolbar", {
   block: Th,
   element: Da
-} = F(kh), _h = (e) => {
+} = B(kh), _h = (e) => {
   const {
     after: t,
     before: n,
@@ -1981,7 +1981,7 @@ const me = /* @__PURE__ */ E((e, {
   emit: t,
   slots: n
 }) => {
-  const a = D(), o = M(() => e.class), r = re(), s = w(() => e.id || r), i = Re(void 0), l = Re(void 0);
+  const a = D(), o = M(() => e.class), r = re(), s = C(() => e.id || r), i = Re(void 0), l = Re(void 0);
   return () => {
     const c = n.default?.(), u = c?.length === 1 && c[0].type === lc ? "p" : "div", h = {
       isOpen: e.isOpen,
@@ -2032,7 +2032,7 @@ const me = /* @__PURE__ */ E((e, {
 }), Eh = "lumx-avatar", {
   block: $h,
   element: nr
-} = F(Eh), Uc = {
+} = B(Eh), Uc = {
   size: H.m
 }, Mh = (e) => {
   const {
@@ -2144,31 +2144,31 @@ const Bh = "lumx-thumbnail", {
     disabledStateProps: A,
     size: N,
     theme: x,
-    loadingState: C,
-    variant: O,
+    loadingState: w,
+    variant: k,
     linkProps: P,
     linkAs: T,
-    handleClick: k,
+    handleClick: O,
     handleKeyPress: _,
     ...q
-  } = e, j = g || C === "isLoading", I = C === "hasError", B = I && typeof l == "string", z = I && !B, V = {};
-  B ? V.visibility = "hidden" : z && (V.display = "none");
-  const W = !!(P?.href || T), Y = !y && !!(W || k || _), ae = {
+  } = e, j = g || w === "isLoading", I = w === "hasError", F = I && typeof l == "string", V = I && !F, W = {};
+  F ? W.visibility = "hidden" : V && (W.display = "none");
+  const z = !!(P?.href || T), Y = !y && !!(z || O || _), ae = {
     ...q
   };
   Y && (Object.assign(ae, {
     as: T || (P?.href ? "a" : "button")
-  }, A), W ? Object.assign(ae, P) : ae["aria-label"] = q["aria-label"] || n);
+  }, A), z ? Object.assign(ae, P) : ae["aria-label"] = q["aria-label"] || n);
   const Z = fe.join(P?.className, r, Fh({
     [`align-${t}`]: !!t,
     [`aspect-ratio-${a}`]: !!a,
     [`size-${N}`]: !!N,
     [`theme-${x}`]: !!x,
-    [`variant-${O}`]: !!O,
+    [`variant-${k}`]: !!k,
     "is-clickable": Y,
     "has-error": I,
-    "has-icon-error-fallback": B,
-    "has-custom-error-fallback": z,
+    "has-icon-error-fallback": F,
+    "has-custom-error-fallback": V,
     "is-loading": j,
     [`object-fit-${p}`]: !!p,
     "has-badge": !!o,
@@ -2185,7 +2185,7 @@ const Bh = "lumx-thumbnail", {
       // Reserve space while loading (when possible)
       width: j ? h?.width || J?.naturalWidth : void 0,
       ...h?.style,
-      ...V,
+      ...W,
       ...c,
       ...id
     },
@@ -2200,7 +2200,7 @@ const Bh = "lumx-thumbnail", {
     loading: b
   }), null), !j && I && m("span", {
     className: Nt("fallback")
-  }, [B ? ee({
+  }, [F ? ee({
     icon: l,
     size: rt.xxs,
     theme: x
@@ -2210,7 +2210,7 @@ const Bh = "lumx-thumbnail", {
     ...ae,
     className: Z,
     children: Xr,
-    handleClick: k,
+    handleClick: O,
     handleKeyPress: _
   }) : m("div", S({
     ref: i
@@ -2241,7 +2241,7 @@ function jh(e, t) {
   }), n;
 }
 function Hh(e) {
-  const { image: t, aspectRatio: n, focusPoint: a, width: o, height: r, element: s, isLoaded: i } = e, l = w(
+  const { image: t, aspectRatio: n, focusPoint: a, width: o, height: r, element: s, isLoaded: i } = e, l = C(
     () => Rh({
       image: t.value,
       aspectRatio: n.value,
@@ -2264,7 +2264,7 @@ function Hh(e) {
       cc(d);
     },
     { immediate: !0 }
-  ), w(
+  ), C(
     () => Dh({
       image: t.value,
       aspectRatio: n.value,
@@ -2286,10 +2286,10 @@ const zh = {
     isAnyDisabled: c,
     disabledStateProps: d,
     otherProps: u
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
-  }))), h = jh(Q(() => e.image), s), f = w(() => h.value === "isLoaded"), g = Hh({
+  }))), h = jh(Q(() => e.image), s), f = C(() => h.value === "isLoaded"), g = Hh({
     image: Q(() => e.image),
     aspectRatio: Q(() => e.aspectRatio),
     focusPoint: Q(() => e.focusPoint),
@@ -2507,33 +2507,33 @@ function _r(e, t, n) {
   }
   const f = Kc(n);
   function g(N) {
-    const x = N > 0, C = Math.abs(N), O = l(), P = d(), T = x ? () => P.nextNode() : () => P.previousNode();
-    let k = null, _ = C;
-    if (O)
-      P.currentNode = O;
+    const x = N > 0, w = Math.abs(N), k = l(), P = d(), T = x ? () => P.nextNode() : () => P.previousNode();
+    let O = null, _ = w;
+    if (k)
+      P.currentNode = k;
     else if (!x) {
-      if (k = P.lastChild(), !k) return null;
+      if (O = P.lastChild(), !O) return null;
       _ -= 1;
     }
     for (let q = 0; q < _; q++) {
       const j = T();
       if (j)
-        k = j;
-      else if (O && s) {
+        O = j;
+      else if (k && s) {
         const I = x ? u() : h();
-        if (!I || I === O) break;
-        k = I, P.currentNode = I;
+        if (!I || I === k) break;
+        O = I, P.currentNode = I;
       } else
         break;
     }
-    return k;
+    return O;
   }
   function p(N) {
     const x = d(!1);
-    let C = x.nextNode();
-    for (; C; ) {
-      if (N(C)) return C;
-      C = x.nextNode();
+    let w = x.nextNode();
+    for (; w; ) {
+      if (N(w)) return w;
+      w = x.nextNode();
     }
     return null;
   }
@@ -2559,15 +2559,15 @@ function _r(e, t, n) {
         return N;
       const x = d();
       x.currentNode = N;
-      const C = x.nextNode();
-      return C instanceof HTMLElement ? C : (x.currentNode = N, x.previousNode());
+      const w = x.nextNode();
+      return w instanceof HTMLElement ? w : (x.currentNode = N, x.previousNode());
     }
   };
   function y(N) {
     const x = N(v);
     if (x && x.matches(o) && a.contains(x)) {
-      const C = l();
-      return C !== x && (C && t.onDeactivate(C), t.onActivate(x)), f.clear(), !0;
+      const w = l();
+      return w !== x && (w && t.onDeactivate(w), t.onActivate(x)), f.clear(), !0;
     }
     return f.defer(() => y(N)), !1;
   }
@@ -2625,13 +2625,13 @@ function _e(e) {
 }
 function Qh(e, t, n) {
   const { container: a, rowSelector: o, cellSelector: r, wrap: s = !1 } = e, i = Zh(t, n), l = (P) => P.querySelector(r) !== null, c = (P) => P.querySelector(r), d = (P) => Array.from(P.querySelectorAll(r));
-  function* u(P = "first", T = "next", k) {
+  function* u(P = "first", T = "next", O) {
     const _ = Lt(a, o);
     P instanceof HTMLElement ? _.currentNode = P : P === "last" && (_.currentNode = Jh(a));
     let q;
     do
       if (q = T === "next" ? _.nextNode() : _.previousNode(), q && l(q)) {
-        const j = k ? k(q) : q;
+        const j = O ? O(q) : q;
         j && (yield j);
       }
     while (q);
@@ -2644,10 +2644,10 @@ function Qh(e, t, n) {
   const p = Kc(n);
   let b = 0;
   function v(P, T) {
-    const k = d(P);
-    if (k.length === 0) return !1;
-    const _ = Math.min(T, k.length - 1);
-    return i.setActive(k[_]), !0;
+    const O = d(P);
+    if (O.length === 0) return !1;
+    const _ = Math.min(T, O.length - 1);
+    return i.setActive(O[_]), !0;
   }
   function y(P) {
     const T = g(P);
@@ -2667,33 +2667,33 @@ function Qh(e, t, n) {
     if (!i.active) return !1;
     const T = g(i.active);
     if (!T) return !1;
-    const k = d(T), _ = k.indexOf(i.active);
+    const O = d(T), _ = O.indexOf(i.active);
     if (_ === -1) return !1;
     const q = _ + P;
-    if (q >= 0 && q < k.length)
-      return b = q, i.setActive(k[q]), !0;
+    if (q >= 0 && q < O.length)
+      return b = q, i.setActive(O[q]), !0;
     if (!s) return !1;
-    const j = P > 0 ? "next" : "prev", B = _e(u(T, j)) ?? (P > 0 ? h() : f());
-    if (!B) return !1;
-    const z = d(B);
-    if (z.length === 0) return !1;
-    const V = P > 0 ? 0 : z.length - 1;
-    return b = V, i.setActive(z[V]), !0;
-  }
-  function C(P) {
+    const j = P > 0 ? "next" : "prev", F = _e(u(T, j)) ?? (P > 0 ? h() : f());
+    if (!F) return !1;
+    const V = d(F);
+    if (V.length === 0) return !1;
+    const W = P > 0 ? 0 : V.length - 1;
+    return b = W, i.setActive(V[W]), !0;
+  }
+  function w(P) {
     if (!i.active)
       return P === "next" ? A() : N();
     const T = g(i.active);
     if (!T) return !1;
-    const k = _e(u(T, P));
-    if (k) return v(k, b);
+    const O = _e(u(T, P));
+    if (O) return v(O, b);
     if (s) {
       const _ = P === "next" ? h() : f();
       if (_) return v(_, b);
     }
     return !1;
   }
-  const O = {
+  const k = {
     get activeItem() {
       return i.active;
     },
@@ -2709,18 +2709,18 @@ function Qh(e, t, n) {
   };
   return {
     type: "grid",
-    selectors: O,
+    selectors: k,
     goToOffset(P) {
       if (P === 0) return i.active !== null;
       const T = Array.from(u());
       if (T.length === 0) return !1;
       if (!i.active) {
-        const j = P > 0 ? 0 : T.length - 1, I = P > 0 ? P - 1 : P + 1, B = Math.max(0, Math.min(j + I, T.length - 1));
-        return v(T[B], b);
+        const j = P > 0 ? 0 : T.length - 1, I = P > 0 ? P - 1 : P + 1, F = Math.max(0, Math.min(j + I, T.length - 1));
+        return v(T[F], b);
       }
-      const k = g(i.active);
-      if (!k) return !1;
-      const _ = T.indexOf(k);
+      const O = g(i.active);
+      if (!O) return !1;
+      const _ = T.indexOf(O);
       if (_ === -1) return !1;
       const q = Math.max(0, Math.min(_ + P, T.length - 1));
       return q === _ ? !1 : v(T[q], b);
@@ -2729,17 +2729,17 @@ function Qh(e, t, n) {
       i.clear(), p.clear();
     },
     goTo(P) {
-      const T = P(O);
+      const T = P(k);
       return T && y(T) ? (p.clear(), !0) : (p.defer(() => this.goTo(P)), !1);
     },
     flushPendingNavigation() {
       p.flush();
     },
     goUp() {
-      return C("prev");
+      return w("prev");
     },
     goDown() {
-      return C("next");
+      return w("next");
     },
     goLeft() {
       return x(-1);
@@ -2837,42 +2837,42 @@ function tm(e, t) {
   g();
   const b = new MutationObserver((v) => {
     let y = null, A = null, N = null;
-    const x = [], C = [];
-    for (const O of v) {
-      if (O.type === "childList") {
+    const x = [], w = [];
+    for (const k of v) {
+      if (k.type === "childList") {
         if (!y)
-          for (const T of O.removedNodes) {
-            const { value: k } = vi(T, l).next();
-            if (k) {
-              y = k, A = O.nextSibling ?? O.previousSibling ?? null;
+          for (const T of k.removedNodes) {
+            const { value: O } = vi(T, l).next();
+            if (O) {
+              y = O, A = k.nextSibling ?? k.previousSibling ?? null;
               break;
             }
           }
-        for (const T of O.addedNodes)
-          for (const k of vi(T, a))
-            C.push(k);
+        for (const T of k.addedNodes)
+          for (const O of vi(T, a))
+            w.push(O);
       }
-      const P = O.target;
-      O.type === "attributes" && P.matches(a) && (O.attributeName === s && P.getAttribute(s) === "true" ? N = P : r && P.matches(r) && x.push(P));
+      const P = k.target;
+      k.type === "attributes" && P.matches(a) && (k.attributeName === s && P.getAttribute(s) === "true" ? N = P : r && P.matches(r) && x.push(P));
     }
     if (y) {
-      const O = d.hasFocus;
-      d.reset(), p(O, A);
+      const k = d.hasFocus;
+      d.reset(), p(k, A);
     }
-    if (C.length > 0) {
-      const O = n.querySelector(l) !== null;
-      f(C, O);
+    if (w.length > 0) {
+      const k = n.querySelector(l) !== null;
+      f(w, k);
     }
     if (x.length > 0) {
-      const O = u.selectors.activeItem;
-      for (const k of x)
-        h(k, "-1");
-      const T = !!(O && x.includes(O) && d.hasFocus);
+      const k = u.selectors.activeItem;
+      for (const O of x)
+        h(O, "-1");
+      const T = !!(k && x.includes(k) && d.hasFocus);
       p(T);
     }
     if (N) {
-      const O = n.querySelector(l);
-      O && O !== N && h(O, "-1"), h(N, "0");
+      const k = n.querySelector(l);
+      k && k !== N && h(k, "-1"), h(N, "0");
     }
   });
   return b.observe(n, {
@@ -2988,92 +2988,92 @@ function Xc(e, t, n) {
     loadingChange: /* @__PURE__ */ new Set(),
     loadingAnnouncement: /* @__PURE__ */ new Set()
   };
-  function v(I, B) {
-    b[I].forEach((z) => z(B));
+  function v(I, F) {
+    b[I].forEach((V) => V(F));
   }
   function y() {
     let I = 0;
-    for (const B of c.values())
-      B.lastFiltered || (I += 1);
+    for (const F of c.values())
+      F.lastFiltered || (I += 1);
     return I;
   }
   function A() {
     return y() > 0 || p > 0;
   }
   function N() {
-    for (const [V] of d)
-      gi(V, d, c);
-    const I = y(), B = o?.value ?? "";
-    (I !== h || I === 0 && B !== f) && (h = I, f = B, v("optionsChange", { optionsLength: I, inputValue: B })), i && o?.setAttribute("aria-expanded", String(A()));
+    for (const [W] of d)
+      gi(W, d, c);
+    const I = y(), F = o?.value ?? "";
+    (I !== h || I === 0 && F !== f) && (h = I, f = F, v("optionsChange", { optionsLength: I, inputValue: F })), i && o?.setAttribute("aria-expanded", String(A()));
   }
   const x = 500;
-  let C, O = !1;
+  let w, k = !1;
   function P() {
-    clearTimeout(C), p > 0 && i && (C = setTimeout(() => {
-      p > 0 && i && (O = !0, v("loadingAnnouncement", !0));
+    clearTimeout(w), p > 0 && i && (w = setTimeout(() => {
+      p > 0 && i && (k = !0, v("loadingAnnouncement", !0));
     }, x));
   }
   function T() {
     const I = p > 0;
-    g = I, v("loadingChange", I), I ? P() : (clearTimeout(C), O && (O = !1, v("loadingAnnouncement", !1)));
+    g = I, v("loadingChange", I), I ? P() : (clearTimeout(w), k && (k = !1, v("loadingAnnouncement", !1)));
   }
-  let k;
+  let O;
   function _() {
     u?.abort(), u = null, s = null;
   }
-  function q(I, B, z) {
-    function V(W) {
-      if (z?.(W)) {
-        W.stopPropagation(), W.preventDefault();
+  function q(I, F, V) {
+    function W(z) {
+      if (V?.(z)) {
+        z.stopPropagation(), z.preventDefault();
         return;
       }
       let Y = !1;
-      const { altKey: ae } = W, Z = k.focusNav;
-      switch (W.key) {
+      const { altKey: ae } = z, Z = O.focusNav;
+      switch (z.key) {
         case "Enter":
-          if (k.isOpen && Z?.selectors.activeItem) {
+          if (O.isOpen && Z?.selectors.activeItem) {
             const { activeItem: J } = Z.selectors;
             Gc(J) || J.click(), Y = !0;
-          } else k.isOpen && !k.isMultiSelect && k.setIsOpen(!1);
+          } else O.isOpen && !O.isMultiSelect && O.setIsOpen(!1);
           break;
         // Open if closed, else move focus within listbox (wrap if enabled).
         case "ArrowDown":
-          k.isOpen ? Z?.selectors.hasNavigableItems && !ae && (Z.selectors.activeItem ? Z.goDown() : Z.goTo((J) => J.getMatching(Bt) ?? J.getFirst())) : (k.setIsOpen(!0), ae || Z?.goTo((J) => J.getMatching(Bt) ?? J.getFirst())), Y = !0;
+          O.isOpen ? Z?.selectors.hasNavigableItems && !ae && (Z.selectors.activeItem ? Z.goDown() : Z.goTo((J) => J.getMatching(Bt) ?? J.getFirst())) : (O.setIsOpen(!0), ae || Z?.goTo((J) => J.getMatching(Bt) ?? J.getFirst())), Y = !0;
           break;
         // Open if closed, else move focus within listbox (wrap if enabled).
         case "ArrowUp":
-          !k.isOpen && !ae ? (k.setIsOpen(!0), Z?.goTo((J) => J.getMatching(Bt) ?? J.getLast())) : k.isOpen && Z?.selectors.hasNavigableItems && (Z.selectors.activeItem ? Z.goUp() : ae || Z.goTo((J) => J.getMatching(Bt) ?? J.getLast())), Y = !0;
+          !O.isOpen && !ae ? (O.setIsOpen(!0), Z?.goTo((J) => J.getMatching(Bt) ?? J.getLast())) : O.isOpen && Z?.selectors.hasNavigableItems && (Z.selectors.activeItem ? Z.goUp() : ae || Z.goTo((J) => J.getMatching(Bt) ?? J.getLast())), Y = !0;
           break;
         case "Escape":
-          k.isOpen ? k.setIsOpen(!1) : k.select(null), Y = !0;
+          O.isOpen ? O.setIsOpen(!1) : O.select(null), Y = !0;
           break;
         case "PageUp":
-          k.isOpen && Z?.selectors.activeItem && Z.goToOffset(-10), Y = !0;
+          O.isOpen && Z?.selectors.activeItem && Z.goToOffset(-10), Y = !0;
           break;
         case "PageDown":
-          k.isOpen && Z?.selectors.activeItem && Z.goToOffset(10), Y = !0;
+          O.isOpen && Z?.selectors.activeItem && Z.goToOffset(10), Y = !0;
           break;
       }
-      Y && (W.stopPropagation(), W.preventDefault());
+      Y && (z.stopPropagation(), z.preventDefault());
     }
-    I.addEventListener("keydown", (W) => V(W), { signal: B });
+    I.addEventListener("keydown", (z) => W(z), { signal: F });
   }
   function j() {
     if (!o) return;
     const I = !u;
     if (u || (u = new AbortController()), o.getAttribute("aria-activedescendant") || o.setAttribute("aria-activedescendant", ""), o.setAttribute("aria-expanded", String(i)), I) {
-      const B = n?.(k, u.signal) || void 0;
-      q(o, u.signal, B), o.addEventListener(
+      const F = n?.(O, u.signal) || void 0;
+      q(o, u.signal, F), o.addEventListener(
         "focusout",
         () => {
-          k.setIsOpen(!1);
+          O.setIsOpen(!1);
         },
         { signal: u.signal }
       );
     }
-    r && !s && (s = bi(k, u.signal, v, { wrapNavigation: a }));
+    r && !s && (s = bi(O, u.signal, v, { wrapNavigation: a }));
   }
-  return k = {
+  return O = {
     get trigger() {
       return o;
     },
@@ -3093,39 +3093,39 @@ function Xc(e, t, n) {
       return p > 0;
     },
     setIsOpen(I) {
-      i !== I && (i = I, I ? p > 0 && P() : (s?.clear(), clearTimeout(C), O && (O = !1, v("loadingAnnouncement", !1))), o?.setAttribute("aria-expanded", String(I && A())), v("open", I));
+      i !== I && (i = I, I ? p > 0 && P() : (s?.clear(), clearTimeout(w), k && (k = !1, v("loadingAnnouncement", !1))), o?.setAttribute("aria-expanded", String(I && A())), v("open", I));
     },
     select(I) {
-      e.onSelect?.({ value: I ? Dt(I) : "" }), I && !k.isMultiSelect && (k.focusNav?.clear(), requestAnimationFrame(() => {
-        k.setIsOpen(!1);
+      e.onSelect?.({ value: I ? Dt(I) : "" }), I && !O.isMultiSelect && (O.focusNav?.clear(), requestAnimationFrame(() => {
+        O.setIsOpen(!1);
       }));
     },
     flushPendingNavigation() {
       s?.flushPendingNavigation();
     },
-    registerOption(I, B) {
-      const z = l.toLowerCase(), V = Dt(I).toLowerCase(), W = z.length > 0 && !V.includes(z);
-      return c.set(I, { callback: B, lastFiltered: W }), B(W), N(), () => {
+    registerOption(I, F) {
+      const V = l.toLowerCase(), W = Dt(I).toLowerCase(), z = V.length > 0 && !W.includes(V);
+      return c.set(I, { callback: F, lastFiltered: z }), F(z), N(), () => {
         c.delete(I), N();
       };
     },
     setFilter(I) {
       l = I;
-      const B = I.toLowerCase();
-      for (const [z, V] of c) {
-        const W = Dt(z).toLowerCase(), Y = B.length > 0 && !W.includes(B);
-        Y !== V.lastFiltered && (V.lastFiltered = Y, V.callback(Y));
+      const F = I.toLowerCase();
+      for (const [V, W] of c) {
+        const z = Dt(V).toLowerCase(), Y = F.length > 0 && !z.includes(F);
+        Y !== W.lastFiltered && (W.lastFiltered = Y, W.callback(Y));
       }
       N();
     },
     refilterOption(I) {
-      const B = c.get(I);
-      if (!B) return;
-      const z = l.toLowerCase(), V = Dt(I).toLowerCase(), W = z.length > 0 && !V.includes(z);
-      W !== B.lastFiltered && (B.lastFiltered = W, B.callback(W), N());
+      const F = c.get(I);
+      if (!F) return;
+      const V = l.toLowerCase(), W = Dt(I).toLowerCase(), z = V.length > 0 && !W.includes(V);
+      z !== F.lastFiltered && (F.lastFiltered = z, F.callback(z), N());
     },
-    registerSection(I, B) {
-      return d.set(I, { callback: B, last: { hidden: !1, "aria-hidden": !1 } }), gi(I, d, c, !0), () => {
+    registerSection(I, F) {
+      return d.set(I, { callback: F, last: { hidden: !1, "aria-hidden": !1 } }), gi(I, d, c, !0), () => {
         d.delete(I);
       };
     },
@@ -3143,22 +3143,22 @@ function Xc(e, t, n) {
     registerListbox(I) {
       if (r === I) return () => {
       };
-      const B = !!r;
-      return r = I, o && u && (B ? (_(), j()) : s = bi(k, u.signal, v, { wrapNavigation: a })), () => {
+      const F = !!r;
+      return r = I, o && u && (F ? (_(), j()) : s = bi(O, u.signal, v, { wrapNavigation: a })), () => {
         r === I && (r = null, s = null);
       };
     },
-    subscribe(I, B) {
-      return b[I].add(B), I === "open" && i && B(!0), I === "loadingChange" && g && B(!0), () => {
-        b[I].delete(B);
+    subscribe(I, F) {
+      return b[I].add(F), I === "open" && i && F(!0), I === "loadingChange" && g && F(!0), () => {
+        b[I].delete(F);
       };
     },
     destroy() {
-      _(), o = null, r = null, l = "", h = 0, f = "", g = !1, c.clear(), d.clear(), p = 0, clearTimeout(C), O = !1;
+      _(), o = null, r = null, l = "", h = 0, f = "", g = !1, c.clear(), d.clear(), p = 0, clearTimeout(w), k = !1;
       for (const I of Object.values(b))
         I.clear();
     }
-  }, k;
+  }, O;
 }
 const nm = 500;
 function Yc(e, t, n) {
@@ -3493,7 +3493,7 @@ const vm = async (e, t, n) => {
       x: A,
       y: N,
       data: x,
-      reset: C
+      reset: w
     } = await y({
       x: d,
       y: u,
@@ -3517,11 +3517,11 @@ const vm = async (e, t, n) => {
         ...f[v],
         ...x
       }
-    }, C && g <= 50 && (g++, typeof C == "object" && (C.placement && (h = C.placement), C.rects && (c = C.rects === !0 ? await s.getElementRects({
+    }, w && g <= 50 && (g++, typeof w == "object" && (w.placement && (h = w.placement), w.rects && (c = w.rects === !0 ? await s.getElementRects({
       reference: e,
       floating: t,
       strategy: o
-    }) : C.rects), {
+    }) : w.rects), {
       x: d,
       y: u
     } = Pi(c, h, l)), b = -1);
@@ -3554,20 +3554,20 @@ const vm = async (e, t, n) => {
     const u = Qc(d), h = {
       x: n,
       y: a
-    }, f = Lr(o), g = Ir(f), p = await s.getDimensions(c), b = f === "y", v = b ? "top" : "left", y = b ? "bottom" : "right", A = b ? "clientHeight" : "clientWidth", N = r.reference[g] + r.reference[f] - h[f] - r.floating[g], x = h[f] - r.reference[f], C = await (s.getOffsetParent == null ? void 0 : s.getOffsetParent(c));
-    let O = C ? C[A] : 0;
-    (!O || !await (s.isElement == null ? void 0 : s.isElement(C))) && (O = i.floating[A] || r.floating[g]);
-    const P = N / 2 - x / 2, T = O / 2 - p[g] / 2 - 1, k = Be(u[v], T), _ = Be(u[y], T), q = k, j = O - p[g] - _, I = O / 2 - p[g] / 2 + P, B = rr(q, I, j), z = !l.arrow && de(o) != null && I !== B && r.reference[g] / 2 - (I < q ? k : _) - p[g] / 2 < 0, V = z ? I < q ? I - q : I - j : 0;
+    }, f = Lr(o), g = Ir(f), p = await s.getDimensions(c), b = f === "y", v = b ? "top" : "left", y = b ? "bottom" : "right", A = b ? "clientHeight" : "clientWidth", N = r.reference[g] + r.reference[f] - h[f] - r.floating[g], x = h[f] - r.reference[f], w = await (s.getOffsetParent == null ? void 0 : s.getOffsetParent(c));
+    let k = w ? w[A] : 0;
+    (!k || !await (s.isElement == null ? void 0 : s.isElement(w))) && (k = i.floating[A] || r.floating[g]);
+    const P = N / 2 - x / 2, T = k / 2 - p[g] / 2 - 1, O = Be(u[v], T), _ = Be(u[y], T), q = O, j = k - p[g] - _, I = k / 2 - p[g] / 2 + P, F = rr(q, I, j), V = !l.arrow && de(o) != null && I !== F && r.reference[g] / 2 - (I < q ? O : _) - p[g] / 2 < 0, W = V ? I < q ? I - q : I - j : 0;
     return {
-      [f]: h[f] + V,
+      [f]: h[f] + W,
       data: {
-        [f]: B,
-        centerOffset: I - B - V,
-        ...z && {
-          alignmentOffset: V
+        [f]: F,
+        centerOffset: I - F - W,
+        ...V && {
+          alignmentOffset: W
         }
       },
-      reset: z
+      reset: V
     };
   }
 });
@@ -3605,32 +3605,32 @@ const Am = function(e) {
       const N = [b[Ae(y)], b[A[0]], b[A[1]]], x = [...((a = s.autoPlacement) == null ? void 0 : a.overflows) || [], {
         placement: y,
         overflows: N
-      }], C = p[v + 1];
-      if (C)
+      }], w = p[v + 1];
+      if (w)
         return {
           data: {
             index: v + 1,
             overflows: x
           },
           reset: {
-            placement: C
+            placement: w
           }
         };
-      const O = x.map((k) => {
-        const _ = de(k.placement);
-        return [k.placement, _ && d ? (
+      const k = x.map((O) => {
+        const _ = de(O.placement);
+        return [O.placement, _ && d ? (
           // Check along the mainAxis and main crossAxis side.
-          k.overflows.slice(0, 2).reduce((q, j) => q + j, 0)
+          O.overflows.slice(0, 2).reduce((q, j) => q + j, 0)
         ) : (
           // Check only the mainAxis.
-          k.overflows[0]
-        ), k.overflows];
-      }).sort((k, _) => k[1] - _[1]), T = ((o = O.filter((k) => k[2].slice(
+          O.overflows[0]
+        ), O.overflows];
+      }).sort((O, _) => O[1] - _[1]), T = ((o = k.filter((O) => O[2].slice(
         0,
         // Aligned placements should not check their opposite crossAxis
         // side.
-        de(k[0]) ? 2 : 3
-      ).every((_) => _ <= 0))[0]) == null ? void 0 : o[0]) || O[0][0];
+        de(O[0]) ? 2 : 3
+      ).every((_) => _ <= 0))[0]) == null ? void 0 : o[0]) || k[0][0];
       return T !== i ? {
         data: {
           index: v + 1,
@@ -3666,57 +3666,57 @@ const Am = function(e) {
       } = Qe(e, t);
       if ((n = r.arrow) != null && n.alignmentOffset)
         return {};
-      const v = Ae(o), y = Ce(i), A = Ae(i) === i, N = await (l.isRTL == null ? void 0 : l.isRTL(c.floating)), x = h || (A || !p ? [Zt(i)] : um(i)), C = g !== "none";
-      !h && C && x.push(...mm(i, p, g, N));
-      const O = [i, ...x], P = await l.detectOverflow(t, b), T = [];
-      let k = ((a = r.flip) == null ? void 0 : a.overflows) || [];
+      const v = Ae(o), y = Ce(i), A = Ae(i) === i, N = await (l.isRTL == null ? void 0 : l.isRTL(c.floating)), x = h || (A || !p ? [Zt(i)] : um(i)), w = g !== "none";
+      !h && w && x.push(...mm(i, p, g, N));
+      const k = [i, ...x], P = await l.detectOverflow(t, b), T = [];
+      let O = ((a = r.flip) == null ? void 0 : a.overflows) || [];
       if (d && T.push(P[v]), u) {
         const I = Jc(o, s, N);
         T.push(P[I[0]], P[I[1]]);
       }
-      if (k = [...k, {
+      if (O = [...O, {
         placement: o,
         overflows: T
       }], !T.every((I) => I <= 0)) {
         var _, q;
-        const I = (((_ = r.flip) == null ? void 0 : _.index) || 0) + 1, B = O[I];
-        if (B && (!(u === "alignment" ? y !== Ce(B) : !1) || // We leave the current main axis only if every placement on that axis
+        const I = (((_ = r.flip) == null ? void 0 : _.index) || 0) + 1, F = k[I];
+        if (F && (!(u === "alignment" ? y !== Ce(F) : !1) || // We leave the current main axis only if every placement on that axis
         // overflows the main axis.
-        k.every((W) => Ce(W.placement) === y ? W.overflows[0] > 0 : !0)))
+        O.every((z) => Ce(z.placement) === y ? z.overflows[0] > 0 : !0)))
           return {
             data: {
               index: I,
-              overflows: k
+              overflows: O
             },
             reset: {
-              placement: B
+              placement: F
             }
           };
-        let z = (q = k.filter((V) => V.overflows[0] <= 0).sort((V, W) => V.overflows[1] - W.overflows[1])[0]) == null ? void 0 : q.placement;
-        if (!z)
+        let V = (q = O.filter((W) => W.overflows[0] <= 0).sort((W, z) => W.overflows[1] - z.overflows[1])[0]) == null ? void 0 : q.placement;
+        if (!V)
           switch (f) {
             case "bestFit": {
               var j;
-              const V = (j = k.filter((W) => {
-                if (C) {
-                  const Y = Ce(W.placement);
+              const W = (j = O.filter((z) => {
+                if (w) {
+                  const Y = Ce(z.placement);
                   return Y === y || // Create a bias to the `y` side axis due to horizontal
                   // reading directions favoring greater width.
                   Y === "y";
                 }
                 return !0;
-              }).map((W) => [W.placement, W.overflows.filter((Y) => Y > 0).reduce((Y, ae) => Y + ae, 0)]).sort((W, Y) => W[1] - Y[1])[0]) == null ? void 0 : j[0];
-              V && (z = V);
+              }).map((z) => [z.placement, z.overflows.filter((Y) => Y > 0).reduce((Y, ae) => Y + ae, 0)]).sort((z, Y) => z[1] - Y[1])[0]) == null ? void 0 : j[0];
+              W && (V = W);
               break;
             }
             case "initialPlacement":
-              z = i;
+              V = i;
               break;
           }
-        if (o !== z)
+        if (o !== V)
           return {
             reset: {
-              placement: z
+              placement: V
             }
           };
       }
@@ -3851,16 +3851,16 @@ const xm = function(e) {
       } = r.floating;
       let b, v;
       u === "top" || u === "bottom" ? (b = u, v = h === (await (s.isRTL == null ? void 0 : s.isRTL(i.floating)) ? "start" : "end") ? "left" : "right") : (v = u, b = h === "end" ? "top" : "bottom");
-      const y = p - d.top - d.bottom, A = g - d.left - d.right, N = Be(p - d[b], y), x = Be(g - d[v], A), C = !t.middlewareData.shift;
-      let O = N, P = x;
-      if ((n = t.middlewareData.shift) != null && n.enabled.x && (P = A), (a = t.middlewareData.shift) != null && a.enabled.y && (O = y), C && !h) {
-        const k = le(d.left, 0), _ = le(d.right, 0), q = le(d.top, 0), j = le(d.bottom, 0);
-        f ? P = g - 2 * (k !== 0 || _ !== 0 ? k + _ : le(d.left, d.right)) : O = p - 2 * (q !== 0 || j !== 0 ? q + j : le(d.top, d.bottom));
+      const y = p - d.top - d.bottom, A = g - d.left - d.right, N = Be(p - d[b], y), x = Be(g - d[v], A), w = !t.middlewareData.shift;
+      let k = N, P = x;
+      if ((n = t.middlewareData.shift) != null && n.enabled.x && (P = A), (a = t.middlewareData.shift) != null && a.enabled.y && (k = y), w && !h) {
+        const O = le(d.left, 0), _ = le(d.right, 0), q = le(d.top, 0), j = le(d.bottom, 0);
+        f ? P = g - 2 * (O !== 0 || _ !== 0 ? O + _ : le(d.left, d.right)) : k = p - 2 * (q !== 0 || j !== 0 ? q + j : le(d.top, d.bottom));
       }
       await l({
         ...t,
         availableWidth: P,
-        availableHeight: O
+        availableHeight: k
       });
       const T = await s.getDimensions(i.floating);
       return g !== T.width || p !== T.height ? {
@@ -4298,16 +4298,16 @@ function Zm(e, t) {
       threshold: le(0, Be(1, l)) || 1
     };
     let N = !0;
-    function x(C) {
-      const O = C[0].intersectionRatio;
-      if (O !== l) {
+    function x(w) {
+      const k = w[0].intersectionRatio;
+      if (k !== l) {
         if (!N)
           return s();
-        O ? s(!1, O) : a = setTimeout(() => {
+        k ? s(!1, k) : a = setTimeout(() => {
           s(!1, 1e-7);
         }, 1e3);
       }
-      O === 1 && !su(c, e.getBoundingClientRect()) && s(), N = !1;
+      k === 1 && !su(c, e.getBoundingClientRect()) && s(), N = !1;
     }
     try {
       n = new IntersectionObserver(x, {
@@ -4393,29 +4393,29 @@ function Ti(e, t) {
 }
 function uu(e, t, n) {
   n === void 0 && (n = {});
-  const a = n.whileElementsMounted, o = w(() => {
-    var O;
-    return (O = vt(n.open)) != null ? O : !0;
-  }), r = w(() => vt(n.middleware)), s = w(() => {
-    var O;
-    return (O = vt(n.placement)) != null ? O : "bottom";
-  }), i = w(() => {
-    var O;
-    return (O = vt(n.strategy)) != null ? O : "absolute";
-  }), l = w(() => {
-    var O;
-    return (O = vt(n.transform)) != null ? O : !0;
-  }), c = w(() => ki(e.value)), d = w(() => ki(t.value)), u = R(0), h = R(0), f = R(i.value), g = R(s.value), p = Re({}), b = R(!1), v = w(() => {
-    const O = {
+  const a = n.whileElementsMounted, o = C(() => {
+    var k;
+    return (k = vt(n.open)) != null ? k : !0;
+  }), r = C(() => vt(n.middleware)), s = C(() => {
+    var k;
+    return (k = vt(n.placement)) != null ? k : "bottom";
+  }), i = C(() => {
+    var k;
+    return (k = vt(n.strategy)) != null ? k : "absolute";
+  }), l = C(() => {
+    var k;
+    return (k = vt(n.transform)) != null ? k : !0;
+  }), c = C(() => ki(e.value)), d = C(() => ki(t.value)), u = R(0), h = R(0), f = R(i.value), g = R(s.value), p = Re({}), b = R(!1), v = C(() => {
+    const k = {
       position: f.value,
       left: "0",
       top: "0"
     };
     if (!d.value)
-      return O;
+      return k;
     const P = Ti(d.value, u.value), T = Ti(d.value, h.value);
     return l.value ? {
-      ...O,
+      ...k,
       transform: "translate(" + P + "px, " + T + "px)",
       ...cu(d.value) >= 1.5 && {
         willChange: "transform"
@@ -4430,13 +4430,13 @@ function uu(e, t, n) {
   function A() {
     if (c.value == null || d.value == null)
       return;
-    const O = o.value;
+    const k = o.value;
     ap(c.value, d.value, {
       middleware: r.value,
       placement: s.value,
       strategy: i.value
     }).then((P) => {
-      u.value = P.x, h.value = P.y, f.value = P.strategy, g.value = P.placement, p.value = P.middlewareData, b.value = O !== !1;
+      u.value = P.x, h.value = P.y, f.value = P.strategy, g.value = P.placement, p.value = P.middlewareData, b.value = k !== !1;
     });
   }
   function N() {
@@ -4452,14 +4452,14 @@ function uu(e, t, n) {
       return;
     }
   }
-  function C() {
+  function w() {
     o.value || (b.value = !1);
   }
   return X([r, s, i, o], A, {
     flush: "sync"
   }), X([c, d], x, {
     flush: "sync"
-  }), X(o, C, {
+  }), X(o, w, {
     flush: "sync"
   }), rc() && mr(N), {
     x: nt(u),
@@ -4480,7 +4480,7 @@ const rp = 8, du = 1e4, qt = {
 }, sp = "Tooltip", fu = "lumx-tooltip", {
   block: ip,
   element: _i
-} = F(fu), Dr = (e) => {
+} = B(fu), Dr = (e) => {
   const {
     id: t,
     label: n,
@@ -4620,7 +4620,7 @@ function mp(e) {
 const gn = /* @__PURE__ */ E((e, {
   slots: t
 }) => {
-  const n = re(), a = M(() => e.class), o = R(null), r = R(null), s = w(() => e.placement || qt.placement), i = w(() => e.closeMode || qt.closeMode), l = w(() => e.ariaLinkMode || qt.ariaLinkMode), c = w(() => e.zIndex || qt.zIndex), {
+  const n = re(), a = M(() => e.class), o = R(null), r = R(null), s = C(() => e.placement || qt.placement), i = C(() => e.closeMode || qt.closeMode), l = C(() => e.ariaLinkMode || qt.ariaLinkMode), c = C(() => e.zIndex || qt.zIndex), {
     floatingStyles: d,
     placement: u
   } = uu(o, r, {
@@ -4631,8 +4631,8 @@ const gn = /* @__PURE__ */ E((e, {
     isOpen: h,
     onPopperMount: f,
     manager: g
-  } = dp(w(() => e.delay), o), p = w(() => (h.value || e.forceOpen) && !!e.label), b = w(() => !!e.label && (p.value || i.value === "hide")), v = w(() => !p.value && i.value === "hide");
-  return ln(w(() => p.value ? () => g.value?.close() : void 0)), Ph(), () => {
+  } = dp(C(() => e.delay), o), p = C(() => (h.value || e.forceOpen) && !!e.label), b = C(() => !!e.label && (p.value || i.value === "hide")), v = C(() => !p.value && i.value === "hide");
+  return ln(C(() => p.value ? () => g.value?.close() : void 0)), Ph(), () => {
     let y;
     const A = u.value ?? s.value, N = hp({
       slotContent: t.default?.(),
@@ -4646,8 +4646,8 @@ const gn = /* @__PURE__ */ E((e, {
     });
     return m(ne, null, [N, b.value && m(tn, null, mp(y = Dr({
       ref: (x) => {
-        const C = x?.$el || x;
-        r.value = C, f(C);
+        const w = x?.$el || x;
+        r.value = w, f(w);
       },
       id: n,
       label: e.label,
@@ -4674,7 +4674,7 @@ const gn = /* @__PURE__ */ E((e, {
     isAnyDisabled: i,
     disabledStateProps: l,
     otherProps: c
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), d = (f) => {
@@ -4947,7 +4947,7 @@ function Np(e, t) {
 }
 const gu = "lumx-text-field", vu = `${gu}__input-native`, {
   block: Pp
-} = F(vu), xp = {
+} = B(vu), xp = {
   type: "text"
 }, wp = (e) => {
   const {
@@ -5020,7 +5020,7 @@ const gu = "lumx-text-field", vu = `${gu}__input-native`, {
   emits: Cp
 }), {
   block: kp
-} = F(vu), bu = {
+} = B(vu), bu = {
   rows: 2
 }, Tp = (e) => {
   const {
@@ -5087,7 +5087,7 @@ const Ip = {
 }, Lp = /* @__PURE__ */ E((e, {
   emit: t
 }) => {
-  const n = D(), a = U(), o = M(() => e.class), r = R(null), s = _p(w(() => e.rows ?? bu.rows), r, w(() => e.value)), i = (u, h, f) => {
+  const n = D(), a = U(), o = M(() => e.class), r = R(null), s = _p(C(() => e.rows ?? bu.rows), r, C(() => e.value)), i = (u, h, f) => {
     f?.stopImmediatePropagation(), t("change", u, h, f);
   }, l = (u, h, f) => {
     t("input", u, h, f);
@@ -5119,7 +5119,7 @@ function Ep(e) {
 }
 const $p = "InputLabel", Mp = "lumx-input-label", yu = Mp, {
   block: Rp
-} = F(yu), Dp = {};
+} = B(yu), Dp = {};
 function Ve(e) {
   const {
     children: t,
@@ -5154,7 +5154,7 @@ const Bp = {
   [ie.warning]: { color: "yellow" }
 }, Fp = "InputHelper", qp = "lumx-input-helper", Au = qp, {
   block: jp
-} = F(Au), Su = {
+} = B(Au), Su = {
   kind: ie.info
 };
 function Oe(e) {
@@ -5183,7 +5183,7 @@ Oe.defaultProps = Su;
 const {
   block: Hp,
   element: ue
-} = F(gu);
+} = B(gu);
 function zp(e, t, n, a, o) {
   const r = e ? `text-field-helper-${n}` : void 0, s = t ? `text-field-error-${n}` : void 0, i = o ? `text-field-label-${n}` : void 0, l = [s, r, a].filter(Boolean), c = l.length === 0 ? void 0 : l.join(" ");
   return {
@@ -5213,89 +5213,87 @@ const Vp = (e) => {
     multiline: b,
     placeholder: v,
     textFieldRef: y,
-    charCounterMessage: A,
-    helperId: N,
-    errorId: x,
-    labelId: C,
-    theme: O,
-    value: P,
-    afterElement: T,
-    input: k,
-    isFocus: _,
-    IconButton: q,
-    ref: j
-  } = e, I = (P || "").length, B = I > 0, z = p ? p - I : 0, V = p ? m("span", {
-    className: ue("char-counter"),
-    role: "status"
-  }, [A ? A(z) : z, z === 0 && ee({
-    icon: wt,
-    size: H.xxs
-  })]) : void 0;
+    helperId: A,
+    errorId: N,
+    labelId: x,
+    theme: w,
+    value: k,
+    afterElement: P,
+    input: T,
+    isFocus: O,
+    IconButton: _,
+    ref: q
+  } = e, j = (k || "").length, I = j > 0;
   return m("div", {
-    ref: j,
+    ref: q,
     className: L(n, Hp({
       "has-chips": !!t,
       "has-error": !u && s,
       "has-icon": !!l,
       "has-input": !b,
-      "has-input-clear": !!(a && B),
+      "has-input-clear": !!(a && I),
       "has-label": !!h,
       "has-placeholder": !!v,
       "has-textarea": b,
-      "has-value": !!P,
+      "has-value": !!k,
       "is-disabled": g,
-      "is-focus": _ || r,
+      "is-focus": O || r,
       "is-valid": u,
-      [`theme-${O}`]: !!O
+      [`theme-${w}`]: !!w
     }))
   }, [(h || p) && m("div", {
     className: ue("header")
-  }, [Ve({
+  }, [h && Ve({
     ...f,
-    id: C,
+    id: x,
     htmlFor: c,
     className: ue("label"),
     isRequired: d,
-    theme: O,
-    children: [h, V]
-  })]), m("div", {
+    theme: w,
+    children: h
+  }), p && m("div", {
+    className: ue("char-counter")
+  }, [m("span", null, [p - j]), p - j === 0 && ee({
+    icon: wt,
+    size: H.xxs
+  })])]), m("div", {
     className: ue("wrapper"),
     ref: y
   }, [l && ee({
     className: ue("input-icon"),
-    color: O === he.dark ? "light" : void 0,
+    color: w === he.dark ? "light" : void 0,
     icon: l,
     size: H.xs
   }), t ? m("div", {
     className: ue("chips")
-  }, [t, k]) : m("div", {
+  }, [t, T]) : m("div", {
     className: ue("input-wrapper")
-  }, [k]), (u || s) && ee({
+  }, [T]), (u || s) && ee({
     className: ue("input-validity"),
-    color: O === he.dark ? "light" : void 0,
+    color: w === he.dark ? "light" : void 0,
     icon: u ? br : wt,
     size: H.xxs
-  }), a && B && !g && m(q, S({
-    "aria-describedby": C
+  }), a && I && !g && m(_, S({
+    "aria-describedby": x
   }, a, {
     className: ue("input-clear"),
     icon: Nd,
     emphasis: ve.low,
     size: H.s,
-    theme: O,
+    theme: w,
     type: "button"
-  }), null), T && m("div", {
+  }), null), P && m("div", {
     className: ue("after-element")
-  }, [T])]), s && o && Oe({
+  }, [P])]), s && o && Oe({
     children: o,
     className: ue("helper"),
     kind: ie.error,
-    theme: O,
-    id: x
+    theme: w,
+    id: N
   }), i && Oe({
     className: ue("helper"),
-    theme: O,
-    id: N,
+    theme: w,
+    id: A,
     children: i
   })]);
 }, Wp = {
@@ -5312,10 +5310,10 @@ const Vp = (e) => {
 }, Up = /* @__PURE__ */ E((e, {
   emit: t
 }) => {
-  const n = D(), a = Wc("chips"), o = U(), r = M(() => e.class), s = re(), i = w(() => e.id || s), l = R(!1), {
+  const n = D(), a = Wc("chips"), o = U(), r = M(() => e.class), s = re(), i = C(() => e.id || s), l = R(!1), {
     isAnyDisabled: c,
     disabledStateProps: d
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...n
   }))), u = R(null);
@@ -5325,7 +5323,7 @@ const Vp = (e) => {
   }, {
     flush: "sync"
   });
-  const h = w(() => zp(e.helper, e.error, s, n["aria-describedby"] || void 0, e.label)), f = (y, A, N) => {
+  const h = C(() => zp(e.helper, e.error, s, n["aria-describedby"] || void 0, e.label)), f = (y, A, N) => {
     t("change", y, A, N);
   }, g = (y, A, N) => {
     t("input", y, A, N);
@@ -5341,20 +5339,20 @@ const Vp = (e) => {
       helperId: A,
       errorId: N,
       describedById: x,
-      labelId: C
+      labelId: w
     } = h.value, {
-      class: O,
+      class: k,
       className: P,
       "aria-describedby": T,
-      disabled: k,
+      disabled: O,
       isDisabled: _,
       "aria-disabled": q,
       ariaDisabled: j,
       onChange: I,
-      onInput: B,
-      onFocus: z,
-      onBlur: V,
-      chips: W,
+      onInput: F,
+      onFocus: V,
+      onBlur: W,
+      chips: z,
       ...Y
     } = n, ae = {
       ...Y,
@@ -5381,7 +5379,7 @@ const Vp = (e) => {
       type: e.type || "text"
     }), null);
     return m(Vp, {
-      chips: (a() ?? W) || void 0,
+      chips: (a() ?? z) || void 0,
       error: e.error,
       forceFocusStyle: e.forceFocusStyle,
       hasError: e.hasError,
@@ -5393,7 +5391,6 @@ const Vp = (e) => {
       label: e.label,
       labelProps: e.labelProps,
       maxLength: e.maxLength,
-      charCounterMessage: e.charCounterMessage,
       multiline: e.multiline,
       placeholder: e.placeholder,
       value: e.value,
@@ -5402,7 +5399,7 @@ const Vp = (e) => {
       id: i.value,
       isAnyDisabled: c.value,
       helperId: A,
-      labelId: C,
+      labelId: w,
       errorId: N,
       isFocus: l.value,
       input: Z,
@@ -5417,7 +5414,7 @@ const Vp = (e) => {
 }, {
   name: "LumxTextField",
   inheritAttrs: !1,
-  props: $()("class", "theme", "value", "error", "forceFocusStyle", "hasError", "afterElement", "helper", "icon", "isRequired", "isValid", "label", "labelProps", "maxLength", "charCounterMessage", "isDisabled", "disabled", "multiline", "placeholder", "aria-disabled", "id", "clearButtonProps", "name", "type", "minimumRows", "inputRef", "textFieldRef"),
+  props: $()("class", "theme", "value", "error", "forceFocusStyle", "hasError", "afterElement", "helper", "icon", "isRequired", "isValid", "label", "labelProps", "maxLength", "isDisabled", "disabled", "multiline", "placeholder", "aria-disabled", "id", "clearButtonProps", "name", "type", "minimumRows", "inputRef", "textFieldRef"),
   emits: Wp
 }), Gp = /* @__PURE__ */ E((e, {
   emit: t,
@@ -5463,19 +5460,19 @@ const Vp = (e) => {
       class: A,
       ...N
     } = e, x = {
-      onChange: (P, T, k) => t("change", P, T, k),
+      onChange: (P, T, O) => t("change", P, T, O),
       onInput: (P) => t("change", P),
       onFocus: (P) => t("focus", P),
       onBlur: (P) => t("blur", P),
       onClear: (P) => t("clear", P)
     }, {
-      ariaDisabled: C,
-      ...O
+      ariaDisabled: w,
+      ...k
     } = N;
     return Sp({
       ...n,
-      ...O,
-      "aria-disabled": C ?? n.ariaDisabled,
+      ...k,
+      "aria-disabled": w ?? n.ariaDisabled,
       ...x,
       listboxId: o,
       isOpen: l.value && (!!u.value?.optionsLength || h.value),
@@ -5497,7 +5494,7 @@ const Vp = (e) => {
 }, {
   name: "LumxComboboxInput",
   inheritAttrs: !1,
-  props: $()("class", "theme", "value", "error", "forceFocusStyle", "hasError", "afterElement", "helper", "icon", "isRequired", "isValid", "label", "labelProps", "maxLength", "charCounterMessage", "isDisabled", "disabled", "aria-disabled", "multiline", "placeholder", "id", "clearButtonProps", "name", "type", "minimumRows", "inputRef", "textFieldRef", "toggleButtonProps", "onSelect", "filter", "openOnFocus", "selectionMode"),
+  props: $()("class", "theme", "value", "error", "forceFocusStyle", "hasError", "afterElement", "helper", "icon", "isRequired", "isValid", "label", "labelProps", "maxLength", "isDisabled", "disabled", "aria-disabled", "multiline", "placeholder", "id", "clearButtonProps", "name", "type", "minimumRows", "inputRef", "textFieldRef", "toggleButtonProps", "onSelect", "filter", "openOnFocus", "selectionMode"),
   emits: {
     select: (e) => !!e,
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -5511,7 +5508,7 @@ const Vp = (e) => {
   }
 }), Kp = "List", Nu = "lumx-list", {
   block: Xp
-} = F(Nu), Yp = {}, pt = (e) => {
+} = B(Nu), Yp = {}, pt = (e) => {
   const {
     children: t,
     className: n,
@@ -5599,7 +5596,7 @@ const ng = /* @__PURE__ */ E((e, {
 }), ag = "ListItem", xu = "lumx-list-item", {
   block: og,
   element: jt
-} = F(xu), wu = {
+} = B(xu), wu = {
   size: H.regular
 }, tt = (e) => {
   const {
@@ -5674,7 +5671,7 @@ function rg(e) {
 const sg = "lumx-combobox-option", {
   block: ig,
   element: Ii
-} = F(sg), lg = (e, {
+} = B(sg), lg = (e, {
   Tooltip: t
 } = {}) => {
   const {
@@ -5710,7 +5707,7 @@ const sg = "lumx-combobox-option", {
     "aria-disabled": d ? "true" : void 0,
     role: A,
     children: o
-  }), C = t && b && !l ? m(t, b, rg(x) ? x : {
+  }), w = t && b && !l ? m(t, b, rg(x) ? x : {
     default: () => [x]
   }) : x;
   return tt({
@@ -5722,7 +5719,7 @@ const sg = "lumx-combobox-option", {
     before: n,
     after: a,
     role: N,
-    children: m(ne, null, [C, s && m("p", S({
+    children: m(ne, null, [w, s && m("p", S({
       id: i
     }, zc({
       className: Ii("description"),
@@ -5854,7 +5851,7 @@ function pg(e) {
 const gg = "lumx-combobox-option-more-info", {
   block: vg,
   element: bg
-} = F(gg), yg = (e, {
+} = B(gg), yg = (e, {
   IconButton: t,
   Popover: n
 }) => {
@@ -5917,7 +5914,7 @@ function Pg(e) {
 const xg = "lumx-popover", {
   block: wg,
   element: Cg
-} = F(xg), Wt = {
+} = B(xg), Wt = {
   closeMode: "unmount",
   elevation: 3,
   placement: Ag.AUTO,
@@ -5948,8 +5945,8 @@ const xg = "lumx-popover", {
     unmountSentinel: N,
     // Forwarded props
     ...x
-  } = e, C = !d && i === "hide", O = d || i === "hide", P = o, T = Math.min(l || 0, 5);
-  return O ? m(t, {
+  } = e, w = !d && i === "hide", k = d || i === "hide", P = o, T = Math.min(l || 0, 5);
+  return k ? m(t, {
     enabled: v
   }, {
     default: () => [m(P, S(x, {
@@ -5958,20 +5955,20 @@ const xg = "lumx-popover", {
         [`theme-${g}`]: !!g,
         [`elevation-${T}`]: !!T,
         [`position-${u}`]: !!u,
-        "is-hidden": !!C
+        "is-hidden": !!w
       })),
-      hidden: C || void 0,
-      style: C ? void 0 : h,
+      hidden: w || void 0,
+      style: w ? void 0 : h,
       "data-popper-placement": u
     }), {
       default: () => [N, m(n, {
-        callback: !C && y,
+        callback: !w && y,
         childrenRefs: A
       }, {
         default: () => [c && m("div", {
           ref: b,
           className: Cg("arrow"),
-          style: C ? void 0 : f
+          style: w ? void 0 : f
         }, [m("svg", {
           viewBox: "0 0 14 14",
           "aria-hidden": !0
@@ -6015,17 +6012,17 @@ function Ig(e) {
     boundary: u,
     parsedPlacement: h,
     arrowElement: f
-  } = e, g = ot(r), p = ot(s), b = ot(i), v = ot(l), y = ot(c), A = ot(d), N = [], x = (t?.away ?? 0) + (n ? qa : 0), C = t?.along ?? 0;
-  return N.push(lu({ mainAxis: x, crossAxis: C })), h.isAuto ? N.push(
+  } = e, g = ot(r), p = ot(s), b = ot(i), v = ot(l), y = ot(c), A = ot(d), N = [], x = (t?.away ?? 0) + (n ? qa : 0), w = t?.along ?? 0;
+  return N.push(lu({ mainAxis: x, crossAxis: w })), h.isAuto ? N.push(
     Jm({ ...u ? { boundary: u } : {}, alignment: h.autoAlignment })
   ) : (N.push(ep(u ? { boundary: u } : {})), N.push(Qm(u ? { boundary: u } : {}))), (a || o || g || p || b || v || y || A) && N.push(
     tp({
       ...u ? { boundary: u } : {},
-      apply({ availableHeight: P, rects: T, elements: k }) {
+      apply({ availableHeight: P, rects: T, elements: O }) {
         const _ = `${T.reference.width}px`;
-        k.floating.style.width = g || (a === "width" ? _ : ""), k.floating.style.minWidth = _g(p, a === "minWidth" ? _ : ""), k.floating.style.maxWidth = Li(b, a === "maxWidth" ? _ : ""), k.floating.style.height = v || "", k.floating.style.minHeight = y || "";
+        O.floating.style.width = g || (a === "width" ? _ : ""), O.floating.style.minWidth = _g(p, a === "minWidth" ? _ : ""), O.floating.style.maxWidth = Li(b, a === "maxWidth" ? _ : ""), O.floating.style.height = v || "", O.floating.style.minHeight = y || "";
         const q = `${Math.max(0, P - qa)}px`;
-        k.floating.style.maxHeight = Li(
+        O.floating.style.maxHeight = Li(
           A,
           o ? q : ""
         );
@@ -6044,7 +6041,7 @@ function Eg(e) {
   return e.isAuto ? void 0 : e.floatingPlacement;
 }
 function $g(e) {
-  const t = R(), n = R(), a = w(() => kg(e.placement?.value)), o = w(() => Tg(e.fitToAnchorWidth?.value)), r = w(
+  const t = R(), n = R(), a = C(() => kg(e.placement?.value)), o = C(() => Tg(e.fitToAnchorWidth?.value)), r = C(
     () => Ig({
       offset: e.offset?.value,
       hasArrow: e.hasArrow?.value,
@@ -6060,7 +6057,7 @@ function $g(e) {
       parsedPlacement: a.value,
       arrowElement: n.value
     })
-  ), s = w(() => Eg(a.value)), {
+  ), s = C(() => Eg(a.value)), {
     floatingStyles: i,
     placement: l,
     isPositioned: c,
@@ -6069,9 +6066,9 @@ function $g(e) {
     placement: s,
     whileElementsMounted: iu,
     middleware: r
-  }), u = w(
+  }), u = C(
     () => l.value ?? e.placement?.value
-  ), h = w(() => Lg(d.value?.arrow)), f = w(() => ({
+  ), h = C(() => Lg(d.value?.arrow)), f = C(() => ({
     ...e.style?.value || {},
     ...i.value,
     zIndex: e.zIndex?.value
@@ -6098,7 +6095,7 @@ const Rg = {
   slots: n,
   attrs: a
 }) => {
-  const o = M(() => e.class), r = w(() => xt(e.anchorRef)), s = Q(e, "focusElement"), {
+  const o = M(() => e.class), r = C(() => xt(e.anchorRef)), s = Q(e, "focusElement"), {
     styles: i,
     isPositioned: l,
     position: c,
@@ -6106,7 +6103,7 @@ const Rg = {
     arrowRef: u
   } = $g({
     anchorRef: r,
-    boundaryRef: w(() => xt(e.boundaryRef)),
+    boundaryRef: C(() => xt(e.boundaryRef)),
     offset: Q(e, "offset"),
     hasArrow: Q(e, "hasArrow"),
     fitToAnchorWidth: Q(e, "fitToAnchorWidth"),
@@ -6117,21 +6114,21 @@ const Rg = {
     height: Q(e, "height"),
     minHeight: Q(e, "minHeight"),
     maxHeight: Q(e, "maxHeight"),
-    placement: w(() => e.placement || Wt.placement),
-    style: w(() => {
+    placement: C(() => e.placement || Wt.placement),
+    style: C(() => {
     }),
-    zIndex: w(() => e.zIndex ?? Ng)
+    zIndex: C(() => e.zIndex ?? Ng)
   });
-  Or(w(() => e.focusAnchorOnClose ?? !0), r, w(() => e.parentElement), d, w(() => !!e.isOpen));
+  Or(C(() => e.focusAnchorOnClose ?? !0), r, C(() => e.parentElement), d, C(() => !!e.isOpen));
   const h = () => {
     t("close");
   };
-  ln(w(() => h), w(() => !!(e.isOpen && e.closeOnEscape)));
-  const f = w(() => !e.withFocusTrap && !!e.isOpen && l.value);
+  ln(C(() => h), C(() => !!(e.isOpen && e.closeOnEscape)));
+  const f = C(() => !e.withFocusTrap && !!e.isOpen && l.value);
   Mg(s, f);
-  const g = w(() => !e.withFocusTrap || !e.isOpen ? !1 : e.focusTrapZoneElement || d.value || !1);
+  const g = C(() => !e.withFocusTrap || !e.isOpen ? !1 : e.focusTrapZoneElement || d.value || !1);
   Cr(g, s);
-  const p = w(() => [d, r]);
+  const p = C(() => [d, r]);
   return () => Og({
     ...a,
     as: e.as,
@@ -6167,7 +6164,7 @@ function Dg(e) {
 const ku = /* @__PURE__ */ E((e, {
   slots: t
 }) => {
-  const n = M(() => e.class), a = R(null), o = w(() => a.value?.$el ?? void 0), r = R(!1), {
+  const n = M(() => e.class), a = R(null), o = C(() => a.value?.$el ?? void 0), r = R(!1), {
     optionId: s
   } = ug(), i = ye("activeDescendantChange", null), l = `${s}-more-info`;
   function c(u) {
@@ -6232,7 +6229,7 @@ const ku = /* @__PURE__ */ E((e, {
 }), Bg = "lumx-skeleton-typography", {
   block: Fg,
   element: qg
-} = F(Bg), ir = (e) => {
+} = B(Bg), ir = (e) => {
   const {
     className: t,
     theme: n,
@@ -6313,7 +6310,7 @@ function Vg(e) {
 const Wg = "lumx-combobox-popover", {
   block: Ug,
   element: Gg
-} = F(Wg), Kg = (e, {
+} = B(Wg), Kg = (e, {
   Popover: t,
   FlexBox: n
 }) => {
@@ -6366,7 +6363,7 @@ function Xg() {
 var Yg = Xg();
 const qr = /* @__PURE__ */ Te(Yg), Zg = "lumx-flex-box", {
   block: Jg
-} = F(Zg);
+} = B(Zg);
 function Qg(e) {
   const {
     className: t,
@@ -6423,7 +6420,7 @@ const yn = /* @__PURE__ */ E((e, {
   } = Pe(), {
     isOpen: o,
     setIsOpen: r
-  } = Br(), s = w(() => a.value ?? void 0);
+  } = Br(), s = C(() => a.value ?? void 0);
   return () => {
     const {
       class: i,
@@ -6544,7 +6541,7 @@ const Iu = /* @__PURE__ */ E((e) => {
     isAnyDisabled: r,
     disabledStateProps: s,
     otherProps: i
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), l = (c) => {
@@ -6578,7 +6575,7 @@ const Iu = /* @__PURE__ */ E((e) => {
     isAnyDisabled: s,
     disabledStateProps: i,
     otherProps: l
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), c = (d) => {
@@ -6610,7 +6607,7 @@ const Iu = /* @__PURE__ */ E((e) => {
 }), dv = "ListSection", Lu = "lumx-list-section", {
   block: fv,
   element: $i
-} = F(Lu), hv = {}, Sn = (e) => {
+} = B(Lu), hv = {}, Sn = (e) => {
   const {
     children: t,
     className: n,
@@ -6701,7 +6698,7 @@ function bt(e) {
 }
 const pv = "lumx-combobox-state", {
   block: gv
-} = F(pv), vv = (e, {
+} = B(pv), vv = (e, {
   GenericBlock: t,
   Text: n
 }) => {
@@ -6774,7 +6771,7 @@ function Ha(e) {
 const Av = "lumx-generic-block", {
   block: Sv,
   element: za
-} = F(Av), Mi = {
+} = B(Av), Mi = {
   gap: H.big,
   orientation: ct.horizontal
 }, Nv = (e) => {
@@ -7498,7 +7495,7 @@ const ub = /* @__PURE__ */ Te(cb), NN = ub(H, ["tiny", "regular", "medium", "big
   Divider: Iu
 }, fb = "Badge", Bu = "lumx-badge", {
   block: hb
-} = F(Bu), Fu = {
+} = B(Bu), Fu = {
   color: G.primary
 }, On = (e) => {
   const {
@@ -7535,7 +7532,7 @@ const PN = /* @__PURE__ */ E((e, {
 }), mb = "lumx-badge-wrapper", {
   block: pb,
   element: gb
-} = F(mb), vb = (e) => {
+} = B(mb), vb = (e) => {
   const {
     badge: t,
     children: n,
@@ -7566,7 +7563,7 @@ const PN = /* @__PURE__ */ E((e, {
 }), qu = "intermediate", bb = "lumx-checkbox", {
   block: yb,
   element: Ie
-} = F(bb), Ab = (e) => {
+} = B(bb), Ab = (e) => {
   const {
     checked: t,
     className: n,
@@ -7638,14 +7635,14 @@ const PN = /* @__PURE__ */ E((e, {
 }, wN = /* @__PURE__ */ E((e, {
   emit: t
 }) => {
-  const n = D(), a = U(), o = M(() => e.class), r = re(), s = w(() => e.id || r), i = R(null), {
+  const n = D(), a = U(), o = M(() => e.class), r = re(), s = C(() => e.id || r), i = R(null), {
     isAnyDisabled: l,
     disabledStateProps: c,
     otherProps: d
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...n
-  }))), u = w(() => e.isChecked === qu);
+  }))), u = C(() => e.isChecked === qu);
   X(u, (f) => {
     i.value && (i.value.indeterminate = f);
   }, {
@@ -7677,7 +7674,7 @@ const PN = /* @__PURE__ */ E((e, {
 }), kt = "lumx-chip", {
   block: Nb,
   element: Fo
-} = F(kt), Pb = {
+} = B(kt), Pb = {
   size: H.m
 }, xb = (e) => {
   const {
@@ -7702,14 +7699,14 @@ const PN = /* @__PURE__ */ E((e, {
     handleKeyDown: A,
     disabledStateProps: N,
     isAnyDisabled: x,
-    keyDownProp: C = "onKeyDown",
-    tabIndexProp: O = "tabIndex",
+    keyDownProp: w = "onKeyDown",
+    tabIndexProp: k = "tabIndex",
     ...P
-  } = e, T = g && !y, k = !!g || !!y || s, _ = r || (b === he.light ? G.dark : G.light), q = (I) => {
+  } = e, T = g && !y, O = !!g || !!y || s, _ = r || (b === he.light ? G.dark : G.light), q = (I) => {
     A?.(I), g && u && Hd(u)(I);
   }, j = {
-    [C]: q,
-    [O]: k && !N.disabled ? 0 : void 0
+    [w]: q,
+    [k]: O && !N.disabled ? 0 : void 0
   };
   return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
@@ -7719,7 +7716,7 @@ const PN = /* @__PURE__ */ E((e, {
       href: N.disabled ? void 0 : y,
       ref: v,
       className: L(o, Nb({
-        "is-clickable": k,
+        "is-clickable": O,
         [`color-${_}`]: !!_,
         "is-disabled": x,
         "has-after": !!t,
@@ -7729,7 +7726,7 @@ const PN = /* @__PURE__ */ E((e, {
         [`size-${p}`]: !!p,
         "is-unselected": !l
       })),
-      "aria-disabled": k && x || void 0,
+      "aria-disabled": O && x || void 0,
       onClick: g ? u : void 0
     }), [n && // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
     m("div", {
@@ -7759,7 +7756,7 @@ const PN = /* @__PURE__ */ E((e, {
     isAnyDisabled: c,
     disabledStateProps: d,
     otherProps: u
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), h = (b) => {
@@ -7825,7 +7822,7 @@ function Tb(e) {
 const _b = "lumx-selection-chip-group", {
   block: Ib,
   element: Lb
-} = F(_b), Eb = (e, {
+} = B(_b), Eb = (e, {
   Chip: t,
   ChipGroup: n,
   Icon: a,
@@ -7854,10 +7851,10 @@ const _b = "lumx-selection-chip-group", {
     "aria-orientation": "horizontal",
     className: Ib([g])
   }), Tb(s = i.map((y) => {
-    const A = c && se(c, y) || se(l, y), N = se(l, y), x = p?.(y) || {}, C = x.isDisabled || h, O = typeof x.children == "string" ? x.children : A, P = u ? `${O} - ${u}` : O;
+    const A = c && se(c, y) || se(l, y), N = se(l, y), x = p?.(y) || {}, w = x.isDisabled || h, k = typeof x.children == "string" ? x.children : A, P = u ? `${k} - ${u}` : k;
     return m(r, {
       key: N,
-      label: C ? void 0 : P
+      label: w ? void 0 : P
     }, {
       default: () => [m(t, S({
         "aria-label": P
@@ -7872,7 +7869,7 @@ const _b = "lumx-selection-chip-group", {
         role: "option",
         "aria-selected": "true",
         theme: f,
-        isDisabled: C
+        isDisabled: w
       }), {
         default: () => [m(o, {
           as: "span",
@@ -7969,7 +7966,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
       });
       c(d);
     });
-    const l = w(i);
+    const l = C(i);
     return ju({
       containerRef: l,
       itemSelector: `.${kt}`,
@@ -8024,7 +8021,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
 ), Bb = "lumx-lightbox", {
   block: Fb,
   element: El
-} = F(Bb), qb = (e) => {
+} = B(Bb), qb = (e) => {
   const {
     "aria-labelledby": t,
     ariaLabelledBy: n = t,
@@ -8047,8 +8044,8 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
     ThemeProvider: A,
     ClickAwayProvider: N,
     childrenRef: x,
-    clickAwayRefs: C,
-    closeButtonRef: O,
+    clickAwayRefs: w,
+    closeButtonRef: k,
     IconButton: P,
     ...T
   } = e;
@@ -8072,7 +8069,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
     }), [i && m("div", {
       className: El("close")
     }, [m(P, S(i, {
-      ref: O,
+      ref: k,
       emphasis: "low",
       hasBackground: !0,
       icon: yr,
@@ -8087,7 +8084,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
       }, {
         default: () => [m(N, {
           callback: !h && c,
-          childrenRefs: C
+          childrenRefs: w
         }, {
           default: () => [m("div", {
             ref: x,
@@ -8106,14 +8103,14 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
   attrs: a
 }) => {
   const o = M(() => e.class), r = R(null), s = R(null), i = () => t("close");
-  ln(i, w(() => !!(e.isOpen && !e.preventAutoClose)));
-  const l = w(() => e.isOpen && r.value || !1);
-  Cr(l, w(() => {
+  ln(i, C(() => !!(e.isOpen && !e.preventAutoClose)));
+  const l = C(() => e.isOpen && r.value || !1);
+  Cr(l, C(() => {
     const h = s.value?.$el ?? s.value;
     return e.focusElement || h || r.value;
-  })), Or(w(() => !0), w(() => {
-  }), w(() => e.parentElement), r, w(() => !!e.isOpen)), Bc(w(() => !!e.isOpen));
-  const c = Dc(w(() => !!e.isOpen), ac), d = w(() => e.isOpen || c.value), u = w(() => [r]);
+  })), Or(C(() => !0), C(() => {
+  }), C(() => e.parentElement), r, C(() => !!e.isOpen)), Bc(C(() => !!e.isOpen));
+  const c = Dc(C(() => !!e.isOpen), ac), d = C(() => e.isOpen || c.value), u = C(() => [r]);
   return () => d.value ? qb({
     ...a,
     ClickAwayProvider: vr,
@@ -8140,7 +8137,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
   emits: jb
 }), Hb = "lumx-divider", {
   block: zb
-} = F(Hb), Vb = (e) => {
+} = B(Hb), Vb = (e) => {
   const {
     className: t,
     theme: n,
@@ -8167,7 +8164,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
   props: $()("class", "theme")
 }), Wb = "lumx-drag-handle", {
   block: Ub
-} = F(Wb), Gb = (e) => {
+} = B(Wb), Gb = (e) => {
   const {
     className: t,
     theme: n,
@@ -8200,7 +8197,7 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
 }), Kb = "lumx-expansion-panel", {
   block: Xb,
   element: we
-} = F(Kb), Yb = {
+} = B(Kb), Yb = {
   closeMode: "unmount"
 }, Zb = (e) => {
   const {
@@ -8225,10 +8222,10 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
     IconButton: A,
     footer: N,
     closeMode: x,
-    ...C
-  } = e, O = (k) => {
+    ...w
+  } = e, k = (O) => {
     const _ = !s;
-    c && _ && c(k), l && !_ && l(k), d && d(_, k);
+    c && _ && c(O), l && !_ && l(O), d && d(_, O);
   }, P = u === he.dark ? G.light : G.dark, T = L(t, Xb({
     "has-background": a,
     "has-header": !Kt(f.children),
@@ -8240,11 +8237,11 @@ const Hu = (e) => (t) => K(t) && t.type === e, Rb = {
   }));
   return m("section", S({
     ref: o
-  }, C, {
+  }, w, {
     className: T
   }), [m("header", {
     className: we("header"),
-    onClick: O
+    onClick: k
   }, [p && m("div", {
     className: we("header-drag")
   }, [p]), m("div", S(f, {
@@ -8338,7 +8335,7 @@ function Qb(e) {
 const ey = "lumx-flag", {
   block: ty,
   element: $l
-} = F(ey), ny = (e) => {
+} = B(ey), ny = (e) => {
   const {
     children: t,
     icon: n,
@@ -8519,7 +8516,7 @@ const IN = /* @__PURE__ */ E((e, {
 }, LN = /* @__PURE__ */ E((e, {
   slots: t
 }) => {
-  const n = D(), a = xc(), o = M(() => e.class), r = w(() => {
+  const n = D(), a = xc(), o = M(() => e.class), r = C(() => {
     const {
       className: s,
       ...i
@@ -8571,7 +8568,7 @@ const IN = /* @__PURE__ */ E((e, {
   props: $()("htmlFor", "id", "isRequired", "typography", "theme", "class", "as")
 }), Wu = "lumx-link", {
   block: py
-} = F(Wu), gy = (e) => {
+} = B(Wu), gy = (e) => {
   const {
     children: t,
     className: n,
@@ -8608,7 +8605,7 @@ const IN = /* @__PURE__ */ E((e, {
     isAnyDisabled: r,
     disabledStateProps: s,
     otherProps: i
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), l = (c) => {
@@ -8641,7 +8638,7 @@ function jl(e) {
 const yy = "lumx-link-preview", {
   block: Ay,
   element: We
-} = F(yy), Uu = {
+} = B(yy), Uu = {
   size: H.regular,
   titleHeading: "h2"
 }, Sy = (e) => {
@@ -8736,7 +8733,7 @@ const yy = "lumx-link-preview", {
 }), Ny = "lumx-menu-item", {
   block: Py,
   element: xy
-} = F(Ny), wy = (e) => {
+} = B(Ny), wy = (e) => {
   const {
     children: t,
     className: n,
@@ -9153,7 +9150,7 @@ function qy(e) {
 const jy = "lumx-menu-popover", {
   block: Hy,
   element: zy
-} = F(jy), Vy = (e, {
+} = B(jy), Vy = (e, {
   Popover: t,
   FlexBox: n
 }) => {
@@ -9290,7 +9287,7 @@ const jy = "lumx-menu-popover", {
 }), Yy = "Message", Ku = "lumx-message", {
   block: Zy,
   element: Uo
-} = F(Ku), Jy = {
+} = B(Ku), Jy = {
   [ie.error]: {
     color: G.red,
     icon: hc
@@ -9396,7 +9393,7 @@ var tA = eA();
 const nA = /* @__PURE__ */ Te(tA), aA = "lumx-mosaic", {
   block: oA,
   element: Xo
-} = F(aA), rA = (e) => {
+} = B(aA), rA = (e) => {
   const {
     className: t,
     theme: n,
@@ -9470,7 +9467,7 @@ const nA = /* @__PURE__ */ Te(tA), aA = "lumx-mosaic", {
   emit: t,
   slots: n
 }) => {
-  const a = D(), o = M(() => e.class), r = w(() => e.label ?? e.ariaLabel ?? a["aria-label"]), s = () => t("close");
+  const a = D(), o = M(() => e.class), r = C(() => e.label ?? e.ariaLabel ?? a["aria-label"]), s = () => t("close");
   return () => {
     const {
       label: i,
@@ -9504,7 +9501,7 @@ const nA = /* @__PURE__ */ Te(tA), aA = "lumx-mosaic", {
 }), uA = "lumx-progress-linear", {
   block: dA,
   element: Wl
-} = F(uA), fA = (e) => {
+} = B(uA), fA = (e) => {
   const {
     className: t,
     theme: n,
@@ -9535,7 +9532,7 @@ const nA = /* @__PURE__ */ Te(tA), aA = "lumx-mosaic", {
 }), hA = "lumx-radio-button", {
   block: mA,
   element: Le
-} = F(hA), pA = (e) => {
+} = B(hA), pA = (e) => {
   const {
     checked: t,
     className: n,
@@ -9603,11 +9600,11 @@ const nA = /* @__PURE__ */ Te(tA), aA = "lumx-mosaic", {
 }, HN = /* @__PURE__ */ E((e, {
   emit: t
 }) => {
-  const n = D(), a = U(), o = M(() => e.class), r = re(), s = w(() => e.id || r), {
+  const n = D(), a = U(), o = M(() => e.class), r = re(), s = C(() => e.id || r), {
     isAnyDisabled: i,
     disabledStateProps: l,
     otherProps: c
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...n
   }))), d = (u, h, f) => {
@@ -9662,7 +9659,7 @@ const zN = /* @__PURE__ */ E((e, {
   props: $()("class")
 }), yA = "lumx-skeleton-circle", {
   block: AA
-} = F(yA), SA = (e) => {
+} = B(yA), SA = (e) => {
   const {
     className: t,
     size: n,
@@ -9687,7 +9684,7 @@ const zN = /* @__PURE__ */ E((e, {
 }, PA = "lumx-skeleton-rectangle", {
   block: xA,
   element: wA
-} = F(PA), CA = {
+} = B(PA), CA = {
   variant: NA.squared
 }, OA = (e) => {
   const {
@@ -9748,7 +9745,7 @@ const zN = /* @__PURE__ */ E((e, {
 }), kA = "lumx-switch", {
   block: TA,
   element: Ee
-} = F(kA), _A = {
+} = B(kA), _A = {
   position: "left"
 }, IA = (e) => {
   const {
@@ -9823,11 +9820,11 @@ const zN = /* @__PURE__ */ E((e, {
   emit: t,
   slots: n
 }) => {
-  const a = D(), o = U(), r = M(() => e.class), s = re(), i = w(() => e.id || s), {
+  const a = D(), o = U(), r = M(() => e.class), s = re(), i = C(() => e.id || s), {
     isAnyDisabled: l,
     disabledStateProps: c,
     otherProps: d
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), u = (h, f, g, p) => {
@@ -9859,7 +9856,7 @@ const zN = /* @__PURE__ */ E((e, {
 }, EA = "lumx-uploader", {
   block: $A,
   element: yt
-} = F(EA), Yo = {
+} = B(EA), Yo = {
   aspectRatio: dt.horizontal,
   size: H.xl,
   variant: Yu.square
@@ -9919,11 +9916,11 @@ const zN = /* @__PURE__ */ E((e, {
 }, KN = /* @__PURE__ */ E((e, {
   emit: t
 }) => {
-  const n = D(), a = U(), o = M(() => e.class), r = re(), s = w(() => e.fileInputProps?.id || r), i = R(!1), {
+  const n = D(), a = U(), o = M(() => e.class), r = re(), s = C(() => e.fileInputProps?.id || r), i = R(!1), {
     isAnyDisabled: l,
     disabledStateProps: c,
     otherProps: d
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...n
   }))), u = (f) => {
@@ -9987,7 +9984,7 @@ const zN = /* @__PURE__ */ E((e, {
 }, Zu = "lumx-image-block", {
   block: BA,
   element: Ul
-} = F(Zu), Gl = {
+} = B(Zu), Gl = {
   captionPosition: DA.below,
   align: Ar.left
 }, FA = (e) => {
@@ -10166,7 +10163,7 @@ const qA = (e) => {
 }), HA = "InlineList", Ju = "lumx-inline-list", {
   block: zA,
   element: Kl
-} = F(Ju), VA = {}, _n = (e) => {
+} = B(Ju), VA = {}, _n = (e) => {
   const {
     className: t,
     color: n,
@@ -10216,7 +10213,7 @@ const YN = /* @__PURE__ */ E((e, {
   props: $()("color", "colorVariant", "typography", "wrap", "class")
 }), Mt = "lumx-table", {
   block: WA
-} = F(Mt), UA = (e) => {
+} = B(Mt), UA = (e) => {
   const {
     children: t,
     className: n,
@@ -10280,7 +10277,7 @@ const YN = /* @__PURE__ */ E((e, {
   head: "head"
 }, Ue = `${Mt}__cell`, {
   block: Xl
-} = F(Ue), XA = {
+} = B(Ue), XA = {
   variant: ur.body
 }, YA = (e) => {
   const {
@@ -10380,7 +10377,7 @@ const YN = /* @__PURE__ */ E((e, {
   props: $()("class")
 }), eS = `${Mt}__row`, {
   block: tS
-} = F(eS), nS = (e) => {
+} = B(eS), nS = (e) => {
   const {
     children: t,
     className: n,
@@ -10409,7 +10406,7 @@ const YN = /* @__PURE__ */ E((e, {
   const n = D(), a = M(() => e.class), {
     isAnyDisabled: o,
     otherProps: r
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...n
   })));
@@ -10429,7 +10426,7 @@ function aS(e) {
 }
 const oS = `${Qu}__link`, {
   block: rS
-} = F(oS), sS = (e) => {
+} = B(oS), sS = (e) => {
   const {
     className: t,
     icon: n,
@@ -10452,12 +10449,12 @@ const oS = `${Qu}__link`, {
     Text: A,
     ref: N,
     ...x
-  } = e, C = () => {
+  } = e, w = () => {
     o || g?.();
-  }, O = (T) => {
-    c?.(T), b && C();
+  }, k = (T) => {
+    c?.(T), b && w();
   }, P = (T) => {
-    d?.(T), !(T.key !== "Enter" || o) && C();
+    d?.(T), !(T.key !== "Enter" || o) && w();
   };
   return m("button", S({
     ref: N
@@ -10468,11 +10465,11 @@ const oS = `${Qu}__link`, {
       "is-active": i,
       "is-disabled": o
     })),
-    onClick: C
+    onClick: w
   }, {
     [f]: P
   }, {
-    onFocus: O,
+    onFocus: k,
     role: "tab"
   }, {
     [h]: i ? 0 : u
@@ -10518,14 +10515,14 @@ const oS = `${Qu}__link`, {
 }, ed = /* @__PURE__ */ Symbol("LumxTabProvider"), td = (e, t) => {
   const n = qe(ed, void 0);
   if (!n)
-    return w(() => {
+    return C(() => {
     });
   const { state: a, dispatch: o } = n, r = re(), s = t || r;
   return Ke(() => {
     o({ type: "register", payload: { type: e, id: s } });
   }), en(() => {
     o({ type: "unregister", payload: { type: e, id: s } });
-  }), w(() => {
+  }), C(() => {
     const i = a.value.ids[e].indexOf(s);
     if (i !== -1)
       return {
@@ -10547,10 +10544,10 @@ const oS = `${Qu}__link`, {
 }) => {
   const n = D(), a = M(() => e.class), {
     isAnyDisabled: o
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...n
-  }))), r = td("tab", e.id), s = w(() => e.isActive || r.value?.isActive), i = (c) => t("focus", c), l = (c) => t("keypress", c);
+  }))), r = td("tab", e.id), s = C(() => e.isActive || r.value?.isActive), i = (c) => t("focus", c), l = (c) => t("keypress", c);
   return () => m(sS, S(n, {
     id: e.id,
     className: a.value,
@@ -10579,7 +10576,7 @@ const oS = `${Qu}__link`, {
 }), {
   block: cS,
   element: uS
-} = F(Qu);
+} = B(Qu);
 let dS = /* @__PURE__ */ (function(e) {
   return e.clustered = "clustered", e.fixed = "fixed", e;
 })({});
@@ -10630,7 +10627,7 @@ const Yl = {
   props: $()("layout", "position", "theme", "class")
 }), hS = "lumx-tab-panel", {
   block: mS
-} = F(hS), pS = (e) => {
+} = B(hS), pS = (e) => {
   const {
     children: t,
     className: n,
@@ -10656,7 +10653,7 @@ const Yl = {
     "aria-labelledby": r
   }), [(!s || a) && t]);
 }, oP = /* @__PURE__ */ E((e) => {
-  const t = D(), n = ke(), a = M(() => e.class), o = td("tabPanel", e.id), r = w(() => e.isActive || o.value?.isActive);
+  const t = D(), n = ke(), a = M(() => e.class), o = td("tabPanel", e.id), r = C(() => e.isActive || o.value?.isActive);
   return () => m(pS, S(t, {
     className: a.value,
     isActive: r.value,
@@ -10739,7 +10736,7 @@ function AS(e) {
 const SS = "lumx-user-block", {
   block: NS,
   element: $e
-} = F(SS), Ql = {
+} = B(SS), Ql = {
   orientation: ct.horizontal,
   size: H.m
 }, dr = ({
@@ -10772,24 +10769,24 @@ const SS = "lumx-user-block", {
     children: A,
     additionalFields: N,
     after: x,
-    Text: C,
-    Avatar: O,
+    Text: w,
+    Avatar: k,
     ...P
   } = e;
   let T = v;
   p === ct.vertical && (T = H.l);
-  const k = p === ct.vertical, _ = dr({
+  const O = p === ct.vertical, _ = dr({
     handleClick: h,
     linkAs: r,
     linkProps: o
   }), q = T !== H.s && T !== H.xs, j = a && q && m("div", {
     className: $e("fields")
-  }, [a.map((B, z) => m(C, {
+  }, [a.map((F, V) => m(w, {
     as: "span",
-    key: z,
+    key: V,
     className: $e("field")
-  }, AS(B) ? B : {
-    default: () => [B]
+  }, AS(F) ? F : {
+    default: () => [F]
   }))]), I = {
     ...f && {
       [l]: f
@@ -10807,7 +10804,7 @@ const SS = "lumx-user-block", {
       [`theme-${y}`]: !!y,
       "is-clickable": _
     }))
-  }), [t && m(O, S({
+  }), [t && m(k, S({
     linkAs: r,
     linkProps: o,
     alt: ""
@@ -10818,9 +10815,9 @@ const SS = "lumx-user-block", {
     theme: y
   }), null), (a || d || A || N) && m("div", {
     className: $e("wrapper")
-  }, [A, j, q ? N : null]), k && b && m("div", {
+  }, [A, j, q ? N : null]), O && b && m("div", {
     className: $e("action")
-  }, [b]), k && i && m("div", {
+  }, [b]), O && i && m("div", {
     className: $e("actions")
   }, [i]), x ? m("div", {
     className: $e("after")
@@ -10843,7 +10840,7 @@ const wS = {
     t("mouseenter");
   }, l = () => {
     t("mouseleave");
-  }, c = oe("onClick"), d = oe("onMouseenter"), u = oe("onMouseleave"), h = w(() => {
+  }, c = oe("onClick"), d = oe("onMouseenter"), u = oe("onMouseleave"), h = C(() => {
     const g = e.name || n.name?.();
     if (Kt(g))
       return null;
@@ -10869,7 +10866,7 @@ const wS = {
         default: () => [g]
       })]
     });
-  }), f = w(() => {
+  }), f = C(() => {
     if (!e.avatarProps) return;
     if (dr({
       linkAs: e.linkAs,
@@ -11027,8 +11024,8 @@ const OS = "SelectButton", kS = "lumx-select-button", TS = {
     translations: A,
     onOpen: N,
     onLoadMore: x,
-    infiniteScrollOptions: C
-  } = e, O = y === "loading", P = y === "loadingMore", T = y === "error", k = u === "multiple", _ = d != null ? qr(d).map((q) => ad(q, r, o)).filter(Boolean).join(", ") : "";
+    infiniteScrollOptions: w
+  } = e, k = y === "loading", P = y === "loadingMore", T = y === "error", O = u === "multiple", _ = d != null ? qr(d).map((q) => ad(q, r, o)).filter(Boolean).join(", ") : "";
   return m(t.Provider, {
     onOpen: N
   }, {
@@ -11044,9 +11041,9 @@ const OS = "SelectButton", kS = "lumx-select-button", TS = {
     }, p), {
       default: () => [m(t.List, S(b, {
         "aria-label": h,
-        "aria-multiselectable": k || void 0
+        "aria-multiselectable": O || void 0
       }), {
-        default: () => [O ? m(t.OptionSkeleton, {
+        default: () => [k ? m(t.OptionSkeleton, {
           count: 3
         }, null) : Wr({
           options: a,
@@ -11063,7 +11060,7 @@ const OS = "SelectButton", kS = "lumx-select-button", TS = {
           callback: () => {
             y && y !== "idle" || x();
           },
-          options: C
+          options: w
         }, null), P && m(t.OptionSkeleton, {
           count: 1
         }, null)]
@@ -11084,7 +11081,7 @@ function _S(e) {
 }
 function od(e) {
   const t = D();
-  return w(() => {
+  return C(() => {
     const n = t.renderOption;
     if (!(!e && !n))
       return (a, o) => {
@@ -11118,7 +11115,7 @@ function od(e) {
   });
 }
 function rd(e) {
-  return w(() => {
+  return C(() => {
     if (e)
       return (t, n) => e({
         sectionId: t,
@@ -11150,10 +11147,10 @@ const LS = {
 }) => {
   const o = R(null), r = M(() => e.class), {
     disabledStateProps: s
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
-  }))), i = od(n.option), l = rd(n.sectionTitle), c = w(() => ({
+  }))), i = od(n.option), l = rd(n.sectionTitle), c = C(() => ({
     className: f,
     children: g,
     ref: p,
@@ -11245,21 +11242,21 @@ const LS = {
     nbOptionMessage: A,
     errorMessage: N,
     errorTryReloadMessage: x,
-    onOpen: C,
-    chips: O,
+    onOpen: w,
+    chips: k,
     beforeOptions: P,
     afterOptions: T,
-    onLoadMore: k,
+    onLoadMore: O,
     infiniteScrollOptions: _
   } = e, q = b === "loading", j = b === "loadingMore", I = b === "error";
   return m(t.Provider, {
-    onOpen: C
+    onOpen: w
   }, {
     default: () => [m(t.Input, S({
       label: u
     }, f, {
       selectionMode: "keep",
-      chips: O
+      chips: k
     }), null), m(t.Popover, S({
       fitToAnchorWidth: "minWidth",
       fitWithinViewportHeight: !0,
@@ -11282,9 +11279,9 @@ const LS = {
           selected: d
         }, {
           Combobox: t
-        }), T, k && n && m(n, {
+        }), T, O && n && m(n, {
           callback: () => {
-            b && b !== "idle" || k();
+            b && b !== "idle" || O();
           },
           options: _
         }, null), j && m(t.OptionSkeleton, {
@@ -11332,19 +11329,19 @@ const MS = {
   slots: n,
   attrs: a
 }) => {
-  const o = w(() => e.selectionType === "multiple"), r = M(() => e.class), {
+  const o = C(() => e.selectionType === "multiple"), r = M(() => e.class), {
     isAnyDisabled: s,
     disabledStateProps: i
-  } = te(w(() => ({
+  } = te(C(() => ({
     ...e,
     ...a
   }))), l = R(!!e.searchInputValue), c = R(e.searchInputValue ?? ""), d = R(null), u = R(null);
   X(() => e.searchInputValue, (x) => {
     x !== void 0 && (c.value = x, l.value = !!x);
   });
-  const h = w(() => e.selectionType === "multiple" || l.value ? c.value : ad(e.value, e.getOptionName, e.getOptionId)), f = (x) => {
-    const C = nd(e.options, e.getOptionId, e.value, x.value, e.selectionType === "multiple");
-    t("change", C), l.value = !1, c.value = "", t("search", "");
+  const h = C(() => e.selectionType === "multiple" || l.value ? c.value : ad(e.value, e.getOptionName, e.getOptionId)), f = (x) => {
+    const w = nd(e.options, e.getOptionId, e.value, x.value, e.selectionType === "multiple");
+    t("change", w), l.value = !1, c.value = "", t("search", "");
   }, g = (x) => {
     l.value = !0, c.value = x, t("search", x), !o.value && x === "" && e.value !== void 0 && e.value !== null && t("change", void 0);
   }, p = (x) => {
@@ -11353,7 +11350,7 @@ const MS = {
     l.value = !1, c.value = "", t("search", ""), t("blur", x);
   }, v = od(n.option), y = rd(n.sectionTitle), A = oe("onLoadMore") || oe("onLoad-more"), N = () => t("load-more");
   return () => {
-    const x = !o.value && !s.value && (e.hasClearButton ?? !0) && e.value !== void 0 && e.value !== null, C = e.selectionType === "multiple" ? m(Db, {
+    const x = !o.value && !s.value && (e.hasClearButton ?? !0) && e.value !== void 0 && e.value !== null, w = e.selectionType === "multiple" ? m(Db, {
       value: e.value,
       theme: e.theme,
       getOptionId: e.getOptionId,
@@ -11365,7 +11362,7 @@ const MS = {
       chipRemoveLabel: e.translations.chipRemoveLabel
     }, {
       chip: n.chip || void 0
-    }) : void 0, O = e.listStatus ?? "idle", P = e.beforeOptions ?? n.beforeOptions?.();
+    }) : void 0, k = e.listStatus ?? "idle", P = e.beforeOptions ?? n.beforeOptions?.();
     return Gr({
       options: e.options,
       getOptionId: e.getOptionId,
@@ -11377,7 +11374,7 @@ const MS = {
       selected: e.value,
       label: e.label,
       isMultiselectable: o.value,
-      listStatus: O,
+      listStatus: k,
       onOpen: (T) => t("open", T),
       loadingMessage: e.translations.loadingMessage,
       emptyMessage: e.translations.emptyMessage,
@@ -11423,7 +11420,7 @@ const MS = {
       listProps: {
         ref: d
       },
-      chips: C,
+      chips: w,
       beforeOptions: P,
       onLoadMore: A ? N : void 0,
       infiniteScrollOptions: {
@@ -11442,7 +11439,7 @@ const MS = {
   emits: MS
 }), DS = Ot, cP = Eu, uP = ku, dP = Tu, fP = Iu, BS = "TimePickerField", sd = "lumx-time-picker-field", {
   block: FS
-} = F(sd), tc = {
+} = B(sd), tc = {
   step: 30,
   boundsMode: "on-blur"
 }, Kr = (e, {
@@ -11545,12 +11542,12 @@ const WS = () => navigator.languages?.[0] || navigator.language, US = {
 }, hP = /* @__PURE__ */ E((e, {
   emit: t
 }) => {
-  const n = M(() => e.class), a = w(() => e.locale ?? WS()), o = w(() => e.step ?? tc.step), r = w(() => e.boundsMode ?? tc.boundsMode), s = w(() => jS({
+  const n = M(() => e.class), a = C(() => e.locale ?? WS()), o = C(() => e.step ?? tc.step), r = C(() => e.boundsMode ?? tc.boundsMode), s = C(() => jS({
     step: o.value,
     minTime: e.minTime,
     maxTime: e.maxTime,
     locale: a.value
-  })), i = R(""), l = w(() => {
+  })), i = R(""), l = C(() => {
     const {
       value: h
     } = e;