@bluerobotics/bluevue 0.2.0 → 0.2.1

package/dist/bluevue.js

@@ -1,4 +1,4 @@
-import { ref as q, readonly as Ue, onMounted as pe, watch as X, onBeforeUnmount as me, defineComponent as L, computed as w, openBlock as a, createElementBlock as d, normalizeStyle as D, normalizeClass as b, renderSlot as j, createBlock as U, createCommentVNode as C, createElementVNode as i, toDisplayString as B, useSlots as Ke, unref as M, withCtx as N, createVNode as O, TransitionGroup as dt, Fragment as J, renderList as Z, createTextVNode as oe, createSlots as Ge, mergeProps as ke, nextTick as _e, withKeys as de, withModifiers as ae, Transition as pt, withDirectives as Te, vShow as mt, vModelText as je } from "vue";
+import { ref as q, readonly as Ue, onMounted as pe, watch as X, onBeforeUnmount as me, defineComponent as L, computed as k, openBlock as a, createElementBlock as d, normalizeStyle as D, normalizeClass as y, renderSlot as j, createBlock as U, createCommentVNode as C, createElementVNode as i, toDisplayString as B, useSlots as Ke, unref as M, withCtx as N, createVNode as O, TransitionGroup as dt, Fragment as J, renderList as Z, createTextVNode as oe, createSlots as Ge, mergeProps as ke, nextTick as Te, withKeys as de, withModifiers as ae, Transition as pt, withDirectives as Ve, vShow as mt, vModelText as je } from "vue";
 import { useFloating as ft, autoUpdate as vt, offset as ht, flip as bt, shift as yt, size as gt } from "@floating-ui/vue";
 const qe = q({ show: !1, message: "Working…", dismissible: !1 }), qt = (c = "Working…", n = !1) => {
   qe.value = { show: !0, message: c, dismissible: n };
@@ -8,7 +8,7 @@ const qe = q({ show: !1, message: "Working…", dismissible: !1 }), qt = (c = "W
 function kt() {
   return { loading: Ue(qe), showLoading: qt, hideLoading: wt };
 }
-class Ve extends Error {
+class Fe extends Error {
   constructor(n, e, t) {
     super(n), this.url = e, this.status = t, this.name = "BlueOsError";
   }
@@ -26,10 +26,10 @@ const qo = (c) => {
     try {
       v = await fetch(r, { signal: AbortSignal.timeout(t), ...u });
     } catch (x) {
-      throw new Ve(`Could not reach ${c}: ${x.message}`, r, 0);
+      throw new Fe(`Could not reach ${c}: ${x.message}`, r, 0);
     }
     if (!v.ok)
-      throw new Ve(await v.text() || v.statusText, r, v.status);
+      throw new Fe(await v.text() || v.statusText, r, v.status);
     const f = await v.text();
     return f === "" ? void 0 : JSON.parse(f);
   };
@@ -44,7 +44,7 @@ const qo = (c) => {
     }),
     delete: (s, u) => l(s, { method: "DELETE", ...u })
   };
-}, Ce = xe("beacon"), Fe = xe("bag"), $t = xe("version-chooser"), Bt = xe("customization"), Je = q(null), Ye = q(null), Xe = q(null), Ze = q(null), Qe = q(!0), et = q(!1), tt = q(null), he = async (c, n) => {
+}, Ce = xe("beacon"), _e = xe("bag"), $t = xe("version-chooser"), Bt = xe("customization"), Je = q(null), Ye = q(null), Xe = q(null), Ze = q(null), Qe = q(!0), et = q(!1), tt = q(null), he = async (c, n) => {
   try {
     return n(await c), !0;
   } catch {
@@ -66,10 +66,10 @@ const qo = (c) => {
     he(Bt.get("theme"), (t) => {
       Ze.value = t.primary;
     }),
-    he(Fe.get("get/settings"), (t) => {
+    he(_e.get("get/settings"), (t) => {
       typeof t.is_dark_theme == "boolean" && (Qe.value = t.is_dark_theme), typeof t.is_pirate_mode == "boolean" && (et.value = t.is_pirate_mode);
     })
-  ]), tt.value = c || n || e ? null : new Ve("Could not reach the vehicle", Ce.url("vehicle_name"), 0);
+  ]), tt.value = c || n || e ? null : new Fe("Could not reach the vehicle", Ce.url("vehicle_name"), 0);
 }, Ct = () => (pe(() => {
   Oe();
 }), {
@@ -87,14 +87,14 @@ const qo = (c) => {
   let t = !1, o;
   pe(async () => {
     try {
-      e.value = await Fe.get(`get/${c}`);
+      e.value = await _e.get(`get/${c}`);
     } catch (u) {
       u.status !== 400 && console.warn(`Could not read ${c}:`, u);
     }
     t = !0;
   });
   const l = () => {
-    Fe.post(`set/${c}`, e.value).catch((u) => console.warn(`Could not save ${c}:`, u));
+    _e.post(`set/${c}`, e.value).catch((u) => console.warn(`Could not save ${c}:`, u));
   }, s = X(e, () => {
     t && (clearTimeout(o), o = setTimeout(() => {
       o = void 0, l();
@@ -103,7 +103,7 @@ const qo = (c) => {
   return me(() => {
     s(), o !== void 0 && (clearTimeout(o), l());
   }), e;
-}, _t = {
+}, Tt = {
   primary: "--bluevue-primary",
   accent: "--bluevue-accent",
   error: "--bluevue-error",
@@ -111,13 +111,13 @@ const qo = (c) => {
   panelBg: "--bluevue-panel-bg",
   hairline: "--bluevue-hairline"
 };
-function Tt(c, n = document.documentElement) {
-  for (const [e, t] of Object.entries(_t)) {
+function Vt(c, n = document.documentElement) {
+  for (const [e, t] of Object.entries(Tt)) {
     const o = c[e];
     o && n.style.setProperty(t, o);
   }
 }
-const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
+const Ft = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
   __name: "BlueIcon",
   props: {
     name: {},
@@ -127,19 +127,19 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
     label: {}
   },
   setup(c) {
-    const n = c, e = w(() => n.name.startsWith("mdi-") ? n.name : `mdi-${n.name}`), t = w(() => {
+    const n = c, e = k(() => n.name.startsWith("mdi-") ? n.name : `mdi-${n.name}`), t = k(() => {
       const o = n.size ?? 20;
       return typeof o == "number" ? `${o}px` : o;
     });
     return (o, l) => (a(), d("span", {
-      class: b(["mdi bluevue-icon", [e.value, o.spin ? "bluevue-icon--spin" : ""]]),
+      class: y(["mdi bluevue-icon", [e.value, o.spin ? "bluevue-icon--spin" : ""]]),
       style: D({ width: t.value, height: t.value, fontSize: t.value, color: o.color }),
       role: o.label ? "img" : void 0,
       "aria-label": o.label,
       "aria-hidden": o.label ? void 0 : "true"
-    }, null, 14, Vt));
+    }, null, 14, Ft));
   }
-}), Ft = {
+}), _t = {
   key: 0,
   class: "bluevue-elevation-1 relative flex items-center gap-5 rounded-t-[8px] bg-[#15151577] px-5 py-3"
 }, Mt = ["src"], St = { class: "truncate text-lg font-medium" }, Rt = { class: "ml-auto flex shrink-0 items-center gap-1" }, zt = {
@@ -159,7 +159,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
       class: "bluevue-elevation-5 mx-auto w-full rounded-[8px] bg-[var(--bluevue-surface)] text-white",
       style: D({ maxWidth: n.width || "615px" })
     }, [
-      n.title || n.$slots.header || n.$slots.actions ? (a(), d("header", Ft, [
+      n.title || n.$slots.header || n.$slots.actions ? (a(), d("header", _t, [
         j(n.$slots, "header", {}, () => [
           n.logo ? (a(), d("img", {
             key: 0,
@@ -178,7 +178,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
         ])
       ])) : C("", !0),
       i("div", {
-        class: b(n.bodyClass || "px-5 py-4")
+        class: y(n.bodyClass || "px-5 py-4")
       }, [
         j(n.$slots, "default")
       ], 2),
@@ -196,7 +196,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
     label: {}
   },
   setup(c) {
-    const n = c, e = w(() => {
+    const n = c, e = k(() => {
       const t = n.size ?? 20;
       return typeof t == "number" ? `${t}px` : t;
     });
@@ -229,7 +229,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
   },
   emits: ["click"],
   setup(c) {
-    const n = c, e = { compact: 24, regular: 30, comfortable: 36 }, t = { compact: "px-2", regular: "px-3", comfortable: "px-4" }, o = w(() => n.variant ?? "tonal"), l = w(() => n.density ?? "regular"), s = w(() => n.theme !== "light"), u = w(() => e[l.value]), r = w(() => l.value === "compact" ? 14 : 16), v = w(() => {
+    const n = c, e = { compact: 24, regular: 30, comfortable: 36 }, t = { compact: "px-2", regular: "px-3", comfortable: "px-4" }, o = k(() => n.variant ?? "tonal"), l = k(() => n.density ?? "regular"), s = k(() => n.theme !== "light"), u = k(() => e[l.value]), r = k(() => l.value === "compact" ? 14 : 16), v = k(() => {
       if (n.disabled)
         return o.value === "text" || o.value === "icon" ? "opacity-30 cursor-not-allowed" : "opacity-30 cursor-not-allowed bg-[#9e9e9e80] text-[#afafaf]";
       switch (o.value) {
@@ -242,16 +242,16 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
         default:
           return s.value ? "cursor-pointer bg-[#ffffff11] text-white hover:bg-[#ffffff22]" : "cursor-pointer bg-[#00000011] text-black hover:bg-[#00000022]";
       }
-    }), f = w(() => o.value === "filled" && !n.disabled ? n.color || "var(--bluevue-primary)" : void 0), x = w(
+    }), f = k(() => o.value === "filled" && !n.disabled ? n.color || "var(--bluevue-primary)" : void 0), x = k(
       () => n.color && (o.value === "text" || o.value === "icon") ? n.color : void 0
     );
-    return (p, F) => (a(), d("button", {
+    return (p, _) => (a(), d("button", {
       type: p.type || "button",
       disabled: p.disabled,
       title: p.tooltip,
       "aria-label": o.value === "icon" ? p.tooltip : void 0,
       "aria-busy": p.loading || void 0,
-      class: b(["inline-flex shrink-0 select-none items-center justify-center gap-2 whitespace-nowrap transition-colors duration-200", [
+      class: y(["inline-flex shrink-0 select-none items-center justify-center gap-2 whitespace-nowrap transition-colors duration-200", [
         v.value,
         o.value === "icon" ? "rounded-[6px]" : "rounded-[4px]",
         o.value === "icon" ? "" : t[l.value],
@@ -265,7 +265,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
         width: o.value === "icon" ? `${u.value}px` : void 0,
         backgroundColor: f.value
       }),
-      onClick: F[0] || (F[0] = ($) => p.$emit("click", $))
+      onClick: _[0] || (_[0] = ($) => p.$emit("click", $))
     }, [
       p.loading ? (a(), U(It, {
         key: 0,
@@ -279,7 +279,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
       }, null, 8, ["name", "size", "color"])) : C("", !0),
       o.value !== "icon" ? (a(), d("span", {
         key: 2,
-        class: b(["min-w-0 truncate font-medium uppercase tracking-wide", l.value === "compact" ? "text-[12px]" : "text-[13px]"])
+        class: y(["min-w-0 truncate font-medium uppercase tracking-wide", l.value === "compact" ? "text-[12px]" : "text-[13px]"])
       }, [
         j(p.$slots, "default")
       ], 2)) : C("", !0),
@@ -314,9 +314,9 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
   },
   emits: ["update:modelValue"],
   setup(c, { expose: n, emit: e }) {
-    const t = c, o = e, l = Ke(), s = q(null), u = w(() => !!(t.title || l.header)), r = (p) => {
-      const F = s.value;
-      F && (p && !F.open && F.showModal(), !p && F.open && F.close());
+    const t = c, o = e, l = Ke(), s = q(null), u = k(() => !!(t.title || l.header)), r = (p) => {
+      const _ = s.value;
+      _ && (p && !_.open && _.showModal(), !p && _.open && _.close());
     };
     pe(() => r(t.modelValue)), X(() => t.modelValue, r);
     const v = () => {
@@ -327,11 +327,11 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
     }, x = (p) => {
       !t.persistent && p.target === s.value && v();
     };
-    return n({ close: v }), (p, F) => (a(), d("dialog", {
+    return n({ close: v }), (p, _) => (a(), d("dialog", {
       ref_key: "dialogRef",
       ref: s,
       class: "bluevue-dialog",
-      onClose: F[0] || (F[0] = ($) => o("update:modelValue", !1)),
+      onClose: _[0] || (_[0] = ($) => o("update:modelValue", !1)),
       onCancel: f,
       onClick: x
     }, [
@@ -369,7 +369,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
           onClick: v
         })),
         i("div", {
-          class: b([p.bodyClass || "px-5 py-4", u.value ? "border-t border-[#ffffff0d]" : ""])
+          class: y([p.bodyClass || "px-5 py-4", u.value ? "border-t border-[#ffffff0d]" : ""])
         }, [
           j(p.$slots, "default")
         ], 2),
@@ -381,7 +381,7 @@ const Vt = ["role", "aria-label", "aria-hidden"], H = /* @__PURE__ */ L({
   }
 }), Ut = ["src"], Kt = {
   key: 0,
-  class: "mt-[15px] text-center text-base text-white"
+  class: "mt-[5px] text-center text-base text-white"
 }, Gt = /* @__PURE__ */ L({
   __name: "BlueLoadingDialog",
   props: {
@@ -445,7 +445,7 @@ const Zt = { class: "min-w-0 flex-1 text-[13px] leading-snug" }, Qt = {
       error: { icon: "mdi-alert-circle-outline", color: "var(--bluevue-error)" },
       warning: { icon: "mdi-alert-outline", color: "#FFB74D" },
       info: { icon: "mdi-information-outline", color: "#42A5F5" }
-    }, l = w(() => {
+    }, l = k(() => {
       switch (n.position) {
         case "bottom-left":
           return "bottom-4 left-4 items-start";
@@ -456,12 +456,12 @@ const Zt = { class: "min-w-0 flex-1 text-[13px] leading-snug" }, Qt = {
         default:
           return "bottom-4 right-4 items-end";
       }
-    }), s = w(() => {
+    }), s = k(() => {
       var u;
       return (u = n.position) != null && u.startsWith("top") ? [...e.value].reverse() : e.value;
     });
     return (u, r) => (a(), d("div", {
-      class: b(["pointer-events-none fixed z-[2000] flex max-w-[min(90vw,420px)] flex-col gap-2", l.value]),
+      class: y(["pointer-events-none fixed z-[2000] flex max-w-[min(90vw,420px)] flex-col gap-2", l.value]),
       role: "status",
       "aria-live": "polite"
     }, [
@@ -508,7 +508,7 @@ const Zt = { class: "min-w-0 flex-1 text-[13px] leading-snug" }, Qt = {
     return X(
       o,
       (l) => {
-        !n.ignoreHostTheme && l && Tt({ primary: l });
+        !n.ignoreHostTheme && l && Vt({ primary: l });
       },
       { immediate: !0 }
     ), (l, s) => (a(), d("div", {
@@ -568,20 +568,20 @@ const Zt = { class: "min-w-0 flex-1 text-[13px] leading-snug" }, Qt = {
       warning: { icon: "mdi-alert", color: "#FFB74D", background: "#FB8C0022", border: "#FB8C0055" },
       info: { icon: "mdi-information-outline", color: "#81D4FA", background: "#4FC3F71A", border: "#4FC3F744" },
       success: { icon: "mdi-check-circle-outline", color: "#A5D6A7", background: "#66BB6A22", border: "#66BB6A55" }
-    }, t = c, o = n, l = q(null), s = q(null), u = q(null), r = q(t.expanded ?? !0), v = q(0), f = q(!1), x = w(() => e[t.severity ?? "info"]), p = w(() => ({
+    }, t = c, o = n, l = q(null), s = q(null), u = q(null), r = q(t.expanded ?? !0), v = q(0), f = q(!1), x = k(() => e[t.severity ?? "info"]), p = k(() => ({
       color: t.color ?? x.value.color,
       backgroundColor: t.background ?? x.value.background,
       borderColor: t.border ?? x.value.border
-    })), F = w(() => r.value ? f.value ? { width: `${v.value}px` } : void 0 : { width: "0px" }), $ = w(() => f.value ? { width: `${v.value}px` } : void 0);
-    function V() {
-      const m = l.value, T = s.value, E = u.value;
-      if (!m || !T || !E)
+    })), _ = k(() => r.value ? f.value ? { width: `${v.value}px` } : void 0 : { width: "0px" }), $ = k(() => f.value ? { width: `${v.value}px` } : void 0);
+    function F() {
+      const m = l.value, V = s.value, E = u.value;
+      if (!m || !V || !E)
         return;
-      const k = m.style.cssText, A = T.style.cssText, K = E.style.cssText, Y = () => {
-        m.style.cssText = k, T.style.cssText = A, E.style.cssText = K, T.getBoundingClientRect(), m.classList.remove("bluevue-banner--measuring");
+      const w = m.style.cssText, A = V.style.cssText, K = E.style.cssText, Y = () => {
+        m.style.cssText = w, V.style.cssText = A, E.style.cssText = K, V.getBoundingClientRect(), m.classList.remove("bluevue-banner--measuring");
       };
-      m.classList.add("bluevue-banner--measuring"), m.style.width = "100%", T.style.flex = "1 1 auto", T.style.width = "auto", E.style.width = "0px";
-      const te = T.getBoundingClientRect().width;
+      m.classList.add("bluevue-banner--measuring"), m.style.width = "100%", V.style.flex = "1 1 auto", V.style.width = "auto", E.style.width = "0px";
+      const te = V.getBoundingClientRect().width;
       if (te <= 0) {
         Y();
         return;
@@ -591,27 +591,27 @@ const Zt = { class: "min-w-0 flex-1 text-[13px] leading-snug" }, Qt = {
       v.value = Math.min(ee, Math.floor(te)), Y(), f.value = !0;
     }
     function R() {
-      V(), r.value = !r.value, o("update:expanded", r.value);
+      F(), r.value = !r.value, o("update:expanded", r.value);
     }
     let P = null;
     return pe(() => {
-      var T, E;
-      V(), (T = document.fonts) == null || T.ready.then(V);
+      var V, E;
+      F(), (V = document.fonts) == null || V.ready.then(F);
       const m = (E = l.value) == null ? void 0 : E.parentElement;
       if (m) {
-        let k = m.clientWidth;
+        let w = m.clientWidth;
         P = new ResizeObserver(() => {
-          m.clientWidth !== k && (k = m.clientWidth, requestAnimationFrame(V));
+          m.clientWidth !== w && (w = m.clientWidth, requestAnimationFrame(F));
         }), P.observe(m);
       }
     }), me(() => {
       P == null || P.disconnect(), P = null;
-    }), X(() => t.text, V, { flush: "post" }), X(
+    }), X(() => t.text, F, { flush: "post" }), X(
       () => t.expanded,
       (m) => {
         m !== void 0 && (r.value = m);
       }
-    ), (m, T) => (a(), d("button", {
+    ), (m, V) => (a(), d("button", {
       ref_key: "box",
       ref: l,
       type: "button",
@@ -623,13 +623,13 @@ const Zt = { class: "min-w-0 flex-1 text-[13px] leading-snug" }, Qt = {
       onClick: R
     }, [
       i("span", {
-        class: b(["mdi bluevue-banner__icon shrink-0", t.icon ?? x.value.icon])
+        class: y(["mdi bluevue-banner__icon shrink-0", t.icon ?? x.value.icon])
       }, null, 2),
       i("span", {
         ref_key: "reveal",
         ref: s,
-        class: b(["bluevue-banner__reveal overflow-hidden", f.value ? "shrink-0" : ""]),
-        style: D(F.value)
+        class: y(["bluevue-banner__reveal overflow-hidden", f.value ? "shrink-0" : ""]),
+        style: D(_.value)
       }, [
         i("span", {
           ref_key: "label",
@@ -685,11 +685,11 @@ const sl = () => {
 });
 function ye(c = {}) {
   sl();
-  const n = q(null), e = q(null), t = q(!1), o = `bluevue-popover-${++nl}`, l = q(null), s = w(() => {
+  const n = q(null), e = q(null), t = q(!1), o = `bluevue-popover-${++nl}`, l = q(null), s = k(() => {
     if (!l.value) return null;
-    const [$, V] = l.value;
-    return { getBoundingClientRect: () => new DOMRect($, V, 0, 0) };
-  }), u = w(() => t.value ? s.value ?? n.value : null), { floatingStyles: r, isPositioned: v } = ft(u, e, {
+    const [$, F] = l.value;
+    return { getBoundingClientRect: () => new DOMRect($, F, 0, 0) };
+  }), u = k(() => t.value ? s.value ?? n.value : null), { floatingStyles: r, isPositioned: v } = ft(u, e, {
     // Stated so isPositioned drops back to false on close, and a second open is held invisible
     // until it has been placed rather than showing for a frame at wherever it last was.
     open: t,
@@ -701,8 +701,8 @@ function ye(c = {}) {
       bt({ padding: 8 }),
       yt({ padding: 8 }),
       ...c.matchAnchorWidth ? [gt({
-        apply: ({ rects: $, elements: V }) => {
-          V.floating.style.minWidth = `${$.reference.width}px`;
+        apply: ({ rects: $, elements: F }) => {
+          F.floating.style.minWidth = `${$.reference.width}px`;
         }
       })] : []
     ]
@@ -717,8 +717,8 @@ function ye(c = {}) {
     isPositioned: v,
     floatingStyles: r,
     show: async ($) => {
-      const V = ++f;
-      if (l.value = $ ?? null, await _e(), Se && await al(), V !== f) return;
+      const F = ++f;
+      if (l.value = $ ?? null, await Te(), Se && await al(), F !== f) return;
       const R = e.value;
       !R || R.matches(":popover-open") || R.showPopover();
     },
@@ -752,19 +752,19 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       n.disabled || !n.text || (x(), f = window.setTimeout(() => {
         f = null, u();
       }, n.openDelay ?? 300));
-    }, F = () => {
+    }, _ = () => {
       x(), r();
     };
-    return me(x), ($, V) => (a(), d("span", {
+    return me(x), ($, F) => (a(), d("span", {
       ref_key: "anchorRef",
       ref: e,
       class: "inline-flex",
       "aria-describedby": $.text && !$.disabled ? M(o) : void 0,
       onMouseenter: p,
-      onMouseleave: F,
+      onMouseleave: _,
       onFocusin: p,
-      onFocusout: F,
-      onKeydown: de(F, ["escape"])
+      onFocusout: _,
+      onKeydown: de(_, ["escape"])
     }, [
       j($.$slots, "default"),
       i("div", {
@@ -774,12 +774,12 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         popover: "manual",
         class: "bluevue-popover",
         style: D(M(s)),
-        onToggle: V[0] || (V[0] = //@ts-ignore
+        onToggle: F[0] || (F[0] = //@ts-ignore
         (...R) => M(v) && M(v)(...R))
       }, [
         i("div", {
           role: "tooltip",
-          class: b(["bluevue-elevation-5 max-w-[280px] rounded-[4px] px-2 py-1 text-xs leading-snug transition-opacity duration-150", [
+          class: y(["bluevue-elevation-5 max-w-[280px] rounded-[4px] px-2 py-1 text-xs leading-snug transition-opacity duration-150", [
             $.theme === "light" ? "bg-white text-black" : "bg-[#333333f2] text-white",
             M(l) ? "opacity-100" : "opacity-0"
           ]])
@@ -826,99 +826,99 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       hide: x,
       onToggle: p
     } = ye();
-    let F = null, $ = !1;
-    const V = {
+    let _ = null, $ = !1;
+    const F = {
       compact: { class: "px-[11px]", total: 22 },
       regular: { class: "px-[15px]", total: 30 },
       comfortable: { class: "px-[19px]", total: 38 }
-    }, R = q(null), P = q(null), m = q(null), T = q(!1), E = q(!1);
-    let k = null;
+    }, R = q(null), P = q(null), m = q(null), V = q(!1), E = q(!1);
+    let w = null;
     const A = () => {
-      const y = m.value, S = R.value;
-      if (!y || !S) return;
-      const g = y.querySelectorAll("[data-bbg-label]"), I = V[e.density || "comfortable"].total;
-      let _ = 0;
+      const h = m.value, S = R.value;
+      if (!h || !S) return;
+      const g = h.querySelectorAll("[data-bbg-label]"), I = F[e.density || "comfortable"].total;
+      let T = 0;
       g.forEach((Q) => {
-        _ += Q.scrollWidth + I;
-      }), _ += Math.max(0, g.length - 1), T.value = _ > kl;
+        T += Q.scrollWidth + I;
+      }), T += Math.max(0, g.length - 1), V.value = T > kl;
       let G = P.value ? P.value.scrollWidth + xl : 0;
       for (const Q of Array.from(S.children))
-        Q.contains(y) && (G += Q.clientWidth - y.clientWidth);
-      E.value = _ > S.clientWidth - G;
+        Q.contains(h) && (G += Q.clientWidth - h.clientWidth);
+      E.value = T > S.clientWidth - G;
     }, K = () => {
-      const y = e.buttonItems;
+      const h = e.buttonItems;
       if (e.type === "switch") {
-        const S = y.findIndex((I) => I.preSelected), g = S >= 0 ? S : 0;
-        o.value = y.map((I, _) => _ === g);
+        const S = h.findIndex((I) => I.preSelected), g = S >= 0 ? S : 0;
+        o.value = h.map((I, T) => T === g);
       } else
-        o.value = y.map((S) => !!S.preSelected);
+        o.value = h.map((S) => !!S.preSelected);
       t("update:selected", o.value);
-    }, Y = (y) => {
+    }, Y = (h) => {
       var g, I;
-      if (e.disabled || e.buttonItems[y].disabled) return;
-      const S = e.buttonItems[y];
-      e.type === "switch" ? o.value[y] || (o.value = o.value.map((_, G) => G === y), (g = S.onSelected) == null || g.call(S)) : (o.value[y] = !o.value[y], o.value[y] && ((I = S.onSelected) == null || I.call(S))), t("update:selected", o.value);
-    }, te = (y, S) => {
-      e.disabled || e.buttonItems[y].disabled || t("context-menu", { item: e.buttonItems[y], index: y, x: S.clientX, y: S.clientY });
+      if (e.disabled || e.buttonItems[h].disabled) return;
+      const S = e.buttonItems[h];
+      e.type === "switch" ? o.value[h] || (o.value = o.value.map((T, G) => G === h), (g = S.onSelected) == null || g.call(S)) : (o.value[h] = !o.value[h], o.value[h] && ((I = S.onSelected) == null || I.call(S))), t("update:selected", o.value);
+    }, te = (h, S) => {
+      e.disabled || e.buttonItems[h].disabled || t("context-menu", { item: e.buttonItems[h], index: h, x: S.clientX, y: S.clientY });
     }, ee = () => {
-      F !== null && (clearTimeout(F), F = null);
-    }, re = (y, S) => {
-      if (e.disabled || e.buttonItems[y].disabled) return;
+      _ !== null && (clearTimeout(_), _ = null);
+    }, re = (h, S) => {
+      if (e.disabled || e.buttonItems[h].disabled) return;
       ee(), $ = !1;
       const { clientX: g, clientY: I } = S;
-      F = window.setTimeout(() => {
-        F = null, $ = !0, t("context-menu", { item: e.buttonItems[y], index: y, x: g, y: I });
+      _ = window.setTimeout(() => {
+        _ = null, $ = !0, t("context-menu", { item: e.buttonItems[h], index: h, x: g, y: I });
       }, wl);
-    }, fe = (y) => {
+    }, fe = (h) => {
       if ($) {
         $ = !1;
         return;
       }
-      e.buttonItems[y].disabled || Y(y);
-    }, ne = (y) => {
-      y.action(), x();
+      e.buttonItems[h].disabled || Y(h);
+    }, ne = (h) => {
+      h.action(), x();
     };
     return pe(() => {
-      var y;
-      K(), _e(A), (y = document.fonts) == null || y.ready.then(A), typeof ResizeObserver < "u" && m.value && (k = new ResizeObserver(() => A()), k.observe(m.value));
+      var h;
+      K(), Te(A), (h = document.fonts) == null || h.ready.then(A), typeof ResizeObserver < "u" && m.value && (w = new ResizeObserver(() => A()), w.observe(m.value));
     }), me(() => {
-      k == null || k.disconnect(), ee();
+      w == null || w.disconnect(), ee();
     }), X(
       () => e.buttonItems.length,
       K,
       { deep: !0, immediate: !0 }
     ), X(
-      () => e.buttonItems.map((y) => y.name).join("|"),
-      () => _e(A)
-    ), (y, S) => {
+      () => e.buttonItems.map((h) => h.name).join("|"),
+      () => Te(A)
+    ), (h, S) => {
       var g, I;
       return a(), d("div", {
         ref_key: "rowRef",
         ref: R,
         class: "flex w-full justify-between items-center"
       }, [
-        y.label ? (a(), d("div", ul, [
+        h.label ? (a(), d("div", ul, [
           i("label", {
             ref_key: "labelRef",
             ref: P,
-            class: b(["block truncate text-start mr-6", y.theme === "dark" ? "text-white" : "text-black"]),
-            title: y.label
-          }, B(y.label), 11, cl)
+            class: y(["block truncate text-start mr-6", [h.theme === "dark" ? "text-white" : "text-black", h.disabled ? "opacity-30" : ""]]),
+            title: h.label
+          }, B(h.label), 11, cl)
         ])) : (a(), d("div", dl)),
-        j(y.$slots, "insetElement"),
+        j(h.$slots, "insetElement"),
         i("div", pl, [
-          y.infoTooltip ? (a(), U(ie, {
+          h.infoTooltip ? (a(), U(ie, {
             key: 0,
-            text: y.infoTooltip,
-            theme: y.theme,
+            text: h.infoTooltip,
+            theme: h.theme,
             class: "items-center shrink-0 mr-2"
           }, {
             default: N(() => [
               O(H, {
                 name: "mdi-information-outline",
                 size: 16,
-                label: y.infoTooltip,
-                class: b(["opacity-60 cursor-help", y.theme === "dark" ? "text-white" : "text-black"])
+                label: h.infoTooltip,
+                class: y(["cursor-help", [h.disabled ? "opacity-30" : "opacity-60", h.theme === "dark" ? "text-white" : "text-black"]])
               }, null, 8, ["label", "class"])
             ]),
             _: 1
@@ -926,31 +926,31 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
           i("div", {
             ref_key: "trackRef",
             ref: m,
-            class: b(["relative flex min-w-0 justify-end overflow-hidden rounded-[6px] bluevue-elevation-1 z-[666]", [y.theme === "dark" ? "bg-[#464646AA]" : "bg-[#00000011]", y.disabled ? "opacity-30 pointer-events-none" : ""]]),
-            style: D({ height: y.height || (y.density === "compact" ? "24px" : "30px") })
+            class: y(["relative flex min-w-0 justify-end overflow-hidden rounded-[6px] bluevue-elevation-1 z-[666]", [h.theme === "dark" ? "bg-[#464646AA]" : "bg-[#00000011]", h.disabled ? "opacity-30 pointer-events-none" : ""]]),
+            style: D({ height: h.height || (h.density === "compact" ? "24px" : "30px") })
           }, [
             ml,
-            (a(!0), d(J, null, Z(y.buttonItems, (_, G) => (a(), d(J, {
-              key: _.name
+            (a(!0), d(J, null, Z(h.buttonItems, (T, G) => (a(), d(J, {
+              key: T.name
             }, [
               i("button", {
-                disabled: y.disabled || _.disabled,
-                title: _.name,
-                class: b(["flex min-w-0 items-center justify-center text-sm font-medium transition-colors duration-200", [
+                disabled: h.disabled || T.disabled,
+                title: T.name,
+                class: y(["flex min-w-0 items-center justify-center text-sm font-medium transition-colors duration-200", [
                   // A group with no room left falls back to the tightest inset whatever the
                   // density asks for, since the alternative is cutting into the names.
-                  E.value ? V.compact.class : V[y.density || "comfortable"].class,
+                  E.value ? F.compact.class : F[h.density || "comfortable"].class,
                   // The active choice is the one worth reading at a glance, so it keeps its full
                   // name and the rest give up the room a crowded group needs.
                   o.value[G] ? "shrink-0" : "",
-                  o.value[G] ? "text-white" : y.theme === "dark" ? "text-[#ffffff99]" : "text-[#00000066]",
-                  o.value[G] && y.type === "switch" ? "bluevue-elevation-5" : "",
-                  y.disabled || _.disabled ? "cursor-not-allowed" : "cursor-pointer",
+                  o.value[G] ? "text-white" : h.theme === "dark" ? "text-[#ffffff99]" : "text-[#00000066]",
+                  o.value[G] && h.type === "switch" ? "bluevue-elevation-5" : "",
+                  h.disabled || T.disabled ? "cursor-not-allowed" : "cursor-pointer",
                   // Only the button's own state fades it: a disabled group is faded whole by the
                   // track below, and dimming twice over would leave the names unreadable.
-                  _.disabled ? "opacity-30" : ""
+                  T.disabled ? "opacity-30" : ""
                 ]]),
-                style: D({ backgroundColor: o.value[G] ? _.activeColor || "var(--bluevue-primary)" : void 0 }),
+                style: D({ backgroundColor: o.value[G] ? T.activeColor || "var(--bluevue-primary)" : void 0 }),
                 onClick: (Q) => fe(G),
                 onContextmenu: ae((Q) => te(G, Q), ["prevent"]),
                 onPointerdown: (Q) => re(G, Q),
@@ -959,30 +959,30 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
                 onPointercancel: ee
               }, [
                 O(ie, {
-                  text: _.tooltip || "",
-                  theme: y.theme,
+                  text: T.tooltip || "",
+                  theme: h.theme,
                   class: "min-w-0"
                 }, {
                   default: N(() => [
                     i("span", {
                       "data-bbg-label": "",
-                      class: b(["block truncate", [y.density === "compact" ? "text-[10px]" : "text-xs", T.value ? "max-w-[150px]" : ""]])
-                    }, B(_.name), 3)
+                      class: y(["block truncate", [h.density === "compact" ? "text-[10px]" : "text-xs", V.value ? "max-w-[150px]" : ""]])
+                    }, B(T.name), 3)
                   ]),
                   _: 2
                 }, 1032, ["text", "theme"])
               ], 46, fl),
-              G < y.buttonItems.length - 1 ? (a(), d("div", vl)) : C("", !0)
+              G < h.buttonItems.length - 1 ? (a(), d("div", vl)) : C("", !0)
             ], 64))), 128)),
-            (g = y.buttonsMenu) != null && g.length ? (a(), d("div", hl)) : C("", !0),
-            (I = y.buttonsMenu) != null && I.length ? (a(), d(J, { key: 1 }, [
+            (g = h.buttonsMenu) != null && g.length ? (a(), d("div", hl)) : C("", !0),
+            (I = h.buttonsMenu) != null && I.length ? (a(), d(J, { key: 1 }, [
               i("button", ke({
                 ref_key: "menuAnchorRef",
                 ref: l
               }, M(r), {
                 type: "button",
                 title: "More options",
-                class: ["shrink-0 px-0 flex items-center justify-center h-full cursor-pointer", y.theme === "dark" ? "text-white" : "text-black"]
+                class: ["shrink-0 px-0 flex items-center justify-center h-full cursor-pointer", h.theme === "dark" ? "text-white" : "text-black"]
               }), yl, 16),
               i("div", {
                 id: M(u),
@@ -992,27 +992,27 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
                 class: "bluevue-popover",
                 style: D(M(f)),
                 onToggle: S[0] || (S[0] = //@ts-ignore
-                (..._) => M(p) && M(p)(..._))
+                (...T) => M(p) && M(p)(...T))
               }, [
                 i("ul", {
-                  class: b(["bluevue-elevation-5 max-h-[60vh] overflow-y-auto border-[1px] rounded-[4px] border-[#FFFFFF22]", [
-                    y.theme === "dark" ? "text-[#FFFFFF99] bg-[var(--bluevue-surface)]" : "text-black bg-white",
+                  class: y(["bluevue-elevation-5 max-h-[60vh] overflow-y-auto border-[1px] rounded-[4px] border-[#FFFFFF22]", [
+                    h.theme === "dark" ? "text-[#FFFFFF99] bg-[var(--bluevue-surface)]" : "text-black bg-white",
                     M(v) ? "opacity-100" : "opacity-0"
                   ]])
                 }, [
-                  (a(!0), d(J, null, Z(y.buttonsMenu, (_, G) => (a(), d("li", {
-                    key: _.name
+                  (a(!0), d(J, null, Z(h.buttonsMenu, (T, G) => (a(), d("li", {
+                    key: T.name
                   }, [
                     i("button", {
-                      disabled: _.menuItemDisabled,
+                      disabled: T.menuItemDisabled,
                       type: "button",
-                      class: b(["block w-full text-left whitespace-nowrap px-4 py-2 text-[14px]", [
-                        G < y.buttonsMenu.length - 1 ? "border-b border-white" : "",
-                        y.theme === "dark" ? "hover:bg-[#333333]" : "hover:bg-gray-100",
-                        _.menuItemDisabled ? "opacity-30 cursor-not-allowed" : "cursor-pointer"
+                      class: y(["block w-full text-left whitespace-nowrap px-4 py-2 text-[14px]", [
+                        G < h.buttonsMenu.length - 1 ? "border-b border-white" : "",
+                        h.theme === "dark" ? "hover:bg-[#333333]" : "hover:bg-gray-100",
+                        T.menuItemDisabled ? "opacity-30 cursor-not-allowed" : "cursor-pointer"
                       ]]),
-                      onClick: (Q) => ne(_)
-                    }, B(_.name), 11, ql)
+                      onClick: (Q) => ne(T)
+                    }, B(T.name), 11, ql)
                   ]))), 128))
                 ], 2)
               ], 44, gl)
@@ -1022,7 +1022,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       ], 512);
     };
   }
-}), $l = { class: "flex w-full items-center justify-between" }, Bl = ["for", "title"], Cl = { key: 1 }, _l = { class: "ml-auto flex shrink-0 items-center" }, Tl = ["id", "name", "checked", "disabled", "aria-checked"], Bo = /* @__PURE__ */ L({
+}), $l = { class: "flex w-full items-center justify-between" }, Bl = ["for", "title"], Cl = { key: 1 }, Tl = { class: "ml-auto flex shrink-0 items-center" }, Vl = ["id", "name", "checked", "disabled", "aria-checked"], Bo = /* @__PURE__ */ L({
   __name: "BlueCheckbox",
   props: {
     modelValue: { type: [Boolean, null] },
@@ -1036,17 +1036,17 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
   },
   emits: ["update:modelValue"],
   setup(c, { emit: n }) {
-    const e = c, t = n, o = w(() => e.modelValue === !0), l = () => {
+    const e = c, t = n, o = k(() => e.modelValue === !0), l = () => {
       e.disabled || t("update:modelValue", e.indeterminate ? !0 : !o.value);
     };
     return (s, u) => (a(), d("div", $l, [
       s.label ? (a(), d("label", {
         key: 0,
         for: s.name,
-        class: b(["min-w-0 max-w-[45%] shrink-0 truncate text-start mr-6", [s.theme === "dark" ? "text-white" : "text-black", s.disabled ? "opacity-30" : "cursor-pointer"]]),
+        class: y(["min-w-0 max-w-[45%] shrink-0 truncate text-start mr-6", [s.theme === "dark" ? "text-white" : "text-black", s.disabled ? "opacity-30" : "cursor-pointer"]]),
         title: s.label
       }, B(s.label), 11, Bl)) : (a(), d("div", Cl)),
-      i("div", _l, [
+      i("div", Tl, [
         s.infoTooltip ? (a(), U(ie, {
           key: 0,
           text: s.infoTooltip,
@@ -1058,13 +1058,13 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               name: "mdi-information-outline",
               size: 16,
               label: s.infoTooltip,
-              class: b(["opacity-60 cursor-help", s.theme === "dark" ? "text-white" : "text-black"])
+              class: y(["cursor-help", [s.disabled ? "opacity-30" : "opacity-60", s.theme === "dark" ? "text-white" : "text-black"]])
             }, null, 8, ["label", "class"])
           ]),
           _: 1
         }, 8, ["text", "theme"])) : C("", !0),
         i("label", {
-          class: b(["relative inline-flex items-center", s.disabled ? "opacity-30" : "cursor-pointer"])
+          class: y(["relative inline-flex items-center", s.disabled ? "opacity-30" : "cursor-pointer"])
         }, [
           i("input", {
             id: s.name,
@@ -1075,9 +1075,9 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             disabled: s.disabled,
             "aria-checked": s.indeterminate ? "mixed" : o.value,
             onChange: l
-          }, null, 40, Tl),
+          }, null, 40, Vl),
           i("span", {
-            class: b(["bluevue-elevation-1 flex h-[18px] w-[18px] items-center justify-center rounded-[4px] border transition-colors peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-[var(--bluevue-accent)]", [
+            class: y(["bluevue-elevation-1 flex h-[18px] w-[18px] items-center justify-center rounded-[4px] border transition-colors peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-[var(--bluevue-accent)]", [
               o.value || s.indeterminate ? "border-transparent" : s.theme === "dark" ? "border-[#ffffff44] bg-[#00000022]" : "border-[#00000044] bg-white"
             ]]),
             style: D({ backgroundColor: o.value || s.indeterminate ? s.color || "var(--bluevue-primary)" : void 0 })
@@ -1093,7 +1093,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       ])
     ]));
   }
-}), Vl = { class: "min-w-0 truncate" }, Fl = ["aria-label"], Ml = /* @__PURE__ */ L({
+}), Fl = { class: "min-w-0 truncate" }, _l = ["aria-label"], Ml = /* @__PURE__ */ L({
   __name: "BlueChip",
   props: {
     label: {},
@@ -1111,13 +1111,13 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       warning: "#FFB74D",
       info: "#42A5F5",
       neutral: "#90A4AE"
-    }, t = w(() => e[n.color ?? "neutral"] ?? n.color ?? e.neutral), o = w(() => n.variant === "filled"), l = w(() => ({
+    }, t = k(() => e[n.color ?? "neutral"] ?? n.color ?? e.neutral), o = k(() => n.variant === "filled"), l = k(() => ({
       color: o.value ? "#ffffff" : t.value,
       backgroundColor: o.value ? t.value : n.variant === "outlined" ? "transparent" : `color-mix(in srgb, ${t.value} 18%, transparent)`,
       borderColor: n.variant === "outlined" ? t.value : "transparent"
     }));
     return (s, u) => (a(), d("span", {
-      class: b(["inline-flex max-w-full shrink-0 items-center gap-1 whitespace-nowrap rounded-full border", s.size === "small" ? "h-[18px] px-2 text-[11px]" : "h-[22px] px-[10px] text-[12px]"]),
+      class: y(["inline-flex max-w-full shrink-0 items-center gap-1 whitespace-nowrap rounded-full border", s.size === "small" ? "h-[18px] px-2 text-[11px]" : "h-[22px] px-[10px] text-[12px]"]),
       style: D(l.value)
     }, [
       s.icon ? (a(), U(H, {
@@ -1125,7 +1125,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         name: s.icon,
         size: s.size === "small" ? 12 : 14
       }, null, 8, ["name", "size"])) : C("", !0),
-      i("span", Vl, [
+      i("span", Fl, [
         j(s.$slots, "default", {}, () => [
           oe(B(s.label), 1)
         ])
@@ -1141,7 +1141,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
           name: "mdi-close",
           size: s.size === "small" ? 12 : 14
         }, null, 8, ["size"])
-      ], 8, Fl)) : C("", !0)
+      ], 8, _l)) : C("", !0)
     ], 6));
   }
 }), Sl = {
@@ -1208,7 +1208,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       _: 3
     }, 8, ["model-value", "title", "icon", "icon-color"]));
   }
-}), Rl = { class: "rounded-lg overflow-hidden" }, zl = { class: "flex-1 flex items-center" }, Dl = ["title"], _o = /* @__PURE__ */ L({
+}), Rl = { class: "rounded-lg overflow-hidden" }, zl = { class: "flex-1 flex items-center" }, Dl = ["title"], To = /* @__PURE__ */ L({
   __name: "BlueExpansiblePanel",
   props: {
     title: {},
@@ -1233,18 +1233,18 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       }, [
         i("div", zl, [
           i("div", {
-            class: b(["flex-1 h-px", e.theme === "dark" ? "bg-[#ffffff22]" : "bg-[#00000033]"])
+            class: y(["flex-1 h-px", e.theme === "dark" ? "bg-[#ffffff22]" : "bg-[#00000033]"])
           }, null, 2),
           i("span", {
-            class: b(["mx-3 min-w-0 truncate text-sm font-medium opacity-60", e.theme === "dark" ? "text-white" : "text-black"]),
+            class: y(["mx-3 min-w-0 truncate text-sm font-medium opacity-60", e.theme === "dark" ? "text-white" : "text-black"]),
             title: s.title
           }, B(s.title), 11, Dl),
           i("div", {
-            class: b(["flex-1 h-px", e.theme === "dark" ? "bg-[#ffffff11]" : "bg-[#00000033]"])
+            class: y(["flex-1 h-px", e.theme === "dark" ? "bg-[#ffffff11]" : "bg-[#00000033]"])
           }, null, 2)
         ]),
         i("span", {
-          class: b(["mdi ml-3 text-[24px] leading-none opacity-40", [
+          class: y(["mdi ml-3 text-[24px] leading-none opacity-40", [
             o.value ? "mdi-menu-up" : "mdi-menu-down",
             e.theme === "dark" ? "text-white" : "text-black"
           ]])
@@ -1252,8 +1252,8 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       ]),
       O(pt, { name: "bluevue-expand" }, {
         default: N(() => [
-          Te(i("div", {
-            class: b(["px-13 my-6 pb-2", e.theme === "dark" ? "border-[#555555]" : "border-[#dddddd]"])
+          Ve(i("div", {
+            class: y(["px-13 my-6 pb-2", e.theme === "dark" ? "border-[#555555]" : "border-[#dddddd]"])
           }, [
             j(s.$slots, "default")
           ], 2), [
@@ -1267,7 +1267,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
 }), Ll = { class: "text-[13px]" }, Pl = {
   key: 0,
   class: "text-[11px] opacity-60"
-}, Il = ["accept", "multiple"], To = /* @__PURE__ */ L({
+}, Il = ["accept", "multiple"], Vo = /* @__PURE__ */ L({
   __name: "BlueFileDrop",
   props: {
     accept: {},
@@ -1289,17 +1289,17 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       u(x.files), x.value = "";
     };
     return (f, x) => (a(), d("div", {
-      class: b(["w-full", f.disabled ? "pointer-events-none opacity-30" : ""])
+      class: y(["w-full", f.disabled ? "pointer-events-none opacity-30" : ""])
     }, [
       i("button", {
         type: "button",
-        class: b(["flex w-full cursor-pointer flex-col items-center justify-center gap-1 rounded-[8px] border border-dashed px-4 py-6 text-center transition-colors", [
+        class: y(["flex w-full cursor-pointer flex-col items-center justify-center gap-1 rounded-[8px] border border-dashed px-4 py-6 text-center transition-colors", [
           l.value ? "border-[var(--bluevue-accent)] bg-[var(--bluevue-accent)]/10" : f.theme === "light" ? "border-[#00000033] hover:bg-[#00000006]" : "border-[#ffffff33] hover:bg-[#ffffff08]",
           f.theme === "light" ? "text-black" : "text-white"
         ]]),
         onClick: x[0] || (x[0] = (p) => {
-          var F;
-          return (F = o.value) == null ? void 0 : F.click();
+          var _;
+          return (_ = o.value) == null ? void 0 : _.click();
         }),
         onDragenter: x[1] || (x[1] = ae((p) => {
           s.value += 1, l.value = !0;
@@ -1361,7 +1361,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
   },
   emits: ["update:modelValue"],
   setup(c, { emit: n }) {
-    const e = c, t = n, o = w(() => e.errorMessages && e.errorMessages.length > 0), l = w(() => /^[°′″'"]+$/.test(e.suffix ?? "")), s = w(() => e.theme === "dark" ? "#FFFFFF11" : "#00000011"), u = /^-?\d*\.?\d*$/, r = (m) => m == null ? "" : String(m), v = q(r(e.modelValue)), f = q(null), x = q(!1);
+    const e = c, t = n, o = k(() => e.errorMessages && e.errorMessages.length > 0), l = k(() => /^[°′″'"]+$/.test(e.suffix ?? "")), s = k(() => e.theme === "dark" ? "#FFFFFF11" : "#00000011"), u = /^-?\d*\.?\d*$/, r = (m) => m == null ? "" : String(m), v = q(r(e.modelValue)), f = q(null), x = q(!1);
     pe(() => {
       var m;
       e.autofocus && ((m = f.value) == null || m.focus());
@@ -1369,27 +1369,27 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
     const p = (m) => {
       if (e.type !== "number") return m;
       if (m.trim() === "") return null;
-      const T = Number(m);
-      return Number.isFinite(T) ? T : null;
-    }, F = (m) => {
-      const T = e.min !== void 0 ? Math.max(m, e.min) : m;
-      return e.max !== void 0 ? Math.min(T, e.max) : T;
+      const V = Number(m);
+      return Number.isFinite(V) ? V : null;
+    }, _ = (m) => {
+      const V = e.min !== void 0 ? Math.max(m, e.min) : m;
+      return e.max !== void 0 ? Math.min(V, e.max) : V;
     }, $ = (m) => {
-      const T = m.target;
-      if (e.type === "number" && !u.test(T.value)) {
-        T.value = v.value;
+      const V = m.target;
+      if (e.type === "number" && !u.test(V.value)) {
+        V.value = v.value;
         return;
       }
-      v.value = T.value;
+      v.value = V.value;
       const E = p(v.value);
       E === null && e.type === "number" || t("update:modelValue", E);
-    }, V = (m) => {
+    }, F = (m) => {
       if (e.type !== "number" || e.disabled) return;
-      const T = e.step ?? 1, E = typeof e.modelValue == "number" ? e.modelValue : Number(v.value) || 0, k = (String(T).split(".")[1] ?? "").length, A = F(Number((E + m * T).toFixed(k)));
+      const V = e.step ?? 1, E = typeof e.modelValue == "number" ? e.modelValue : Number(v.value) || 0, w = (String(V).split(".")[1] ?? "").length, A = _(Number((E + m * V).toFixed(w)));
       v.value = String(A), t("update:modelValue", A);
     }, R = () => {
       if (e.type === "number" && typeof e.modelValue == "number") {
-        const m = F(e.modelValue);
+        const m = _(e.modelValue);
         if (m !== e.modelValue) {
           t("update:modelValue", m), v.value = String(m);
           return;
@@ -1404,13 +1404,13 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       (m) => {
         p(v.value) !== m && (v.value = r(m));
       }
-    ), (m, T) => {
+    ), (m, V) => {
       var E;
       return a(), d("div", El, [
         m.label ? (a(), d("div", Al, [
           i("label", {
             for: m.name,
-            class: b(["block truncate text-start mr-6", m.theme === "dark" ? "text-white" : "text-black"]),
+            class: y(["block truncate text-start mr-6", [m.theme === "dark" ? "text-white" : "text-black", m.disabled ? "opacity-30" : ""]]),
             title: m.label
           }, B(m.label), 11, jl)
         ])) : (a(), d("div", Ol)),
@@ -1426,14 +1426,14 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               name: "mdi-information-outline",
               size: 16,
               label: m.infoTooltip,
-              class: b(["opacity-60 cursor-help", m.theme === "dark" ? "text-white" : "text-black"])
+              class: y(["cursor-help", [m.disabled ? "opacity-30" : "opacity-60", m.theme === "dark" ? "text-white" : "text-black"]])
             }, null, 8, ["label", "class"])
           ]),
           _: 1
         }, 8, ["text", "theme"])) : C("", !0),
         i("div", Nl, [
           i("div", {
-            class: b(["relative flex items-center rounded-[6px] bluevue-inset-1 min-w-[90px] max-w-full", [
+            class: y(["relative flex items-center rounded-[6px] bluevue-inset-1 min-w-[90px] max-w-full", [
               m.disabled ? "opacity-30 pointer-events-none" : "",
               o.value ? "border-2 border-solid border-[var(--bluevue-error)]" : ""
             ]]),
@@ -1458,23 +1458,23 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               disabled: m.disabled,
               autofocus: m.autofocus,
               inputmode: m.type === "number" ? "decimal" : void 0,
-              class: b(["w-full min-w-0 bg-transparent text-sm font-medium outline-none", [
+              class: y(["w-full min-w-0 bg-transparent text-sm font-medium outline-none", [
                 m.$slots.prepend ? "pl-1" : "pl-4",
                 m.suffix ? "pr-1" : "pr-4",
                 m.theme === "dark" ? "text-white placeholder:text-[#ffffff44]" : "text-black placeholder:text-[#00000055]"
               ]]),
               onInput: $,
               onKeydown: [
-                T[0] || (T[0] = de(ae((k) => V(1), ["prevent"]), ["up"])),
-                T[1] || (T[1] = de(ae((k) => V(-1), ["prevent"]), ["down"])),
+                V[0] || (V[0] = de(ae((w) => F(1), ["prevent"]), ["up"])),
+                V[1] || (V[1] = de(ae((w) => F(-1), ["prevent"]), ["down"])),
                 de(R, ["enter"])
               ],
-              onFocus: T[2] || (T[2] = (k) => x.value = !0),
+              onFocus: V[2] || (V[2] = (w) => x.value = !0),
               onBlur: P
             }, null, 42, Ul),
             m.suffix ? (a(), d("span", {
               key: 1,
-              class: b(["shrink-0 pr-4 pl-1 text-sm select-none", [
+              class: y(["shrink-0 pr-4 pl-1 text-sm select-none", [
                 m.theme === "dark" ? "text-[#ffffff66]" : "text-[#00000066]",
                 l.value ? "translate-y-[0.22em]" : ""
               ]])
@@ -1500,9 +1500,9 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
     label: {}
   },
   setup(c) {
-    const n = c, e = w(() => Math.min(100, Math.max(0, n.modelValue ?? 0)));
+    const n = c, e = k(() => Math.min(100, Math.max(0, n.modelValue ?? 0)));
     return (t, o) => (a(), d("div", {
-      class: b(["bluevue-progress w-full overflow-hidden rounded-full", t.theme === "light" ? "bg-[#00000022]" : "bg-[#ffffff1a]"]),
+      class: y(["bluevue-progress w-full overflow-hidden rounded-full", t.theme === "light" ? "bg-[#00000022]" : "bg-[#ffffff1a]"]),
       style: D({ height: `${t.height ?? 4}px` }),
       role: "progressbar",
       "aria-label": t.label,
@@ -1511,7 +1511,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       "aria-valuemax": "100"
     }, [
       i("div", {
-        class: b(["h-full rounded-full", t.indeterminate ? "bluevue-progress__sweep" : "transition-[width] duration-200 ease-out"]),
+        class: y(["h-full rounded-full", t.indeterminate ? "bluevue-progress__sweep" : "transition-[width] duration-200 ease-out"]),
         style: D({
           width: t.indeterminate ? void 0 : `${e.value}%`,
           backgroundColor: t.color || "var(--bluevue-primary)"
@@ -1527,7 +1527,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
 ], t2 = { class: "flex w-[84px] shrink-0 flex-col items-center gap-1" }, l2 = ["title"], o2 = {
   key: 0,
   class: "mt-4 border-t border-[#ffffff0d] pt-4"
-}, n2 = { class: "mb-2 flex items-baseline justify-between" }, s2 = { class: "truncate text-xs text-[#ffffffcc]" }, a2 = { class: "flex shrink-0 gap-2 pl-3" }, We = 22, Vo = /* @__PURE__ */ L({
+}, n2 = { class: "mb-2 flex items-baseline justify-between" }, s2 = { class: "truncate text-xs text-[#ffffffcc]" }, a2 = { class: "flex shrink-0 gap-2 pl-3" }, We = 22, Fo = /* @__PURE__ */ L({
   __name: "BlueStepsDialog",
   props: {
     modelValue: { type: Boolean },
@@ -1551,7 +1551,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       running: { icon: "mdi-cog-sync", color: "#42A5F5" },
       failed: { icon: "mdi-alert-circle", color: "#EF5350" },
       done: { icon: "mdi-check-circle", color: "#66BB6A" }
-    }, u = w(() => s[e.state]), r = w(() => e.progress !== void 0 || e.indeterminate || !!o.log), v = q(null);
+    }, u = k(() => s[e.state]), r = k(() => e.progress !== void 0 || e.indeterminate || !!o.log), v = q(null);
     let f = null;
     const x = () => {
       const p = v.value;
@@ -1559,12 +1559,12 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
     };
     return X(v, (p) => {
       f == null || f.disconnect(), f = null, p && (f = new MutationObserver(x), f.observe(p, { childList: !0, subtree: !0, characterData: !0 }));
-    }), me(() => f == null ? void 0 : f.disconnect()), (p, F) => (a(), U($e, {
+    }), me(() => f == null ? void 0 : f.disconnect()), (p, _) => (a(), U($e, {
       "model-value": p.modelValue,
       persistent: p.state === "running",
       width: "620px",
       "body-class": "px-5 pb-4 pt-3",
-      "onUpdate:modelValue": F[0] || (F[0] = ($) => t("update:modelValue", $))
+      "onUpdate:modelValue": _[0] || (_[0] = ($) => t("update:modelValue", $))
     }, Ge({
       header: N(() => [
         O(H, {
@@ -1580,10 +1580,10 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       ]),
       default: N(() => [
         i("div", Zl, [
-          (a(!0), d(J, null, Z(p.steps, ($, V) => (a(), d(J, {
+          (a(!0), d(J, null, Z(p.steps, ($, F) => (a(), d(J, {
             key: $.key
           }, [
-            V ? (a(), d("div", {
+            F ? (a(), d("div", {
               key: 0,
               class: "flex flex-1 items-center",
               style: D({ height: `${We}px` })
@@ -1595,7 +1595,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
                 color: l[$.state].color
               }, null, 8, ["name", "color"]),
               i("span", {
-                class: b(["w-full truncate text-center text-[10px] leading-tight", $.state === "running" ? "text-white" : "text-[#ffffff77]"]),
+                class: y(["w-full truncate text-center text-[10px] leading-tight", $.state === "running" ? "text-white" : "text-[#ffffff77]"]),
                 title: $.detail || $.title
               }, B($.title), 11, l2)
             ])
@@ -1641,7 +1641,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
 }, u2 = ["disabled", "onClick"], c2 = { class: "min-w-0" }, d2 = { class: "block text-[13px] leading-snug" }, p2 = {
   key: 0,
   class: "block text-[10px] text-[#ffffff66]"
-}, Fo = /* @__PURE__ */ L({
+}, _o = /* @__PURE__ */ L({
   __name: "BlueMenu",
   props: {
     modelValue: { type: Boolean },
@@ -1660,26 +1660,26 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       floatingStyles: f,
       show: x,
       hide: p,
-      onToggle: F
+      onToggle: _
     } = ye();
-    X(r, (V) => t("update:modelValue", V)), X(
+    X(r, (F) => t("update:modelValue", F)), X(
       () => [e.modelValue, e.target],
-      ([V, R]) => {
-        V ? x(R) : p();
+      ([F, R]) => {
+        F ? x(R) : p();
       },
       { immediate: !0 }
     );
-    function $(V) {
-      p(), V.action();
+    function $(F) {
+      p(), F.action();
     }
-    return (V, R) => (a(), d(J, null, [
-      V.target ? C("", !0) : (a(), d("span", {
+    return (F, R) => (a(), d(J, null, [
+      F.target ? C("", !0) : (a(), d("span", {
         key: 0,
         ref_key: "anchorRef",
         ref: o,
         class: "inline-flex"
       }, [
-        j(V.$slots, "activator", { props: M(u) })
+        j(F.$slots, "activator", { props: M(u) })
       ], 512)),
       i("div", {
         id: M(s),
@@ -1689,26 +1689,26 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         class: "bluevue-popover",
         style: D(M(f)),
         onToggle: R[0] || (R[0] = //@ts-ignore
-        (...P) => M(F) && M(F)(...P))
+        (...P) => M(_) && M(_)(...P))
       }, [
         i("ul", {
-          class: b(["bluevue-elevation-5 min-w-[220px] max-h-[60vh] overflow-y-auto rounded-[4px] border border-[#ffffff1a] bg-[#2d2d2d]", M(v) ? "opacity-100" : "opacity-0"])
+          class: y(["bluevue-elevation-5 min-w-[220px] max-h-[60vh] overflow-y-auto rounded-[4px] border border-[#ffffff1a] bg-[#2d2d2d]", M(v) ? "opacity-100" : "opacity-0"])
         }, [
-          (a(!0), d(J, null, Z(V.items, (P, m) => (a(), d("li", {
+          (a(!0), d(J, null, Z(F.items, (P, m) => (a(), d("li", {
             key: P.title
           }, [
             m ? (a(), d("div", r2)) : C("", !0),
             i("button", {
               type: "button",
               disabled: P.disabled,
-              class: b(["flex w-full items-start gap-3 px-4 py-2 text-left", [
+              class: y(["flex w-full items-start gap-3 px-4 py-2 text-left", [
                 P.danger ? "text-[#ff6b6b]" : "text-white",
                 P.disabled ? "cursor-not-allowed opacity-30" : "cursor-pointer hover:bg-[#ffffff11]"
               ]]),
-              onClick: (T) => $(P)
+              onClick: (V) => $(P)
             }, [
               i("span", {
-                class: b(["mdi shrink-0 mt-[2px] text-[18px] leading-none", P.icon])
+                class: y(["mdi shrink-0 mt-[2px] text-[18px] leading-none", P.icon])
               }, null, 2),
               i("span", c2, [
                 i("span", d2, B(P.title), 1),
@@ -1827,18 +1827,18 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
   setup(c, { emit: n }) {
     const e = n;
     return (t, o) => (a(), d("fieldset", {
-      class: b(["w-full min-w-0", t.disabled ? "opacity-30" : ""])
+      class: y(["w-full min-w-0", t.disabled ? "opacity-30" : ""])
     }, [
       t.label ? (a(), d("legend", {
         key: 0,
-        class: b(["mb-2 text-[13px]", t.theme === "dark" ? "text-white" : "text-black"])
+        class: y(["mb-2 text-[13px]", t.theme === "dark" ? "text-white" : "text-black"])
       }, B(t.label), 3)) : C("", !0),
       i("div", {
-        class: b(["flex", t.inline ? "flex-wrap items-center gap-x-5 gap-y-2" : "flex-col gap-2"])
+        class: y(["flex", t.inline ? "flex-wrap items-center gap-x-5 gap-y-2" : "flex-col gap-2"])
       }, [
         (a(!0), d(J, null, Z(t.items, (l) => (a(), d("label", {
           key: l.value,
-          class: b(["flex items-center gap-2", [
+          class: y(["flex items-center gap-2", [
             t.disabled || l.disabled ? "cursor-not-allowed opacity-30" : "cursor-pointer",
             t.theme === "dark" ? "text-white" : "text-black"
           ]])
@@ -1853,7 +1853,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             onChange: (s) => e("update:modelValue", l.value)
           }, null, 40, f2),
           i("span", {
-            class: b(["flex h-[16px] w-[16px] shrink-0 items-center justify-center rounded-full border transition-colors peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-[var(--bluevue-accent)]", t.modelValue === l.value ? "border-[var(--bluevue-primary)]" : t.theme === "dark" ? "border-[#ffffff44]" : "border-[#00000044]"])
+            class: y(["flex h-[16px] w-[16px] shrink-0 items-center justify-center rounded-full border transition-colors peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-[var(--bluevue-accent)]", t.modelValue === l.value ? "border-[var(--bluevue-primary)]" : t.theme === "dark" ? "border-[#ffffff44]" : "border-[#00000044]"])
           }, [
             t.modelValue === l.value ? (a(), d("span", v2)) : C("", !0)
           ], 2),
@@ -1909,7 +1909,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
 }, k2 = ["title"], x2 = { key: 1 }, $2 = { class: "flex flex-col items-end min-w-0 shrink-[1000]" }, B2 = ["disabled"], C2 = {
   key: 0,
   class: "text-[14px] text-[var(--bluevue-error)]"
-}, _2 = ["id"], T2 = ["disabled", "onClick"], zo = /* @__PURE__ */ L({
+}, T2 = ["id"], V2 = ["disabled", "onClick"], zo = /* @__PURE__ */ L({
   __name: "BlueSelect",
   props: {
     items: {},
@@ -1933,57 +1933,57 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       isOpen: f,
       isPositioned: x,
       floatingStyles: p,
-      hide: F,
+      hide: _,
       onToggle: $
-    } = ye({ matchAnchorWidth: !0 }), V = w(
+    } = ye({ matchAnchorWidth: !0 }), F = k(
       () => e.errorMessages && e.errorMessages.length > 0
-    ), R = w(() => e.theme === "dark" ? "#FFFFFF05" : "#00000011"), P = (k) => {
+    ), R = k(() => e.theme === "dark" ? "#FFFFFF05" : "#00000011"), P = (w) => {
       if (e.multiSelect) {
-        const A = e.items[k].value || e.items[k].name, K = o.value.indexOf(A);
+        const A = e.items[w].value || e.items[w].name, K = o.value.indexOf(A);
         K > -1 ? o.value.splice(K, 1) : o.value.push(A), t("update:modelValue", o.value);
       } else {
-        const A = e.items[k].value || e.items[k].name;
-        l.value = e.items[k], t("update:modelValue", A), F();
+        const A = e.items[w].value || e.items[w].name;
+        l.value = e.items[w], t("update:modelValue", A), _();
       }
-    }, m = w(() => e.theme === "dark" ? "text-white" : "text-black"), T = w(() => e.theme === "dark" ? "text-white" : "text-black");
-    function E(k) {
-      return k.disabled || e.disabled ? "text-gray-500" : e.theme === "dark" ? "text-white" : "text-black";
+    }, m = k(() => e.theme === "dark" ? "text-white" : "text-black"), V = k(() => e.theme === "dark" ? "text-white" : "text-black");
+    function E(w) {
+      return w.disabled || e.disabled ? "text-gray-500" : e.theme === "dark" ? "text-white" : "text-black";
     }
     return X(
       () => e.modelValue,
-      (k) => {
+      (w) => {
         if (e.multiSelect)
-          Array.isArray(k) && (o.value = k);
+          Array.isArray(w) && (o.value = w);
         else {
           const A = e.items.find(
-            (K) => K.value !== void 0 ? K.value === k : K.name === k
+            (K) => K.value !== void 0 ? K.value === w : K.name === w
           );
           l.value = A ?? { name: "Select..." };
         }
       },
       { immediate: !0 }
-    ), (k, A) => {
+    ), (w, A) => {
       var K;
       return a(), d("div", q2, [
-        k.label ? (a(), d("div", w2, [
+        w.label ? (a(), d("div", w2, [
           i("label", {
-            class: b(["block truncate text-start mr-6", [k.theme === "dark" ? "text-white" : "text-black", k.disabled ? "opacity-30" : ""]]),
-            title: k.label
-          }, B(k.label), 11, k2)
+            class: y(["block truncate text-start mr-6", [w.theme === "dark" ? "text-white" : "text-black", w.disabled ? "opacity-30" : ""]]),
+            title: w.label
+          }, B(w.label), 11, k2)
         ])) : (a(), d("div", x2)),
-        j(k.$slots, "insetElement"),
-        k.infoTooltip ? (a(), U(ie, {
+        j(w.$slots, "insetElement"),
+        w.infoTooltip ? (a(), U(ie, {
           key: 2,
-          text: k.infoTooltip,
-          theme: k.theme,
+          text: w.infoTooltip,
+          theme: w.theme,
           class: "items-center shrink-0 mr-2 ml-auto"
         }, {
           default: N(() => [
             O(H, {
               name: "mdi-information-outline",
               size: 16,
-              label: k.infoTooltip,
-              class: b(["opacity-60 cursor-help", k.theme === "dark" ? "text-white" : "text-black"])
+              label: w.infoTooltip,
+              class: y(["cursor-help", [w.disabled ? "opacity-30" : "opacity-60", w.theme === "dark" ? "text-white" : "text-black"]])
             }, null, 8, ["label", "class"])
           ]),
           _: 1
@@ -1994,21 +1994,21 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             ref: s
           }, M(v), {
             type: "button",
-            disabled: k.disabled,
+            disabled: w.disabled,
             class: ["relative inline-flex items-center justify-between pl-4 rounded-[6px] bluevue-elevation-1 min-w-[90px] max-w-full", [
-              k.disabled ? "opacity-30" : "cursor-pointer",
-              V.value ? "border-2 border-solid border-[var(--bluevue-error)]" : ""
+              w.disabled ? "opacity-30" : "cursor-pointer",
+              F.value ? "border-2 border-solid border-[var(--bluevue-error)]" : ""
             ]],
-            style: { height: k.height || "30px", width: k.width || "auto", backgroundColor: R.value }
+            style: { height: w.height || "30px", width: w.width || "auto", backgroundColor: R.value }
           }), [
             i("span", {
-              class: b(["text-sm font-medium truncate min-w-0 mr-1 -mb-[1px]", T.value])
-            }, B(k.multiSelect ? o.value.length > 0 ? o.value.join(", ") : "Select..." : l.value.name), 3),
+              class: y(["text-sm font-medium truncate min-w-0 mr-1 -mb-[1px]", V.value])
+            }, B(w.multiSelect ? o.value.length > 0 ? o.value.join(", ") : "Select..." : l.value.name), 3),
             i("span", {
-              class: b(["mdi mdi-menu-down text-[24px] leading-none shrink-0 transition-transform", [m.value, M(f) ? "rotate-180" : ""]])
+              class: y(["mdi mdi-menu-down text-[24px] leading-none shrink-0 transition-transform", [m.value, M(f) ? "rotate-180" : ""]])
             }, null, 2)
           ], 16, B2),
-          V.value ? (a(), d("div", C2, B(((K = k.errorMessages) == null ? void 0 : K[0]) || ""), 1)) : C("", !0)
+          F.value ? (a(), d("div", C2, B(((K = w.errorMessages) == null ? void 0 : K[0]) || ""), 1)) : C("", !0)
         ]),
         i("div", {
           id: M(r),
@@ -2021,35 +2021,35 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
           (...Y) => M($) && M($)(...Y))
         }, [
           i("ul", {
-            class: b(["bluevue-elevation-5 max-h-[60vh] overflow-y-auto rounded-[4px] border border-[#FFFFFF22]", [
-              k.theme === "dark" ? "bg-[var(--bluevue-surface)]" : "bg-white",
+            class: y(["bluevue-elevation-5 max-h-[60vh] overflow-y-auto rounded-[4px] border border-[#FFFFFF22]", [
+              w.theme === "dark" ? "bg-[var(--bluevue-surface)]" : "bg-white",
               M(x) ? "opacity-100" : "opacity-0"
             ]])
           }, [
-            (a(!0), d(J, null, Z(k.items, (Y, te) => (a(), d("li", {
+            (a(!0), d(J, null, Z(w.items, (Y, te) => (a(), d("li", {
               key: Y.name
             }, [
               i("button", {
                 type: "button",
-                disabled: k.disabled || Y.disabled,
-                class: b(["flex w-full items-center justify-between gap-2 whitespace-nowrap px-4 py-2 text-left text-sm", [
+                disabled: w.disabled || Y.disabled,
+                class: y(["flex w-full items-center justify-between gap-2 whitespace-nowrap px-4 py-2 text-left text-sm", [
                   E(Y),
-                  k.disabled || Y.disabled ? "cursor-not-allowed" : k.theme === "dark" ? "cursor-pointer hover:bg-[#ffffff11]" : "cursor-pointer hover:bg-gray-100"
+                  w.disabled || Y.disabled ? "cursor-not-allowed" : w.theme === "dark" ? "cursor-pointer hover:bg-[#ffffff11]" : "cursor-pointer hover:bg-gray-100"
                 ]]),
                 onClick: (ee) => P(te)
               }, [
                 i("span", {
-                  class: b(["mdi mdi-check text-[16px] leading-none", o.value.includes(Y.value || Y.name) ? "" : "invisible"])
+                  class: y(["mdi mdi-check text-[16px] leading-none", o.value.includes(Y.value || Y.name) ? "" : "invisible"])
                 }, null, 2),
                 oe(" " + B(Y.name), 1)
-              ], 10, T2)
+              ], 10, V2)
             ]))), 128))
           ], 2)
-        ], 44, _2)
+        ], 44, T2)
       ]);
     };
   }
-}), V2 = { class: "flex w-full justify-between items-center" }, F2 = {
+}), F2 = { class: "flex w-full justify-between items-center" }, _2 = {
   key: 0,
   class: "min-w-0 max-w-[45%] shrink-0"
 }, M2 = ["title"], S2 = { class: "flex w-1/2 min-w-0 items-center justify-between" }, R2 = { class: "absolute inset-x-[18%] top-1/2 -translate-y-1/2 flex justify-between pointer-events-none" }, z2 = { key: 0 }, D2 = {
@@ -2078,64 +2078,64 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
   },
   emits: ["update:modelValue"],
   setup(c, { emit: n }) {
-    const e = c, t = n, o = (h) => {
-      if (!Number.isFinite(h) || h <= 0) return 0;
-      const z = h.toString();
+    const e = c, t = n, o = (b) => {
+      if (!Number.isFinite(b) || b <= 0) return 0;
+      const z = b.toString();
       if (z.includes("e-")) {
         const ge = parseInt(z.split("e-")[1] ?? "0", 10);
         return Math.min(6, Math.max(0, ge));
       }
       const [, W = ""] = z.split(".");
       return Math.min(6, W.length);
-    }, l = q(e.modelValue ?? e.min), s = q(l.value), u = q(!1), r = q(!1), v = q(0), f = w(
+    }, l = q(e.modelValue ?? e.min), s = q(l.value), u = q(!1), r = q(!1), v = q(0), f = k(
       () => e.scaleFn ? e.scaleFn(l.value) : l.value
-    ), x = w(
+    ), x = k(
       () => e.labelMin ? e.labelMin : e.formatDisplay ? e.formatDisplay(e.scaleFn ? e.scaleFn(e.min) : e.min) : e.min
-    ), p = w(
+    ), p = k(
       () => e.labelMax ? e.labelMax : e.formatDisplay ? e.formatDisplay(e.scaleFn ? e.scaleFn(e.max) : e.max) : e.max
-    ), F = w(() => {
-      const h = l.value;
-      return e.scaleFn ? e.scaleFn(h) : h;
-    }), $ = w(() => e.scaleFn ? e.scaleFn(e.min) : e.min), V = w(() => e.scaleFn ? e.scaleFn(e.max) : e.max), R = w(() => e.step ?? 0.1), P = w(() => {
-      const h = e.keyboardStepMultiplierLimit ?? 3;
-      return Number.isFinite(h) && h >= 1 ? h : 3;
-    }), m = q(0), T = q(0), E = q(0), k = () => {
-      m.value = 0, T.value = 0, E.value = 0;
-    }, A = (h) => {
+    ), _ = k(() => {
+      const b = l.value;
+      return e.scaleFn ? e.scaleFn(b) : b;
+    }), $ = k(() => e.scaleFn ? e.scaleFn(e.min) : e.min), F = k(() => e.scaleFn ? e.scaleFn(e.max) : e.max), R = k(() => e.step ?? 0.1), P = k(() => {
+      const b = e.keyboardStepMultiplierLimit ?? 3;
+      return Number.isFinite(b) && b >= 1 ? b : 3;
+    }), m = q(0), V = q(0), E = q(0), w = () => {
+      m.value = 0, V.value = 0, E.value = 0;
+    }, A = (b) => {
       const z = Date.now(), W = P.value;
-      E.value === h && z - m.value <= 250 || (T.value = 0), T.value += 1, m.value = z, E.value = h;
-      const Be = Math.min(1, (T.value - 1) / 6);
+      E.value === b && z - m.value <= 250 || (V.value = 0), V.value += 1, m.value = z, E.value = b;
+      const Be = Math.min(1, (V.value - 1) / 6);
       return 1 + (1 - Math.pow(1 - Be, 2)) * (W - 1);
-    }, K = w(() => {
+    }, K = k(() => {
       if (!e.scaleFn) return R.value;
-      const h = e.scaleFn(e.min), z = e.scaleFn(e.min + R.value), W = Math.abs(z - h);
+      const b = e.scaleFn(e.min), z = e.scaleFn(e.min + R.value), W = Math.abs(z - b);
       return W > 0 ? W : R.value;
-    }), Y = w(() => o(K.value)), te = (h, z) => {
+    }), Y = k(() => o(K.value)), te = (b, z) => {
       const W = Math.max(R.value / 10, 1e-4);
-      return Math.abs(h - z) <= W;
-    }, ee = w(() => (l.value - e.min) / (e.max - e.min) * 100), re = q(0), fe = w(
+      return Math.abs(b - z) <= W;
+    }, ee = k(() => (l.value - e.min) / (e.max - e.min) * 100), re = q(0), fe = k(
       () => `calc((100% - 70px) * ${(u.value ? re.value : ee.value) / 100})`
-    ), ne = (h) => {
-      h !== s.value && (s.value = h, t("update:modelValue", h));
-    }, y = q(null);
+    ), ne = (b) => {
+      b !== s.value && (s.value = b, t("update:modelValue", b));
+    }, h = q(null);
     let S = null;
     const g = q(0), I = () => {
-      y.value = null, g.value = 0, S && (clearTimeout(S), S = null);
-    }, _ = (h) => {
-      y.value = h, g.value = Date.now() + 2e3, S && clearTimeout(S), S = window.setTimeout(() => {
-        S = null, y.value = null, g.value = 0;
+      h.value = null, g.value = 0, S && (clearTimeout(S), S = null);
+    }, T = (b) => {
+      h.value = b, g.value = Date.now() + 2e3, S && clearTimeout(S), S = window.setTimeout(() => {
+        S = null, h.value = null, g.value = 0;
       }, 2e3);
     }, G = () => {
-      const h = Math.min(Math.max(l.value, e.min), e.max);
-      l.value = h, ze(h);
+      const b = Math.min(Math.max(l.value, e.min), e.max);
+      l.value = b, ze(b);
     }, Q = () => {
       ve();
     }, nt = () => {
-      v.value = Math.min(Math.max(v.value, $.value), V.value);
+      v.value = Math.min(Math.max(v.value, $.value), F.value);
     };
     let se = null, le = null;
-    const ze = (h) => {
-      if (le = h, se) return;
+    const ze = (b) => {
+      if (le = b, se) return;
       const z = le;
       le = null, ne(z), se = window.setTimeout(() => {
         if (se = null, le === null) return;
@@ -2144,57 +2144,57 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       }, 500);
     }, st = () => {
       if (se && (clearTimeout(se), se = null), le === null) return;
-      const h = le;
-      le = null, ne(h);
+      const b = le;
+      le = null, ne(b);
     }, ve = () => {
       r.value = !1;
-      const h = Math.min(Math.max(l.value, e.min), e.max);
-      l.value = h, le = h, st(), ne(h), _(h);
+      const b = Math.min(Math.max(l.value, e.min), e.max);
+      l.value = b, le = b, st(), ne(b), T(b);
     }, De = () => ve(), Le = () => ve(), at = () => {
       e.disabled || u.value || (r.value = !0, I(), window.addEventListener("pointerup", De, { once: !0 }), window.addEventListener("pointercancel", Le, { once: !0 }));
-    }, Pe = (h) => h === "ArrowLeft" || h === "ArrowRight" || h === "ArrowUp" || h === "ArrowDown", it = (h) => {
-      if (e.disabled || u.value || !Pe(h.key)) return;
-      h.preventDefault();
-      const z = h.key === "ArrowRight" || h.key === "ArrowUp" ? 1 : -1, W = R.value;
+    }, Pe = (b) => b === "ArrowLeft" || b === "ArrowRight" || b === "ArrowUp" || b === "ArrowDown", it = (b) => {
+      if (e.disabled || u.value || !Pe(b.key)) return;
+      b.preventDefault();
+      const z = b.key === "ArrowRight" || b.key === "ArrowUp" ? 1 : -1, W = R.value;
       if (!Number.isFinite(W) || W <= 0) return;
       const ge = A(z), Ie = W * ge, Be = l.value + z * Ie, Ee = Math.min(Math.max(Be, e.min), e.max), ct = Math.round((Ee - e.min) / W), Ae = Math.min(
         Math.max(e.min + ct * W, e.min),
         e.max
       );
       l.value = Ae, ze(Ae), r.value || (r.value = !0, I());
-    }, rt = (h) => {
-      Pe(h.key) && (k(), ve());
-    }, ut = (h) => {
-      h.key === "Escape" ? (u.value = !1, v.value = e.scaleFn ? e.scaleFn(s.value) : s.value, l.value = s.value) : h.key === "Enter" && (u.value = !1);
+    }, rt = (b) => {
+      Pe(b.key) && (w(), ve());
+    }, ut = (b) => {
+      b.key === "Escape" ? (u.value = !1, v.value = e.scaleFn ? e.scaleFn(s.value) : s.value, l.value = s.value) : b.key === "Enter" && (u.value = !1);
     };
     return X(
       () => e.modelValue,
-      (h) => {
-        const z = h ?? e.min;
-        u.value || r.value || y.value !== null && Date.now() < g.value && !te(z, y.value) || (l.value = z);
+      (b) => {
+        const z = b ?? e.min;
+        u.value || r.value || h.value !== null && Date.now() < g.value && !te(z, h.value) || (l.value = z);
       },
       { immediate: !0 }
-    ), X(u, (h) => {
-      if (h)
-        v.value = F.value, re.value = ee.value;
+    ), X(u, (b) => {
+      if (b)
+        v.value = _.value, re.value = ee.value;
       else {
         const z = e.unscaleFn ? e.unscaleFn(v.value) : v.value;
-        l.value = Math.min(Math.max(z, e.min), e.max), ne(l.value), _(l.value);
+        l.value = Math.min(Math.max(z, e.min), e.max), ne(l.value), T(l.value);
       }
     }), me(() => {
       se && clearTimeout(se), S && clearTimeout(S), window.removeEventListener("pointerup", De), window.removeEventListener("pointercancel", Le);
-    }), (h, z) => (a(), d("div", V2, [
-      h.label ? (a(), d("div", F2, [
+    }), (b, z) => (a(), d("div", F2, [
+      b.label ? (a(), d("div", _2, [
         i("label", {
-          class: b(["block truncate text-start mr-6", [h.theme === "dark" ? "text-white" : "text-black", h.disabled ? "opacity-30" : ""]]),
-          title: h.label
-        }, B(h.label), 11, M2)
+          class: y(["block truncate text-start mr-6", [b.theme === "dark" ? "text-white" : "text-black", b.disabled ? "opacity-30" : ""]]),
+          title: b.label
+        }, B(b.label), 11, M2)
       ])) : C("", !0),
       i("div", S2, [
         i("div", {
           name: "slider-track",
-          class: b(["relative overflow-visible rounded-[6px] bluevue-elevation-1 min-w-[140px] max-w-full", [h.theme === "dark" ? "bg-[#464646AA]" : "bg-[#00000011]", h.disabled ? "opacity-30" : ""]]),
-          style: D({ width: h.width || "100%", height: h.height || "30px", cursor: h.disabled ? "not-allowed" : "pointer" })
+          class: y(["relative overflow-visible rounded-[6px] bluevue-elevation-1 min-w-[140px] max-w-full", [b.theme === "dark" ? "bg-[#464646AA]" : "bg-[#00000011]", b.disabled ? "opacity-30" : ""]]),
+          style: D({ width: b.width || "100%", height: b.height || "30px", cursor: b.disabled ? "not-allowed" : "pointer" })
         }, [
           i("div", R2, [
             (a(), d(J, null, Z(6, (W) => i("div", {
@@ -2202,25 +2202,25 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               class: "mdi mdi-circle w-2 h-2",
               style: D({
                 fontSize: "6px",
-                color: h.theme === "dark" ? "#ffffff11" : "#00000011"
+                color: b.theme === "dark" ? "#ffffff11" : "#00000011"
               })
             }, null, 4)), 64))
           ]),
           i("div", {
-            class: b(["absolute translate-y-1/2 bottom-1/2 flex items-center justify-center text-white text-center text-[14px] whitespace-nowrap min-w-[60px] rounded-[6px] bluevue-elevation-1 z-50 h-3/4", u.value ? "pointer-events-auto" : "pointer-events-none select-none"]),
+            class: y(["absolute translate-y-1/2 bottom-1/2 flex items-center justify-center text-white text-center text-[14px] whitespace-nowrap min-w-[60px] rounded-[6px] bluevue-elevation-1 z-50 h-3/4", u.value ? "pointer-events-auto" : "pointer-events-none select-none"]),
             style: D({
               left: fe.value,
               marginLeft: "5px",
-              backgroundColor: h.color || "var(--bluevue-primary)"
+              backgroundColor: b.color || "var(--bluevue-primary)"
             })
           }, [
             u.value ? (a(), d("div", L2, [
-              Te(i("input", {
+              Ve(i("input", {
                 ref: "editInput",
                 "onUpdate:modelValue": z[0] || (z[0] = (W) => v.value = W),
                 type: "number",
                 min: $.value,
-                max: V.value,
+                max: F.value,
                 step: K.value,
                 autofocus: "",
                 class: "bg-white border border-gray-300 rounded px-1 py-0.5",
@@ -2236,18 +2236,18 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
                 ]
               ])
             ])) : (a(), d("div", z2, [
-              i("p", D2, B(h.formatDisplay ? h.formatDisplay(f.value) : f.value.toFixed(Y.value)), 1)
+              i("p", D2, B(b.formatDisplay ? b.formatDisplay(f.value) : f.value.toFixed(Y.value)), 1)
             ]))
           ], 6),
-          Te(i("input", {
+          Ve(i("input", {
             "onUpdate:modelValue": z[2] || (z[2] = (W) => l.value = W),
             type: "range",
-            class: b(["absolute inset-0 w-full h-full opacity-0", h.disabled ? "cursor-not-allowed" : "cursor-pointer"]),
+            class: y(["absolute inset-0 w-full h-full opacity-0", b.disabled ? "cursor-not-allowed" : "cursor-pointer"]),
             style: { width: "95%", left: "2.5%" },
-            min: h.min,
-            max: h.max,
+            min: b.min,
+            max: b.max,
             step: R.value,
-            disabled: h.disabled || u.value,
+            disabled: b.disabled || u.value,
             onInput: G,
             onChange: Q,
             onPointerdown: at,
@@ -2264,10 +2264,10 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             ]
           ]),
           i("p", {
-            class: b(["absolute left-[5px] top-1/2 -translate-y-1/2 min-w-[30px] text-[12px] font-medium text-center whitespace-nowrap z-10 pointer-events-none", h.theme === "dark" ? "text-[#ffffff44]" : "text-[#00000066]"])
+            class: y(["absolute left-[5px] top-1/2 -translate-y-1/2 min-w-[30px] text-[12px] font-medium text-center whitespace-nowrap z-10 pointer-events-none", b.theme === "dark" ? "text-[#ffffff44]" : "text-[#00000066]"])
           }, B(x.value), 3),
           i("p", {
-            class: b(["absolute right-[5px] top-1/2 -translate-y-1/2 min-w-[30px] text-[12px] font-medium text-center whitespace-nowrap z-10 pointer-events-none", h.theme === "dark" ? "text-[#ffffff44]" : "text-[#00000066]"])
+            class: y(["absolute right-[5px] top-1/2 -translate-y-1/2 min-w-[30px] text-[12px] font-medium text-center whitespace-nowrap z-10 pointer-events-none", b.theme === "dark" ? "text-[#ffffff44]" : "text-[#00000066]"])
           }, B(p.value), 3),
           u.value ? (a(), d("div", {
             key: 0,
@@ -2325,7 +2325,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
     ), (u, r) => (a(), d("div", O2, [
       u.label ? (a(), d("div", N2, [
         i("label", {
-          class: b(["block truncate text-start mr-6", u.theme === "dark" ? "text-white" : "text-black"]),
+          class: y(["block truncate text-start mr-6", [u.theme === "dark" ? "text-white" : "text-black", u.disabled ? "opacity-30" : ""]]),
           title: u.label
         }, B(u.label), 11, W2)
       ])) : C("", !0),
@@ -2341,14 +2341,14 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               name: "mdi-information-outline",
               size: 16,
               label: u.infoTooltip,
-              class: b(["opacity-60 cursor-help", u.theme === "dark" ? "text-white" : "text-black"])
+              class: y(["cursor-help", [u.disabled ? "opacity-30" : "opacity-60", u.theme === "dark" ? "text-white" : "text-black"]])
             }, null, 8, ["label", "class"])
           ]),
           _: 1
         }, 8, ["text", "theme"])) : C("", !0),
         i("div", {
           name: "switch-track",
-          class: b(["relative grid grid-cols-2 rounded-[8px] bluevue-elevation-1 cursor-pointer overflow-hidden", [u.theme === "dark" ? "bg-[#464646AA]" : "bg-[#00000011]", u.disabled ? "opacity-30 cursor-not-allowed" : ""]]),
+          class: y(["relative grid grid-cols-2 rounded-[8px] bluevue-elevation-1 cursor-pointer overflow-hidden", [u.theme === "dark" ? "bg-[#464646AA]" : "bg-[#00000011]", u.disabled ? "opacity-30 cursor-not-allowed" : ""]]),
           style: D({ minWidth: u.width || "75px", height: u.height || "30px" }),
           onClick: s
         }, [
@@ -2360,10 +2360,10 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             })
           }, null, 4),
           i("span", {
-            class: b(["relative flex items-center justify-center px-[9px] text-[14px] whitespace-nowrap pointer-events-none transition-opacity duration-300", l(!o.value)])
+            class: y(["relative flex items-center justify-center px-[9px] text-[14px] whitespace-nowrap pointer-events-none transition-opacity duration-300", l(!o.value)])
           }, B(u.labelOff || "Off"), 3),
           i("span", {
-            class: b(["relative flex items-center justify-center px-[9px] text-[14px] whitespace-nowrap pointer-events-none transition-opacity duration-300", l(o.value)])
+            class: y(["relative flex items-center justify-center px-[9px] text-[14px] whitespace-nowrap pointer-events-none transition-opacity duration-300", l(o.value)])
           }, B(u.labelOn || "On"), 3)
         ], 6)
       ])
@@ -2391,13 +2391,13 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         }
         e.value = r.key, t.value = !1;
       }
-    }, l = (r, v) => r == null ? v == null ? 0 : 1 : v == null ? -1 : typeof r == "number" && typeof v == "number" ? r - v : String(r).localeCompare(String(v), void 0, { numeric: !0 }), s = w(() => {
+    }, l = (r, v) => r == null ? v == null ? 0 : 1 : v == null ? -1 : typeof r == "number" && typeof v == "number" ? r - v : String(r).localeCompare(String(v), void 0, { numeric: !0 }), s = k(() => {
       if (!e.value) return n.rows;
       const r = t.value ? -1 : 1;
       return [...n.rows].sort((v, f) => r * l(v[e.value], f[e.value]));
     }), u = (r) => r.align === "end" ? "text-end" : r.align === "center" ? "text-center" : "text-start";
     return (r, v) => (a(), d("div", {
-      class: b(["w-full overflow-auto rounded-[6px]", r.theme === "light" ? "bg-[#00000006]" : "bg-[#ffffff08]"]),
+      class: y(["w-full overflow-auto rounded-[6px]", r.theme === "light" ? "bg-[#00000006]" : "bg-[#ffffff08]"]),
       style: D({ maxHeight: r.maxHeight })
     }, [
       i("table", K2, [
@@ -2406,7 +2406,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             (a(!0), d(J, null, Z(r.columns, (f) => (a(), d("th", {
               key: f.key,
               scope: "col",
-              class: b(["sticky top-0 z-[1] whitespace-nowrap border-b px-3 py-2 text-[11px] font-medium uppercase tracking-wide backdrop-blur-sm", [
+              class: y(["sticky top-0 z-[1] whitespace-nowrap border-b px-3 py-2 text-[11px] font-medium uppercase tracking-wide backdrop-blur-sm", [
                 u(f),
                 f.sortable ? "cursor-pointer select-none" : "",
                 r.theme === "light" ? "border-[#00000014] bg-[#f5f5f5cc] text-[#00000088]" : "border-[#ffffff14] bg-[#1e1e1ecc] text-[#ffffff88]"
@@ -2421,7 +2421,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
                   key: 0,
                   name: e.value === f.key ? t.value ? "mdi-arrow-down" : "mdi-arrow-up" : "mdi-arrow-up-down",
                   size: 12,
-                  class: b(e.value === f.key ? "" : "opacity-30")
+                  class: y(e.value === f.key ? "" : "opacity-30")
                 }, null, 8, ["name", "class"])) : C("", !0)
               ])
             ], 14, G2))), 128))
@@ -2430,12 +2430,12 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         i("tbody", null, [
           (a(!0), d(J, null, Z(s.value, (f, x) => (a(), d("tr", {
             key: String(r.rowKey ? f[r.rowKey] : x),
-            class: b(["transition-colors", r.theme === "light" ? "hover:bg-[#0000000a]" : "hover:bg-[#ffffff0a]"]),
+            class: y(["transition-colors", r.theme === "light" ? "hover:bg-[#0000000a]" : "hover:bg-[#ffffff0a]"]),
             onClick: (p) => r.$emit("row-click", f)
           }, [
             (a(!0), d(J, null, Z(r.columns, (p) => (a(), d("td", {
               key: p.key,
-              class: b(["border-b px-3", [
+              class: y(["border-b px-3", [
                 u(p),
                 r.dense ? "py-1" : "py-2",
                 r.theme === "light" ? "border-[#0000000a] text-black" : "border-[#ffffff0a] text-white"
@@ -2452,7 +2452,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
           s.value.length === 0 ? (a(), d("tr", Y2, [
             i("td", {
               colspan: r.columns.length,
-              class: b(["px-3 py-6 text-center text-[13px]", r.theme === "light" ? "text-[#00000066]" : "text-[#ffffff66]"])
+              class: y(["px-3 py-6 text-center text-[13px]", r.theme === "light" ? "text-[#00000066]" : "text-[#ffffff66]"])
             }, [
               j(r.$slots, "empty", {}, () => [
                 oe(B(r.emptyText ?? "Nothing here yet."), 1)
@@ -2478,7 +2478,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
   setup(c, { emit: n }) {
     const e = n;
     return (t, o) => (a(), d("div", {
-      class: b(["flex items-stretch gap-1 border-b", t.theme === "light" ? "border-[#00000014]" : "border-[#ffffff14]"]),
+      class: y(["flex items-stretch gap-1 border-b", t.theme === "light" ? "border-[#00000014]" : "border-[#ffffff14]"]),
       role: "tablist"
     }, [
       (a(!0), d(J, null, Z(t.tabs, (l) => (a(), d("button", {
@@ -2487,7 +2487,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         role: "tab",
         "aria-selected": t.modelValue === l.value,
         disabled: l.disabled,
-        class: b(["relative flex items-center justify-center gap-2 whitespace-nowrap px-3 pb-2 pt-[6px] text-[13px] font-medium transition-colors", [
+        class: y(["relative flex items-center justify-center gap-2 whitespace-nowrap px-3 pb-2 pt-[6px] text-[13px] font-medium transition-colors", [
           t.stretch ? "flex-1" : "",
           l.disabled ? "cursor-not-allowed opacity-30" : "cursor-pointer",
           t.modelValue === l.value ? t.theme === "light" ? "text-black" : "text-white" : t.theme === "light" ? "text-[#00000088] hover:text-black" : "text-[#ffffff88] hover:text-white"
@@ -2530,10 +2530,10 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
   },
   emits: ["update:modelValue"],
   setup(c, { emit: n }) {
-    const e = c, t = n, o = w(() => {
+    const e = c, t = n, o = k(() => {
       var s;
       return (((s = e.errorMessages) == null ? void 0 : s.length) ?? 0) > 0;
-    }), l = w(() => {
+    }), l = k(() => {
       if (!e.autoGrow) return e.rows ?? 4;
       const s = (e.modelValue ?? "").split(`
 `).length;
@@ -2546,7 +2546,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       s.label ? (a(), d("div", to, [
         i("label", {
           for: s.name,
-          class: b(["min-w-0 truncate text-[13px]", [s.theme === "dark" ? "text-white" : "text-black", s.disabled ? "opacity-30" : ""]])
+          class: y(["min-w-0 truncate text-[13px]", [s.theme === "dark" ? "text-white" : "text-black", s.disabled ? "opacity-30" : ""]])
         }, B(s.label), 11, lo),
         s.infoTooltip ? (a(), U(ie, {
           key: 0,
@@ -2559,8 +2559,8 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               name: "mdi-information-outline",
               size: 16,
               label: s.infoTooltip,
-              class: "opacity-60 cursor-help"
-            }, null, 8, ["label"])
+              class: y(["cursor-help", s.disabled ? "opacity-30" : "opacity-60"])
+            }, null, 8, ["label", "class"])
           ]),
           _: 1
         }, 8, ["text", "theme"])) : C("", !0)
@@ -2572,7 +2572,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         value: s.modelValue ?? "",
         placeholder: s.placeholder,
         disabled: s.disabled,
-        class: b(["bluevue-inset-1 w-full resize-y rounded-[6px] px-3 py-2 text-sm outline-none transition-colors focus:outline focus:outline-2 focus:outline-offset-0 focus:outline-[var(--bluevue-accent)]", [
+        class: y(["bluevue-inset-1 w-full resize-y rounded-[6px] px-3 py-2 text-sm outline-none transition-colors focus:outline focus:outline-2 focus:outline-offset-0 focus:outline-[var(--bluevue-accent)]", [
           s.theme === "dark" ? "bg-[#ffffff11] text-white placeholder:text-[#ffffff55]" : "bg-[#00000008] text-black placeholder:text-[#00000055]",
           s.disabled ? "pointer-events-none opacity-30" : "",
           o.value ? "outline outline-2 outline-[var(--bluevue-error)]" : ""
@@ -2625,13 +2625,13 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
       activatorProps: f,
       isPositioned: x,
       floatingStyles: p,
-      onToggle: F
-    } = ye({ placement: "bottom-end" }), $ = q(null), V = q(!1), R = w(() => l.min ?? 0), P = w(() => l.max ?? 360), m = w(() => l.step && l.step > 0 ? l.step : 1), T = w(() => {
+      onToggle: _
+    } = ye({ placement: "bottom-end" }), $ = q(null), F = q(!1), R = k(() => l.min ?? 0), P = k(() => l.max ?? 360), m = k(() => l.step && l.step > 0 ? l.step : 1), V = k(() => {
       const g = P.value - R.value;
       return g > 0 ? g : 360;
-    }), E = w(() => typeof l.modelValue == "number" ? l.modelValue : R.value), k = w(() => (K(E.value) - R.value) / T.value * 360), A = w(() => l.theme !== "light");
+    }), E = k(() => typeof l.modelValue == "number" ? l.modelValue : R.value), w = k(() => (K(E.value) - R.value) / V.value * 360), A = k(() => l.theme !== "light");
     function K(g) {
-      return R.value + ((g - R.value) % T.value + T.value) % T.value;
+      return R.value + ((g - R.value) % V.value + V.value) % V.value;
     }
     function Y(g) {
       return R.value + Math.round((g - R.value) / m.value) * m.value;
@@ -2651,23 +2651,23 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
     function re(g) {
       const I = $.value;
       if (!I) return E.value;
-      const _ = I.getBoundingClientRect(), G = Math.atan2(g.clientX - (_.left + _.width / 2), _.top + _.height / 2 - g.clientY) * 180 / Math.PI, Q = G < 0 ? G + 360 : G;
-      return R.value + Q / 360 * T.value;
+      const T = I.getBoundingClientRect(), G = Math.atan2(g.clientX - (T.left + T.width / 2), T.top + T.height / 2 - g.clientY) * 180 / Math.PI, Q = G < 0 ? G + 360 : G;
+      return R.value + Q / 360 * V.value;
     }
     function fe(g) {
       var I;
-      l.disabled || (V.value = !0, (I = $.value) == null || I.setPointerCapture(g.pointerId), te(re(g)));
+      l.disabled || (F.value = !0, (I = $.value) == null || I.setPointerCapture(g.pointerId), te(re(g)));
     }
     function ne(g) {
-      V.value && te(re(g));
+      F.value && te(re(g));
     }
-    function y(g) {
+    function h(g) {
       var I;
-      V.value && (V.value = !1, (I = $.value) == null || I.releasePointerCapture(g.pointerId));
+      F.value && (F.value = !1, (I = $.value) == null || I.releasePointerCapture(g.pointerId));
     }
     function S(g, I) {
-      const _ = (g - 90) * Math.PI / 180;
-      return { x: e + Math.cos(_) * I, y: e + Math.sin(_) * I };
+      const T = (g - 90) * Math.PI / 180;
+      return { x: e + Math.cos(T) * I, y: e + Math.sin(T) * I };
     }
     return (g, I) => (a(), d("div", no, [
       O(Re, {
@@ -2700,7 +2700,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             O(H, {
               name: "mdi-compass-rose",
               size: 16,
-              class: b(A.value ? "text-white" : "text-black")
+              class: y(A.value ? "text-white" : "text-black")
             }, null, 8, ["class"])
           ], 16, so)
         ]),
@@ -2711,13 +2711,13 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
         ref_key: "popoverRef",
         ref: r,
         popover: "",
-        class: "bluevue-popover",
+        class: "bluevue-popover bluevue-popover--dimmed",
         style: D(M(p)),
         onToggle: I[0] || (I[0] = //@ts-ignore
-        (..._) => M(F) && M(F)(..._))
+        (...T) => M(_) && M(_)(...T))
       }, [
         i("div", {
-          class: b(["bluevue-elevation-5 rounded-[8px] p-3", [
+          class: y(["bluevue-elevation-5 rounded-full", [
             A.value ? "bg-[var(--bluevue-surface)] text-white" : "bg-white text-black",
             M(x) ? "opacity-100" : "opacity-0"
           ]])
@@ -2728,11 +2728,11 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
             width: be,
             height: be,
             viewBox: `0 0 ${be} ${be}`,
-            class: b(["block touch-none select-none", g.disabled ? "cursor-not-allowed" : "cursor-pointer"]),
+            class: y(["block touch-none select-none", g.disabled ? "cursor-not-allowed" : "cursor-pointer"]),
             onPointerdown: ae(fe, ["prevent"]),
             onPointermove: ne,
-            onPointerup: y,
-            onPointercancel: y
+            onPointerup: h,
+            onPointercancel: h
           }, [
             i("circle", {
               cx: e,
@@ -2748,24 +2748,24 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               r: e - 22,
               fill: A.value ? "#ffffff0d" : "#0000000d"
             }, null, 8, uo),
-            (a(), d(J, null, Z(t, (_) => i("line", {
-              key: _,
-              x1: S(_, _ % 90 === 0 ? 70 : 74).x,
-              y1: S(_, _ % 90 === 0 ? 70 : 74).y,
-              x2: S(_, 80).x,
-              y2: S(_, 80).y,
+            (a(), d(J, null, Z(t, (T) => i("line", {
+              key: T,
+              x1: S(T, T % 90 === 0 ? 70 : 74).x,
+              y1: S(T, T % 90 === 0 ? 70 : 74).y,
+              x2: S(T, 80).x,
+              y2: S(T, 80).y,
               stroke: A.value ? "#ffffff44" : "#00000044",
-              "stroke-width": _ % 90 === 0 ? 2 : 1
+              "stroke-width": T % 90 === 0 ? 2 : 1
             }, null, 8, co)), 64)),
-            (a(), d(J, null, Z(o, (_) => i("text", {
-              key: _.label,
-              x: S(_.deg, 58).x,
-              y: S(_.deg, 58).y,
+            (a(), d(J, null, Z(o, (T) => i("text", {
+              key: T.label,
+              x: S(T.deg, 58).x,
+              y: S(T.deg, 58).y,
               "text-anchor": "middle",
               "dominant-baseline": "middle",
               class: "text-[11px] font-medium",
               fill: A.value ? "#ffffff88" : "#00000088"
-            }, B(_.label), 9, po)), 64)),
+            }, B(T.label), 9, po)), 64)),
             i("defs", null, [
               i("filter", {
                 id: `${M(v)}-arrow-shadow`,
@@ -2776,7 +2776,7 @@ const il = ["aria-describedby"], rl = ["id"], ie = /* @__PURE__ */ L({
               }, vo, 8, mo)
             ]),
             i("g", {
-              transform: `rotate(${k.value} ${e} ${e})`,
+              transform: `rotate(${w.value} ${e} ${e})`,
               filter: `url(#${M(v)}-arrow-shadow)`
             }, [
               i("path", {
@@ -2825,13 +2825,13 @@ export {
   Ml as BlueChip,
   Co as BlueConfirmDialog,
   $e as BlueDialog,
-  _o as BlueExpansiblePanel,
-  To as BlueFileDrop,
+  To as BlueExpansiblePanel,
+  Vo as BlueFileDrop,
   H as BlueIcon,
   Re as BlueInput,
   Gt as BlueLoadingDialog,
-  Fo as BlueMenu,
-  Ve as BlueOsError,
+  _o as BlueMenu,
+  Fe as BlueOsError,
   Hl as BlueProgressBar,
   Mo as BluePromptDialog,
   So as BlueRadioGroup,
@@ -2841,14 +2841,14 @@ export {
   el as BlueSnackbar,
   It as BlueSpinner,
   Lo as BlueStat,
-  Vo as BlueStepsDialog,
+  Fo as BlueStepsDialog,
   Po as BlueSwitch,
   Io as BlueTable,
   Eo as BlueTabs,
   Ao as BlueTextarea,
   ie as BlueTooltip,
   jo as BlueWindRose,
-  Tt as applyBlueTheme,
+  Vt as applyBlueTheme,
   xe as blueOsService,
   Oo as downloadJson,
   xt as isBlueOsExtension,