@tenorlab/vue-dashboard 1.6.6 → 1.6.8

package/dist/vue-dashboard.es.js

@@ -1,77 +1,77 @@
-import { reactive as xe, computed as v, readonly as Se, defineComponent as k, openBlock as i, createElementBlock as g, normalizeClass as p, createElementVNode as o, createStaticVNode as se, toDisplayString as S, withModifiers as R, normalizeStyle as oe, renderSlot as T, ref as U, onMounted as ye, withDirectives as Le, unref as u, createBlock as N, createCommentVNode as Z, createVNode as D, Transition as Pe, withCtx as E, vShow as Ne, mergeProps as ne, onUnmounted as ze, Fragment as q, renderList as G, shallowRef as me, watchEffect as Te, markRaw as ee, defineAsyncComponent as Ae, resolveComponent as je, Suspense as Re, resolveDynamicComponent as pe, createSlots as He, createTextVNode as be, withKeys as fe, watch as Ve } from "vue";
-import { blankDashboardConfig as ge, dashboardStoreUtils as te, getDistinctCssClasses as V, ensureZoomScaleIsWithinRange as Oe, parseContainerTitle as ke, dashboardSettingsUtils as Ue, getWidgetMetaFromCatalog as Fe } from "./core.es.js";
-const qe = () => ({
+import { reactive as ye, computed as v, readonly as Le, defineComponent as b, openBlock as i, createElementBlock as c, normalizeClass as p, createElementVNode as o, createStaticVNode as oe, toDisplayString as S, withModifiers as j, normalizeStyle as ne, renderSlot as T, ref as U, onMounted as be, withDirectives as Pe, unref as h, createBlock as N, createCommentVNode as Z, createVNode as D, Transition as Ne, withCtx as M, vShow as ze, mergeProps as Q, onUnmounted as Te, toHandlers as pe, Fragment as q, renderList as G, shallowRef as fe, watchEffect as Ae, markRaw as te, defineAsyncComponent as je, resolveComponent as He, Suspense as Ve, resolveDynamicComponent as he, createSlots as Re, createTextVNode as _e, withKeys as ve, watch as Oe } from "vue";
+import { blankDashboardConfig as ge, dashboardStoreUtils as se, getDistinctCssClasses as R, ensureZoomScaleIsWithinRange as Ue, parseContainerTitle as ke, dashboardSettingsUtils as Fe, getWidgetMetaFromCatalog as qe } from "./core.es.js";
+const Ge = () => ({
   isLoading: !1,
   // Start uninitialized/not loading
   isEditing: !1,
   allDashboardConfigs: [ge],
   currentDashboardConfig: ge
-}), $ = xe(qe()), O = {
-  setIsLoading: (t) => $.isLoading = t,
-  setIsEditing: (t) => $.isEditing = t,
-  setTargetContainerKey: (t) => $.targetContainerKey = t,
-  setAllDashboardConfigs: (t) => $.allDashboardConfigs = t,
+}), k = ye(Ge()), O = {
+  setIsLoading: (t) => k.isLoading = t,
+  setIsEditing: (t) => k.isEditing = t,
+  setTargetContainerKey: (t) => k.targetContainerKey = t,
+  setAllDashboardConfigs: (t) => k.allDashboardConfigs = t,
   setCurrentDashboardConfig: (t) => {
     const s = [
-      ...$.allDashboardConfigs.filter((e) => e.dashboardId !== t.dashboardId),
+      ...k.allDashboardConfigs.filter((e) => e.dashboardId !== t.dashboardId),
       t
     ];
-    return $.allDashboardConfigs = s, $.currentDashboardConfig = t, s;
+    return k.allDashboardConfigs = s, k.currentDashboardConfig = t, s;
   },
   addDashboardConfig: (t) => {
     const s = [
-      ...$.allDashboardConfigs.filter((e) => e.dashboardId !== t.dashboardId),
+      ...k.allDashboardConfigs.filter((e) => e.dashboardId !== t.dashboardId),
       t
     ];
-    return $.allDashboardConfigs = s, $.currentDashboardConfig = t, s;
+    return k.allDashboardConfigs = s, k.currentDashboardConfig = t, s;
   },
   deleteDashboardConfigById: (t) => {
-    const s = [...$.allDashboardConfigs.filter((e) => e.dashboardId !== t)];
-    return $.allDashboardConfigs = s, $.currentDashboardConfig = s[0] || ge, s;
+    const s = [...k.allDashboardConfigs.filter((e) => e.dashboardId !== t)];
+    return k.allDashboardConfigs = s, k.currentDashboardConfig = s[0] || ge, s;
   },
   selectDashboardById: (t) => {
-    const s = $.allDashboardConfigs.find((e) => e.dashboardId === t);
-    return s && ($.currentDashboardConfig = s), s;
+    const s = k.allDashboardConfigs.find((e) => e.dashboardId === t);
+    return s && (k.currentDashboardConfig = s), s;
   },
   addWidget: (t) => {
-    const s = te.addWidget({
-      dashboardConfig: $.currentDashboardConfig,
+    const s = se.addWidget({
+      dashboardConfig: k.currentDashboardConfig,
       ...t
     }), e = [
-      ...$.allDashboardConfigs.filter((n) => n.dashboardId !== s.updatedDashboardConfig.dashboardId),
+      ...k.allDashboardConfigs.filter((n) => n.dashboardId !== s.updatedDashboardConfig.dashboardId),
       s.updatedDashboardConfig
     ];
-    return s.success && ($.allDashboardConfigs = e, $.currentDashboardConfig = s.updatedDashboardConfig), {
+    return s.success && (k.allDashboardConfigs = e, k.currentDashboardConfig = s.updatedDashboardConfig), {
       ...s,
       allUpdatedDashboardConfigs: e
     };
   },
   removeWidget: (t, s) => {
-    const e = te.removeWidget($.currentDashboardConfig, t, s), n = [
-      ...$.allDashboardConfigs.filter((a) => a.dashboardId !== e.updatedDashboardConfig.dashboardId),
+    const e = se.removeWidget(k.currentDashboardConfig, t, s), n = [
+      ...k.allDashboardConfigs.filter((a) => a.dashboardId !== e.updatedDashboardConfig.dashboardId),
       e.updatedDashboardConfig
     ];
-    return e.success && ($.allDashboardConfigs = n, $.currentDashboardConfig = e.updatedDashboardConfig), {
+    return e.success && (k.allDashboardConfigs = n, k.currentDashboardConfig = e.updatedDashboardConfig), {
       ...e,
       allUpdatedDashboardConfigs: n
     };
   },
   moveWidget: (t, s, e) => {
-    const n = te.moveWidget(
-      $.currentDashboardConfig,
+    const n = se.moveWidget(
+      k.currentDashboardConfig,
       t,
       s,
       e
     ), a = [
-      ...$.allDashboardConfigs.filter((r) => r.dashboardId !== n.updatedDashboardConfig.dashboardId),
+      ...k.allDashboardConfigs.filter((r) => r.dashboardId !== n.updatedDashboardConfig.dashboardId),
       n.updatedDashboardConfig
     ];
-    return n.success && ($.allDashboardConfigs = a, $.currentDashboardConfig = n.updatedDashboardConfig), {
+    return n.success && (k.allDashboardConfigs = a, k.currentDashboardConfig = n.updatedDashboardConfig), {
       ...n,
       allUpdatedDashboardConfigs: a
     };
   }
-}, ve = {
+}, we = {
   setIsLoading: (t) => O.setIsLoading(t),
   setIsEditing: (t) => (t || O.setTargetContainerKey(void 0), O.setIsEditing(t), t),
   setTargetContainerKey: (t) => O.setTargetContainerKey(t),
@@ -83,60 +83,60 @@ const qe = () => ({
   addWidget: (t) => O.addWidget(t),
   removeWidget: (t, s) => O.removeWidget(t, s),
   moveWidget: (t, s, e) => O.moveWidget(t, s, e)
-}, Ge = {
-  getNextContainerKey: (t) => te.getNextContainerKey($.currentDashboardConfig, t),
-  getCurrentDashboardConfig: () => $.currentDashboardConfig,
-  getCurrentDashboardId: () => $.currentDashboardConfig.dashboardId,
-  getIsResponsive: () => $.currentDashboardConfig.responsiveGrid || !1,
-  getTargetContainerKey: () => $.targetContainerKey
 }, Ze = {
-  isLoading: v(() => $.isLoading),
-  isEditing: v(() => $.isEditing),
-  targetContainerKey: v(() => $.targetContainerKey),
-  currentDashboardConfig: v(() => $.currentDashboardConfig),
-  allDashboardConfigs: v(() => $.allDashboardConfigs.sort((t, s) => {
+  getNextContainerKey: (t) => se.getNextContainerKey(k.currentDashboardConfig, t),
+  getCurrentDashboardConfig: () => k.currentDashboardConfig,
+  getCurrentDashboardId: () => k.currentDashboardConfig.dashboardId,
+  getIsResponsive: () => k.currentDashboardConfig.responsiveGrid || !1,
+  getTargetContainerKey: () => k.targetContainerKey
+}, Xe = {
+  isLoading: v(() => k.isLoading),
+  isEditing: v(() => k.isEditing),
+  targetContainerKey: v(() => k.targetContainerKey),
+  currentDashboardConfig: v(() => k.currentDashboardConfig),
+  allDashboardConfigs: v(() => k.allDashboardConfigs.sort((t, s) => {
     const e = t.dashboardId === "default", n = s.dashboardId === "default";
     return e && !n ? -1 : n && !e ? 1 : t.dashboardId.localeCompare(s.dashboardId);
   }))
-}, Xe = {
-  ...ve,
-  actions: ve,
-  getters: Ge,
-  computed: Ze
-}, Hs = () => Xe, H = xe({
+}, Qe = {
+  ...we,
+  actions: we,
+  getters: Ze,
+  computed: Xe
+}, Vs = () => Qe, V = ye({
   currentDashboardId: "",
   undoHistory: {},
   historyIndex: {}
-}), ae = (t) => H.undoHistory[t] || [], re = (t) => H.historyIndex[t] ?? -1, ie = (t, s) => {
-  H.historyIndex[t] = s;
-}, Qe = (t) => {
+}), re = (t) => V.undoHistory[t] || [], ae = (t) => V.historyIndex[t] ?? -1, ie = (t, s) => {
+  V.historyIndex[t] = s;
+}, Ye = (t) => {
   const s = t.dashboardId;
-  if (H.currentDashboardId !== s) {
-    H.currentDashboardId = s;
+  if (V.currentDashboardId !== s) {
+    V.currentDashboardId = s;
     const e = {
       undoIndex: 0,
       config: t
     };
-    ie(s, 0), H.undoHistory[s] = [e];
+    ie(s, 0), V.undoHistory[s] = [e];
   }
-}, Ye = (t) => {
-  const s = t.dashboardId, e = ae(s), n = re(s), a = e.slice(0, n + 1), r = {
+}, Je = (t) => {
+  const s = t.dashboardId, e = re(s), n = ae(s), a = e.slice(0, n + 1), r = {
     undoIndex: a.length,
     config: t
   }, d = [...a, r];
-  H.undoHistory[s] = d, ie(s, d.length - 1);
-}, Je = (t) => {
-  delete H.undoHistory[t], delete H.historyIndex[t];
+  V.undoHistory[s] = d, ie(s, d.length - 1);
 }, et = (t) => {
-  const s = ae(t), e = re(t), n = Math.max(0, e - 1);
+  delete V.undoHistory[t], delete V.historyIndex[t];
+}, tt = (t) => {
+  const s = re(t), e = ae(t), n = Math.max(0, e - 1);
   if (n !== e)
     return ie(t, n), s[n]?.config;
-}, tt = (t) => {
-  const s = ae(t), e = s.length, n = re(t), a = Math.min(e - 1, n + 1);
+}, st = (t) => {
+  const s = re(t), e = s.length, n = ae(t), a = Math.min(e - 1, n + 1);
   if (a !== n)
     return ie(t, a), s[a]?.config;
-}, _e = () => {
-  const t = H.currentDashboardId || "", s = re(t), e = ae(t).length, n = s <= 0, a = s >= e - 1;
+}, $e = () => {
+  const t = V.currentDashboardId || "", s = ae(t), e = re(t).length, n = s <= 0, a = s >= e - 1;
   return {
     isUndoDisabled: n,
     isRedoDisabled: a,
@@ -144,29 +144,29 @@ const qe = () => ({
     _currentIndex: s,
     _historyLength: e
   };
-}, st = v(() => _e()), Vs = () => ({
-  initializeHistoryForDashboard: Qe,
+}, ot = v(() => $e()), Rs = () => ({
+  initializeHistoryForDashboard: Ye,
   resetAllHistory: () => {
-    H.undoHistory = {}, H.historyIndex = {};
+    V.undoHistory = {}, V.historyIndex = {};
   },
-  addUndoEntry: Ye,
-  removeUndoHistoryForDashboard: Je,
-  getPreviousChanges: et,
-  getNextChanges: tt,
-  computedUndoStatus: st,
+  addUndoEntry: Je,
+  removeUndoHistoryForDashboard: et,
+  getPreviousChanges: tt,
+  getNextChanges: st,
+  computedUndoStatus: ot,
   // Function that returns a Vue ComputedRef
-  getUndoStatus: _e,
+  getUndoStatus: $e,
   // for unit tests only
   // Expose reactive state for debugging or advanced external use (optional)
-  historyState: Se(H)
+  historyState: Le(V)
 });
-function Q(t) {
+function Y(t) {
   return {
     removeClick: (r, d) => {
       t("removeClick", r, d);
     },
-    moveClick: (r, d, w) => {
-      t("moveClick", r, d, w);
+    moveClick: (r, d, u) => {
+      t("moveClick", r, d, u);
     },
     selectContainer: (r) => {
       t("selectContainer", r);
@@ -176,13 +176,13 @@ function Q(t) {
     }
   };
 }
-const ot = /* @__PURE__ */ k({
+const nt = /* @__PURE__ */ b({
   __name: "PlusCircleIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -203,13 +203,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M12 8v8" }, null, -1)
     ])], 2));
   }
-}), nt = /* @__PURE__ */ k({
+}), rt = /* @__PURE__ */ b({
   __name: "MinusCircleIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -229,13 +229,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M8 12h8" }, null, -1)
     ])], 2));
   }
-}), Os = /* @__PURE__ */ k({
+}), Os = /* @__PURE__ */ b({
   __name: "DeleteIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -247,16 +247,16 @@ const ot = /* @__PURE__ */ k({
       "stroke-linejoin": "round",
       class: p(`lucide lucide-trash2-icon lucide-trash-2 ${t.cssClass || ""}`.trim())
     }, [...e[0] || (e[0] = [
-      se('<path d="M10 11v6"></path><path d="M14 11v6"></path><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path><path d="M3 6h18"></path><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>', 5)
+      oe('<path d="M10 11v6"></path><path d="M14 11v6"></path><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"></path><path d="M3 6h18"></path><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>', 5)
     ])], 2));
   }
-}), Us = /* @__PURE__ */ k({
+}), Us = /* @__PURE__ */ b({
   __name: "EditIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -272,13 +272,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M18.375 2.625a1 1 0 0 1 3 3l-9.013 9.014a2 2 0 0 1-.853.505l-2.873.84a.5.5 0 0 1-.62-.62l.84-2.873a2 2 0 0 1 .506-.852z" }, null, -1)
     ])], 2));
   }
-}), Fs = /* @__PURE__ */ k({
+}), Fs = /* @__PURE__ */ b({
   __name: "RenameIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -290,16 +290,16 @@ const ot = /* @__PURE__ */ k({
       "stroke-linejoin": "round",
       class: p(`lucide lucide-text-cursor-input-icon lucide-text-cursor-input ${t.cssClass || ""}`.trim())
     }, [...e[0] || (e[0] = [
-      se('<path d="M12 20h-1a2 2 0 0 1-2-2 2 2 0 0 1-2 2H6"></path><path d="M13 8h7a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-7"></path><path d="M5 16H4a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h1"></path><path d="M6 4h1a2 2 0 0 1 2 2 2 2 0 0 1 2-2h1"></path><path d="M9 6v12"></path>', 5)
+      oe('<path d="M12 20h-1a2 2 0 0 1-2-2 2 2 0 0 1-2 2H6"></path><path d="M13 8h7a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-7"></path><path d="M5 16H4a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h1"></path><path d="M6 4h1a2 2 0 0 1 2 2 2 2 0 0 1 2-2h1"></path><path d="M9 6v12"></path>', 5)
     ])], 2));
   }
-}), qs = /* @__PURE__ */ k({
+}), qs = /* @__PURE__ */ b({
   __name: "GridIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -311,16 +311,16 @@ const ot = /* @__PURE__ */ k({
       "stroke-linejoin": "round",
       class: p(`lucide lucide-grid3x3-icon lucide-grid-3x3 ${t.cssClass || ""}`.trim())
     }, [...e[0] || (e[0] = [
-      se('<rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path>', 5)
+      oe('<rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path>', 5)
     ])], 2));
   }
-}), at = /* @__PURE__ */ k({
+}), at = /* @__PURE__ */ b({
   __name: "SettingsIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -340,13 +340,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), Gs = /* @__PURE__ */ k({
+}), Gs = /* @__PURE__ */ b({
   __name: "ZoomInIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -383,13 +383,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), Zs = /* @__PURE__ */ k({
+}), Zs = /* @__PURE__ */ b({
   __name: "ZoomOutIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -420,13 +420,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), $e = /* @__PURE__ */ k({
+}), Ie = /* @__PURE__ */ b({
   __name: "MoveLeftIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -447,13 +447,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M16 12H8" }, null, -1)
     ])], 2));
   }
-}), Ie = /* @__PURE__ */ k({
+}), De = /* @__PURE__ */ b({
   __name: "MoveRightIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -474,13 +474,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M8 12h8" }, null, -1)
     ])], 2));
   }
-}), De = /* @__PURE__ */ k({
+}), Be = /* @__PURE__ */ b({
   __name: "XCircleIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -501,13 +501,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "m9 9 6 6" }, null, -1)
     ])], 2));
   }
-}), Xs = /* @__PURE__ */ k({
+}), Xs = /* @__PURE__ */ b({
   __name: "MonitorSmartphoneIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -531,13 +531,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), Qs = /* @__PURE__ */ k({
+}), Qs = /* @__PURE__ */ b({
   __name: "TabletSmartphoneIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -560,13 +560,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M8 18h.01" }, null, -1)
     ])], 2));
   }
-}), Ys = /* @__PURE__ */ k({
+}), Ys = /* @__PURE__ */ b({
   __name: "MonitorIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -599,13 +599,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), rt = /* @__PURE__ */ k({
+}), it = /* @__PURE__ */ b({
   __name: "TimerResetIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -623,13 +623,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M9 17H4v5" }, null, -1)
     ])], 2));
   }
-}), it = /* @__PURE__ */ k({
+}), lt = /* @__PURE__ */ b({
   __name: "UndoIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -645,13 +645,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13" }, null, -1)
     ])], 2));
   }
-}), lt = /* @__PURE__ */ k({
+}), dt = /* @__PURE__ */ b({
   __name: "RedoIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -667,13 +667,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7" }, null, -1)
     ])], 2));
   }
-}), dt = /* @__PURE__ */ k({
+}), ct = /* @__PURE__ */ b({
   __name: "HandIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -691,13 +691,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15" }, null, -1)
     ])], 2));
   }
-}), Be = /* @__PURE__ */ k({
+}), Ke = /* @__PURE__ */ b({
   __name: "HandGrabIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -709,16 +709,16 @@ const ot = /* @__PURE__ */ k({
       "stroke-linejoin": "round",
       class: p(`lucide lucide-hand-grab-icon lucide-hand-grab ${t.cssClass || ""}`.trim())
     }, [...e[0] || (e[0] = [
-      se('<path d="M18 11.5V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v1.4"></path><path d="M14 10V8a2 2 0 0 0-2-2a2 2 0 0 0-2 2v2"></path><path d="M10 9.9V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v5"></path><path d="M6 14a2 2 0 0 0-2-2a2 2 0 0 0-2 2"></path><path d="M18 11a2 2 0 1 1 4 0v3a8 8 0 0 1-8 8h-4a8 8 0 0 1-8-8 2 2 0 1 1 4 0"></path>', 5)
+      oe('<path d="M18 11.5V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v1.4"></path><path d="M14 10V8a2 2 0 0 0-2-2a2 2 0 0 0-2 2v2"></path><path d="M10 9.9V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v5"></path><path d="M6 14a2 2 0 0 0-2-2a2 2 0 0 0-2 2"></path><path d="M18 11a2 2 0 1 1 4 0v3a8 8 0 0 1-8 8h-4a8 8 0 0 1-8-8 2 2 0 1 1 4 0"></path>', 5)
     ])], 2));
   }
-}), ct = /* @__PURE__ */ k({
+}), ut = /* @__PURE__ */ b({
   __name: "CrosshairIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -756,13 +756,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), Js = /* @__PURE__ */ k({
+}), Js = /* @__PURE__ */ b({
   __name: "TargetIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -791,13 +791,13 @@ const ot = /* @__PURE__ */ k({
       }, null, -1)
     ])], 2));
   }
-}), ut = /* @__PURE__ */ k({
+}), gt = /* @__PURE__ */ b({
   __name: "CircleQuestionMarkIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -818,13 +818,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "M12 17h.01" }, null, -1)
     ])], 2));
   }
-}), he = /* @__PURE__ */ k({
+}), me = /* @__PURE__ */ b({
   __name: "ChevronDownIcon",
   props: {
     cssClass: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("svg", {
+    return (s, e) => (i(), c("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       width: "24",
       height: "24",
@@ -839,13 +839,13 @@ const ot = /* @__PURE__ */ k({
       o("path", { d: "m6 9 6 6 6-6" }, null, -1)
     ])], 2));
   }
-}), gt = ["for"], pt = ["id", "value", "placeholder", "aria-label"], ht = `
+}), pt = ["for"], ht = ["id", "value", "placeholder", "aria-label"], mt = `
   block w-full rounded-md px-3 py-1.5 text-base 
   bg-formfield content-formfield
   outline-1 -outline-offset-1 outline-primary 
   placeholder:text-disabled 
   focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-200 sm:text-sm/6
-`, Ke = /* @__PURE__ */ k({
+`, We = /* @__PURE__ */ b({
   __name: "TextField",
   props: {
     label: {},
@@ -856,29 +856,29 @@ const ot = /* @__PURE__ */ k({
   },
   emits: ["update:modelValue", "keydown"],
   setup(t, { emit: s }) {
-    const e = t, n = s, a = (h) => {
-      n("update:modelValue", h.target.value);
-    }, r = v(() => e.size === "small" ? "py-1.5 px-3 text-sm" : "py-2.5 px-4 text-base"), d = v(() => `flex flex-col gap-1 ${e.className}`), w = v(() => `${ht} ${r.value}`);
-    return (h, c) => (i(), g("div", {
+    const e = t, n = s, a = ($) => {
+      n("update:modelValue", $.target.value);
+    }, r = v(() => e.size === "small" ? "py-1.5 px-3 text-sm" : "py-2.5 px-4 text-base"), d = v(() => `flex flex-col gap-1 ${e.className}`), u = v(() => `${mt} ${r.value}`);
+    return ($, g) => (i(), c("div", {
       class: p(d.value)
     }, [
       o("label", {
         for: e.label,
         class: "block text-sm/6 font-medium"
-      }, S(e.label), 9, gt),
+      }, S(e.label), 9, pt),
       o("input", {
         id: e.label,
         type: "text",
         value: e.modelValue,
         placeholder: e.placeholder,
-        class: p(w.value),
+        class: p(u.value),
         "aria-label": e.label,
         onInput: a,
-        onKeydown: c[0] || (c[0] = (l) => n("keydown", l))
-      }, null, 42, pt)
+        onKeydown: g[0] || (g[0] = (l) => n("keydown", l))
+      }, null, 42, ht)
     ], 2));
   }
-}), mt = ["title", "disabled"], A = /* @__PURE__ */ k({
+}), ft = ["title", "disabled"], H = /* @__PURE__ */ b({
   __name: "Button",
   props: {
     disabled: { type: Boolean, default: !1 },
@@ -910,129 +910,129 @@ const ot = /* @__PURE__ */ k({
         "group bg-transparent border-[category] text-[category] hover:text-[category] group-hover:text-[category] focus:outline-[category] focus:outline-offset-[category]"
       ]
     ]), r = v(() => {
-      const h = e.isIconButton || !1, c = e.category || "primary", l = e.type || "normal", b = e.disabled || !1, B = e.className || "", I = e.font || "", x = Number((e.border || 0) > 0 ? e.border : 0);
+      const $ = e.isIconButton || !1, g = e.category || "primary", l = e.type || "normal", y = e.disabled || !1, B = e.className || "", I = e.font || "", C = Number((e.border || 0) > 0 ? e.border : 0);
       let m = (e.borderColor || "").trim();
       m = m.length > 0 ? m : "";
-      const L = Number((e.borderHover || 0) > 0 ? e.borderHover : 0), _ = e.shadow || "sm", j = e.shadowHover || "md", F = (e.addCss || "").trim(), K = e.justifyCss || "justify-center";
-      if (h)
-        return V(
+      const L = Number((e.borderHover || 0) > 0 ? e.borderHover : 0), _ = e.shadow || "sm", A = e.shadowHover || "md", F = (e.addCss || "").trim(), K = e.justifyCss || "justify-center";
+      if ($)
+        return R(
           "flex flex-row items-center",
-          b ? "text-disabled" : `text-${c} hover:brightness-110 cursor-pointer`,
+          y ? "text-disabled" : `text-${g} hover:brightness-110 cursor-pointer`,
           B || ""
         );
-      const y = [
+      const x = [
         "relative cursor-pointer",
         "rounded-sm focus:outline-none focus:ring focus:ring-offset",
         "transition-all duration-150",
         "text-sm",
         `font-${I}`
       ];
-      if (b)
-        l === "ghost" ? y.push("text-disabled border-disabled cursor-not-allowed") : y.push("bg-disabled content-disabled border-disabled cursor-not-allowed");
+      if (y)
+        l === "ghost" ? x.push("text-disabled border-disabled cursor-not-allowed") : x.push("bg-disabled content-disabled border-disabled cursor-not-allowed");
       else {
-        y.push("cursor-pointer");
-        let M = "";
-        a.has(l) ? M = `${a.get(l)}` : M = `${a.get("normal")}`, x < 1 && (M = M.replace("border-[category]", ""));
-        const z = M.replaceAll("[category]", c).trim();
-        y.push(z);
+        x.push("cursor-pointer");
+        let E = "";
+        a.has(l) ? E = `${a.get(l)}` : E = `${a.get("normal")}`, C < 1 && (E = E.replace("border-[category]", ""));
+        const z = E.replaceAll("[category]", g).trim();
+        x.push(z);
       }
-      return x > 0 ? (y.push(`border-[${x}px]`), y.push(`border-${m}`)) : (y.push("border-[1px]"), y.push("border-transparent")), L > 0 ? (y.push(`hover:border-[${L}px] group-hover:border-[${L}px]`), y.push(`hover:border-${m} group-hover:border-${m}`)) : y.push("hover:border-[1px] group-hover:border-[1px]"), y.push(`shadow-${_}`), y.push(`hover:shadow-${j} group-hover:shadow-${j}`), F.length > 0 && y.push(F), F.indexOf("hidden") === -1 && y.push("inline-flex"), y.push(K), y.join(" ").trim();
+      return C > 0 ? (x.push(`border-[${C}px]`), x.push(`border-${m}`)) : (x.push("border-[1px]"), x.push("border-transparent")), L > 0 ? (x.push(`hover:border-[${L}px] group-hover:border-[${L}px]`), x.push(`hover:border-${m} group-hover:border-${m}`)) : x.push("hover:border-[1px] group-hover:border-[1px]"), x.push(`shadow-${_}`), x.push(`hover:shadow-${A} group-hover:shadow-${A}`), F.length > 0 && x.push(F), F.indexOf("hidden") === -1 && x.push("inline-flex"), x.push(K), x.join(" ").trim();
     }), d = v(() => ({
       padding: e.isIconButton ? 0 : `${e.py}rem ${e.px}rem `
-    })), w = (h) => {
+    })), u = ($) => {
       if (e.disabled) {
-        h.preventDefault();
+        $.preventDefault();
         return;
       }
-      n("click", h);
+      n("click", $);
     };
-    return (h, c) => (i(), g("button", {
+    return ($, g) => (i(), c("button", {
       type: "button",
       class: p(r.value),
-      style: oe(d.value),
+      style: ne(d.value),
       title: t.tooltip?.title,
       disabled: t.disabled,
-      onClick: R(w, ["stop"])
+      onClick: j(u, ["stop"])
     }, [
-      T(h.$slots, "default")
-    ], 14, mt));
+      T($.$slots, "default")
+    ], 14, ft));
   }
 }), de = () => {
-}, ft = typeof window < "u" && typeof document < "u", vt = () => {
+}, vt = typeof window < "u" && typeof document < "u", wt = () => {
   var t, s;
-  return ft && ((t = window?.navigator) == null ? void 0 : t.userAgent) && (/iP(ad|hone|od)/.test(window.navigator.userAgent) || // The new iPad Pro Gen3 does not identify itself as iPad, but as Macintosh.
+  return vt && ((t = window?.navigator) == null ? void 0 : t.userAgent) && (/iP(ad|hone|od)/.test(window.navigator.userAgent) || // The new iPad Pro Gen3 does not identify itself as iPad, but as Macintosh.
   // https://github.com/vueuse/vueuse/issues/3577
   ((s = window?.navigator) == null ? void 0 : s.maxTouchPoints) > 2 && /iPad|Macintosh/.test(window?.navigator.userAgent));
-}, Ct = vt(), wt = () => {
-}, xt = (t) => toString.call(t) === "[object Object]";
+}, Ct = wt(), xt = () => {
+}, yt = (t) => toString.call(t) === "[object Object]";
 function ce(...t) {
   let s, e, n, a;
-  if (typeof t[0] == "string" || Array.isArray(t[0]) ? ([e, n, a] = t, s = window) : [s, e, n, a] = t, !s) return wt;
+  if (typeof t[0] == "string" || Array.isArray(t[0]) ? ([e, n, a] = t, s = window) : [s, e, n, a] = t, !s) return xt;
   Array.isArray(e) || (e = [e]), Array.isArray(n) || (n = [n]);
   const r = [], d = () => {
     r.forEach((l) => l()), r.length = 0;
-  }, w = (l, b, B, I) => (l.addEventListener(b, B, I), () => l.removeEventListener(b, B, I)), h = (l) => {
+  }, u = (l, y, B, I) => (l.addEventListener(y, B, I), () => l.removeEventListener(y, B, I)), $ = (l) => {
     if (d(), !l)
       return;
-    const b = xt(a) ? { ...a } : a;
+    const y = yt(a) ? { ...a } : a;
     r.push(
-      ...e.flatMap((B) => n.map((I) => w(l, B, I, b)))
+      ...e.flatMap((B) => n.map((I) => u(l, B, I, y)))
     );
-  }, c = () => {
-    h(s), d();
+  }, g = () => {
+    $(s), d();
   };
-  return h(s), c;
+  return $(s), g;
 }
 let Ce = !1;
-function yt(t, s, e = {}) {
+function bt(t, s, e = {}) {
   const { ignore: n = [], capture: a = !0, detectIframe: r = !1 } = e;
   if (!document)
     return de;
-  Ct && !Ce && (Ce = !0, Array.from(window.document.body.children).forEach((c) => c.addEventListener("click", de)), window.document.documentElement.addEventListener("click", de));
+  Ct && !Ce && (Ce = !0, Array.from(window.document.body.children).forEach((g) => g.addEventListener("click", de)), window.document.documentElement.addEventListener("click", de));
   let d = !0;
-  const w = (c) => n.some((l) => {
+  const u = (g) => n.some((l) => {
     if (typeof l == "string")
       return Array.from(document.querySelectorAll(l)).some(
-        (b) => b === c.target || c.composedPath().includes(b)
+        (y) => y === g.target || g.composedPath().includes(y)
       );
     {
-      const b = l;
-      return b && (c.target === b || c.composedPath().includes(b));
+      const y = l;
+      return y && (g.target === y || g.composedPath().includes(y));
     }
-  }), h = [
-    ce(document, "click", (c) => {
+  }), $ = [
+    ce(document, "click", (g) => {
       const l = t;
-      if (!(!l || l === c.target || c.composedPath().includes(l))) {
-        if (c.detail === 0 && (d = !w(c)), !d) {
+      if (!(!l || l === g.target || g.composedPath().includes(l))) {
+        if (g.detail === 0 && (d = !u(g)), !d) {
           d = !0;
           return;
         }
-        s(c);
+        s(g);
       }
     }, { passive: !0, capture: a }),
     ce(
       document,
       "pointerdown",
-      (c) => {
+      (g) => {
         const l = t;
-        d = !w(c) && !!(l && !c.composedPath().includes(l));
+        d = !u(g) && !!(l && !g.composedPath().includes(l));
       },
       { passive: !0 }
     ),
-    r && ce(document, "blur", (c) => {
+    r && ce(document, "blur", (g) => {
       setTimeout(() => {
         var l;
-        const b = t;
-        ((l = document.activeElement) == null ? void 0 : l.tagName) === "IFRAME" && !(b != null && b.contains(document.activeElement)) && s(c);
+        const y = t;
+        ((l = document.activeElement) == null ? void 0 : l.tagName) === "IFRAME" && !(y != null && y.contains(document.activeElement)) && s(g);
       }, 0);
     })
   ].filter(Boolean);
-  return () => h.forEach((c) => c());
+  return () => $.forEach((g) => g());
 }
-const bt = {
+const _t = {
   class: "form-dropdown-menu overflow-clip flex flex-col grow rounded-md justify-center w-full h-full bg-sidebar content-sidebar bg-opacity-95",
   style: { padding: "0 !important" }
-}, kt = /* @__PURE__ */ k({
+}, kt = /* @__PURE__ */ b({
   __name: "Dropdown",
   props: {
     testid: { default: "not-set" },
@@ -1056,22 +1056,22 @@ const bt = {
     focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary 
     content-topbar
     ${e.enabled ? "hover:text-primary cursor-pointer" : "opacity-50"}
-  `.trim()), w = `
+  `.trim()), u = `
     ${e.hideLabel ? "sr-only" : "hidden ml-3 text-sm font-medium lg:block"}
-  `.trim(), h = `
+  `.trim(), $ = `
     hidden flex-shrink-0 ml-1 size-4 lg:block
-  `.trim(), c = v(() => {
+  `.trim(), g = v(() => {
       const l = [
         "absolute flex flex-col right-0 z-50 mt-2 w-56 origin-top-right"
         //'overflow-clip',
       ];
       return l.push("rounded-md shadow-md"), l.push("ring-1 ring-black ring-opacity-5"), l.push("focus:outline-none"), l.push("bg-formfield content-formfield"), l.join(" ").trim();
     });
-    return ye(() => {
-      yt(a.value, () => {
+    return be(() => {
+      bt(a.value, () => {
         n("toggleOpen", !1);
       });
-    }), (l, b) => Le((i(), g("div", {
+    }), (l, y) => Pe((i(), c("div", {
       ref_key: "refDropdown",
       ref: a,
       class: "relative inline-block text-left"
@@ -1081,19 +1081,19 @@ const bt = {
         class: p(d.value),
         "aria-expanded": "true",
         "aria-haspopup": "true",
-        onClick: R(r, ["stop"])
+        onClick: j(r, ["stop"])
       }, [
         T(l.$slots, "icon"),
         o("span", {
-          class: p(u(w))
+          class: p(h(u))
         }, S(t.label), 3),
-        t.showChevron ? (i(), N(u(he), {
+        t.showChevron ? (i(), N(h(me), {
           key: 0,
-          class: p(u(h)),
+          class: p(h($)),
           "aria-hidden": "true"
         }, null, 8, ["class"])) : Z("", !0)
       ], 2),
-      D(Pe, {
+      D(Ne, {
         "enter-active-class": "transition ease-out duration-100",
         "enter-from-class": "transform opacity-0 scale-95",
         "enter-to-class": "transform opacity-100 scale-100",
@@ -1101,16 +1101,16 @@ const bt = {
         "leave-from-class": "transform opacity-100 scale-100",
         "leave-to-class": "transform opacity-0 scale-95"
       }, {
-        default: E(() => [
-          t.isMenuOpen ? (i(), g("div", {
+        default: M(() => [
+          t.isMenuOpen ? (i(), c("div", {
             key: 0,
-            class: p(c.value),
+            class: p(g.value),
             role: "menu",
             "aria-orientation": "vertical",
             "aria-labelledby": "menu-button",
             tabindex: "-1"
           }, [
-            o("div", bt, [
+            o("div", _t, [
               T(l.$slots, "default")
             ])
           ], 2)) : Z("", !0)
@@ -1118,10 +1118,10 @@ const bt = {
         _: 3
       })
     ], 512)), [
-      [Ne, !e.hide]
+      [ze, !e.hide]
     ]);
   }
-}), _t = ["data-testid"], $t = /* @__PURE__ */ k({
+}), $t = ["data-testid"], It = /* @__PURE__ */ b({
   __name: "Stack",
   props: {
     testId: {},
@@ -1131,17 +1131,17 @@ const bt = {
   },
   setup(t) {
     const s = t, e = v(() => {
-      const { testId: a, classNames: r, direction: d, ...w } = s;
-      return w;
-    }), n = v(() => s.direction === "row" ? V("flex flex-row items-center gap-2", s.classNames || "") : V("flex flex-col gap-2 w-full", s.classNames || ""));
-    return (a, r) => (i(), g("div", ne({
+      const { testId: a, classNames: r, direction: d, ...u } = s;
+      return u;
+    }), n = v(() => s.direction === "row" ? R("flex flex-row items-center gap-2", s.classNames || "") : R("flex flex-col gap-2 w-full", s.classNames || ""));
+    return (a, r) => (i(), c("div", Q({
       "data-testid": t.testId || "not-set",
       class: n.value
     }, e.value), [
       T(a.$slots, "default")
-    ], 16, _t));
+    ], 16, $t));
   }
-}), eo = /* @__PURE__ */ k({
+}), eo = /* @__PURE__ */ b({
   __name: "ListItem",
   props: {
     testId: {},
@@ -1152,20 +1152,20 @@ const bt = {
   },
   setup(t) {
     const s = t, e = v(() => {
-      const { classNames: r, direction: d, innerClass: w, ...h } = s;
-      return h;
-    }), n = v(() => V(s.classNames || "", "w-full")), a = V(
+      const { classNames: r, direction: d, innerClass: u, ...$ } = s;
+      return $;
+    }), n = v(() => R(s.classNames || "", "w-full")), a = R(
       `w-full flex overflow-hidden justify-between items-center gap-0 
       rounded-md border`,
       s.innerClass || ""
     );
-    return (r, d) => (i(), N($t, ne({
+    return (r, d) => (i(), N(It, Q({
       direction: "row",
       class: n.value
     }, e.value), {
-      default: E(() => [
+      default: M(() => [
         o("div", {
-          class: p(u(a))
+          class: p(h(a))
         }, [
           T(r.$slots, "default")
         ], 2)
@@ -1173,7 +1173,7 @@ const bt = {
       _: 3
     }, 16, ["class"]));
   }
-}), It = ["data-testid"], Dt = /* @__PURE__ */ k({
+}), Dt = ["data-testid"], Bt = /* @__PURE__ */ b({
   __name: "DraggablePanel",
   props: {
     testId: {},
@@ -1184,7 +1184,7 @@ const bt = {
   },
   emits: ["draggingChange"],
   setup(t, { emit: s }) {
-    const e = t, n = s, a = U(null), r = U({ x: 0, y: 0 }), d = U({ x: 0, y: 0 }), w = U({ x: 0, y: 0 }), c = {
+    const e = t, n = s, a = U(null), r = U({ x: 0, y: 0 }), d = U({ x: 0, y: 0 }), u = U({ x: 0, y: 0 }), g = {
       // 1. Take it out of the document flow
       position: "fixed",
       // 2. Set initial viewport position (e.g., top right)
@@ -1199,82 +1199,82 @@ const bt = {
       borderWidth: "3px",
       boxShadow: "rgba(0, 0, 0, 0.5) 7px 7px 10px 0px"
     }, l = v(() => ({
-      ...c,
+      ...g,
       ...e.style || {},
       // Override top/right with CSS transform based on position state for dragging
       transform: `translate(${r.value.x}px, ${r.value.y}px)`,
-      top: c.top,
-      right: c.right,
+      top: g.top,
+      right: g.right,
       // When translating, setting 'left' and 'top' to 0 helps maintain consistent behavior
       left: "initial"
-    })), b = (m) => "touches" in m && m.touches.length > 0 ? { x: m.touches[0].clientX, y: m.touches[0].clientY } : { x: m.clientX, y: m.clientY }, B = (m) => {
+    })), y = (m) => "touches" in m && m.touches.length > 0 ? { x: m.touches[0].clientX, y: m.touches[0].clientY } : { x: m.clientX, y: m.clientY }, B = (m) => {
       if (!m.target.closest(".handle"))
         return;
       m.cancelable && m.preventDefault(), n("draggingChange", !0);
-      const _ = b(m);
-      d.value = { x: _.x, y: _.y }, w.value = { x: r.value.x, y: r.value.y }, window.addEventListener("mousemove", I), window.addEventListener("mouseup", x), window.addEventListener("touchmove", I, { passive: !1 }), window.addEventListener("touchend", x), window.addEventListener("touchcancel", x);
+      const _ = y(m);
+      d.value = { x: _.x, y: _.y }, u.value = { x: r.value.x, y: r.value.y }, window.addEventListener("mousemove", I), window.addEventListener("mouseup", C), window.addEventListener("touchmove", I, { passive: !1 }), window.addEventListener("touchend", C), window.addEventListener("touchcancel", C);
     }, I = (m) => {
       m.cancelable && m.preventDefault();
-      const L = b(m), _ = L.x - d.value.x, j = L.y - d.value.y;
+      const L = y(m), _ = L.x - d.value.x, A = L.y - d.value.y;
       r.value = {
-        x: w.value.x + _,
-        y: w.value.y + j
+        x: u.value.x + _,
+        y: u.value.y + A
       };
-    }, x = () => {
-      window.removeEventListener("mousemove", I), window.removeEventListener("mouseup", x), window.removeEventListener("touchmove", I), window.removeEventListener("touchend", x), window.removeEventListener("touchcancel", x), setTimeout(() => {
+    }, C = () => {
+      window.removeEventListener("mousemove", I), window.removeEventListener("mouseup", C), window.removeEventListener("touchmove", I), window.removeEventListener("touchend", C), window.removeEventListener("touchcancel", C), setTimeout(() => {
         n("draggingChange", !1);
       }, 100);
     };
-    return ye(() => {
+    return be(() => {
       a.value && (a.value.addEventListener("mousedown", B), a.value.addEventListener("touchstart", B, { passive: !1 }));
-    }), ze(() => {
-      a.value && (a.value.removeEventListener("mousedown", B), a.value.removeEventListener("touchstart", B)), window.removeEventListener("mousemove", I), window.removeEventListener("mouseup", x), window.removeEventListener("touchmove", I), window.removeEventListener("touchend", x), window.removeEventListener("touchcancel", x);
-    }), (m, L) => (i(), g("div", {
+    }), Te(() => {
+      a.value && (a.value.removeEventListener("mousedown", B), a.value.removeEventListener("touchstart", B)), window.removeEventListener("mousemove", I), window.removeEventListener("mouseup", C), window.removeEventListener("touchmove", I), window.removeEventListener("touchend", C), window.removeEventListener("touchcancel", C);
+    }), (m, L) => (i(), c("div", {
       ref_key: "panelRef",
       ref: a,
       "data-testid": e.testId || "draggable-panel",
       class: p(e.className),
-      style: oe(l.value)
+      style: ne(l.value)
     }, [
       T(m.$slots, "default")
-    ], 14, It));
+    ], 14, Dt));
   }
-}), Bt = { class: "dashboard-widget" }, Kt = { class: "absolute inset-0 bg-black flex flex-col items-center justify-center text-center" }, Wt = { class: "w-full absolute opacity-100 text-primary" }, Mt = /* @__PURE__ */ k({
+}), Kt = { class: "dashboard-widget" }, Wt = { class: "absolute inset-0 bg-black flex flex-col items-center justify-center text-center" }, Et = { class: "w-full absolute opacity-100 text-primary" }, Mt = /* @__PURE__ */ b({
   __name: "Spinner",
   props: {
     title: {}
   },
   setup(t) {
-    return (s, e) => (i(), g("div", Bt, [
-      o("div", Kt, [
-        o("div", Wt, S(t.title), 1),
+    return (s, e) => (i(), c("div", Kt, [
+      o("div", Wt, [
+        o("div", Et, S(t.title), 1),
         e[0] || (e[0] = o("div", { class: "animate-ping rounded-full h-32 w-32 border-8 border-white" }, null, -1))
       ])
     ]));
   }
-}), We = (t, s) => {
+}), Ee = (t, s) => {
   const e = t.__vccOpts || t;
   for (const [n, a] of s)
     e[n] = a;
   return e;
-}, Et = {}, St = {
+}, St = {}, Lt = {
   class: "w-full h-full flex-1 flex flex-col gap-2 items-end justify-end content-end",
   style: { "min-height": "140px" }
 };
-function Lt(t, s) {
-  return i(), g("div", St, [
+function Pt(t, s) {
+  return i(), c("div", Lt, [
     T(t.$slots, "default")
   ]);
 }
-const to = /* @__PURE__ */ We(Et, [["render", Lt]]), Pt = {}, Nt = { className: "w-full flex flex-col items-end" };
-function zt(t, s) {
-  return i(), g("div", Nt, [
+const to = /* @__PURE__ */ Ee(St, [["render", Pt]]), Nt = {}, zt = { className: "w-full flex flex-col items-end" };
+function Tt(t, s) {
+  return i(), c("div", zt, [
     T(t.$slots, "default")
   ]);
 }
-const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
+const so = /* @__PURE__ */ Ee(Nt, [["render", Tt]]), oo = (t) => {
   console.warn("showToast TODO", t);
-}, no = /* @__PURE__ */ k({
+}, no = /* @__PURE__ */ b({
   __name: "DashboardGrid",
   props: {
     isEditing: { type: Boolean },
@@ -1283,25 +1283,25 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   setup(t) {
     const s = t, e = (r) => r < 0.8 ? 1 : r <= 1 ? 0 : r > 1 ? -1 : 0, n = v(() => {
-      let r = Oe(Number(s.zoomScale || 0));
+      let r = Ue(Number(s.zoomScale || 0));
       return {
         "--bwj-dashboard-transform-scale": r,
         "--bwj-dashboard-add-cols": e(r)
       };
-    }), a = v(() => V(
+    }), a = v(() => R(
       "dashboard-main-grid w-full",
       s.isEditing ? "editing" : "",
       s.responsiveGrid ? "responsive-grid" : "",
       `border border-dashed ${s.isEditing ? "border-primary border-opacity-50" : "border-transparent"}`
     ));
-    return (r, d) => (i(), g("div", {
+    return (r, d) => (i(), c("div", {
       class: p(a.value),
-      style: oe(n.value)
+      style: ne(n.value)
     }, [
       T(r.$slots, "default")
     ], 6));
   }
-}), Tt = { class: "widget-title-wrapper group w-full flex flex-row gap-2 items-center" }, At = { class: "drag-handle hidden cursor-pointer text-primary group-hover:flex hover:brightness-110 pointer-coarse:flex" }, jt = { class: "flex flex-row gap-2 items-center justify-between" }, Rt = { class: "widget-title" }, Ht = ["data-testid"], Vt = { class: "actions-inner" }, Ot = { class: "actions-buttons-container" }, Ut = ["data-collapsed"], Y = "size-5", Ft = /* @__PURE__ */ k({
+}), At = { class: "widget-title-wrapper group w-full flex flex-row gap-2 items-center" }, jt = { class: "drag-handle hidden cursor-pointer text-primary group-hover:flex hover:brightness-110 pointer-coarse:flex" }, Ht = { class: "w-full flex flex-row gap-2 items-center justify-between" }, Vt = ["data-testid"], Rt = { class: "actions-inner" }, Ot = { class: "actions-buttons-container" }, Ut = ["data-collapsed"], J = "size-5", Ft = /* @__PURE__ */ b({
   __name: "DashboardWidgetBase",
   props: {
     index: {},
@@ -1331,25 +1331,25 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   emits: ["removeClick", "moveClick", "selectContainer", "savedPropsChanged"],
   setup(t, { emit: s }) {
     const e = t, n = s, a = v(() => e.hideTitle && !e.isEditing), r = () => {
-      const x = e.meta?.noCollapse;
-      return typeof x < "u" ? x : e.noCollapse || !1;
-    }, d = U(r() ? !1 : e.widgetSavedProps?.isCollapsed || !1), w = (x) => {
+      const C = e.meta?.noCollapse;
+      return typeof C < "u" ? C : e.noCollapse || !1;
+    }, d = U(r() ? !1 : e.widgetSavedProps?.isCollapsed || !1), u = (C) => {
       if ((e.overrideCssClasses || "").trim().length > 0)
         return (e.overrideCssClasses || "").trim();
       const m = e.direction || "column", L = e.noBorder;
-      let _ = `dashboard-widget ${x ? "collapsed" : ""}`;
+      let _ = `dashboard-widget ${C ? "collapsed" : ""}`;
       return _ = `${_} direction-${m} ${e.isEditing ? "editing" : ""}`, _ = `${_} border border-solid`, ["large", "xlarge"].indexOf(e.size || "") > -1 && (_ = `${_} ${e.size}-widget`), L ? _ = `${_} border-transparent border-opacity-0` : (e.borderCssClasses || "").trim().length > 0 ? _ = `${_} ${e.borderCssClasses}` : _ = `${_} border-card-invert border-opacity-20`, e.noShadow && (_ = `${_} no-shadow`), e.noPadding && (_ = `${_} no-padding p-0`), (e.backgroundCssClasses || "").trim().length > 0 ? _ = `${_} ${e.backgroundCssClasses}`.trim() : _ = `${_} bg-card content-card`, (e.addCssClasses || "").trim().length > 0 && (_ = `${_} ${e.addCssClasses}`.trim()), _;
-    }, h = v(() => V(w(d.value))), c = v(() => {
-      const x = a.value;
-      return V(
+    }, $ = v(() => R(u(d.value))), g = v(() => {
+      const C = a.value;
+      return R(
         "widget-header",
-        x ? "hidden" : "flex items-center justify-between border-b border-solid border-card-invert",
-        x ? "border-opacity-0" : "border-opacity-20"
+        C ? "hidden" : "flex items-center justify-between border-b border-solid border-card-invert",
+        C ? "border-opacity-0" : "border-opacity-20"
       );
     }), l = () => {
       e.widgetKey && n("removeClick", e.widgetKey, e.parentWidgetKey);
-    }, b = (x) => {
-      e.widgetKey && n("moveClick", x, e.widgetKey, e.parentWidgetKey);
+    }, y = (C) => {
+      e.widgetKey && n("moveClick", C, e.widgetKey, e.parentWidgetKey);
     }, B = () => {
       n("savedPropsChanged", {
         parentWidgetKey: e.parentWidgetKey,
@@ -1359,32 +1359,35 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
     }, I = () => {
       e.widgetKey && (d.value = !d.value, B());
     };
-    return (x, m) => (i(), g("div", {
-      class: p(h.value)
+    return (C, m) => (i(), c("div", {
+      class: p($.value)
     }, [
       o("div", {
-        class: p(c.value)
+        class: p(g.value)
       }, [
-        o("div", Tt, [
-          o("div", At, [
-            D(u(Be), { class: "size-5" })
-          ]),
+        o("div", At, [
           o("div", jt, [
-            T(x.$slots, "title", {}, () => [
-              o("h2", Rt, S(t.title), 1)
+            D(h(Ke), { class: "size-5" })
+          ]),
+          o("div", Ht, [
+            T(C.$slots, "title", {}, () => [
+              o("h2", {
+                class: "widget-title cursor-pointer",
+                onClick: m[0] || (m[0] = j(() => I(), ["stop"]))
+              }, S(t.title), 1)
             ]),
-            T(x.$slots, "title-right")
+            T(C.$slots, "title-right")
           ])
         ]),
         o("div", {
           "data-testid": `collapse-and-other-actions_${t.widgetKey}_${t.index}`
         }, [
-          o("div", Vt, [
-            m[3] || (m[3] = o("div", null, [
+          o("div", Rt, [
+            m[4] || (m[4] = o("div", null, [
               o("span", { class: "hidden" }, "Widget")
             ], -1)),
             o("div", Ot, [
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `move-widget-left_${t.widgetKey}_${t.index}`,
                 isIconButton: !0,
                 disabled: t.index < 1,
@@ -1392,16 +1395,16 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   placement: "top",
                   title: `${t.index < 1 ? "Already at min position" : "Move Widget to the left/up"}`
                 },
-                onClick: m[0] || (m[0] = R((L) => b(-1), ["stop"]))
+                onClick: m[1] || (m[1] = j((L) => y(-1), ["stop"]))
               }, {
-                default: E(() => [
-                  D(u($e), {
-                    class: p(Y)
+                default: M(() => [
+                  D(h(Ie), {
+                    class: p(J)
                   })
                 ]),
                 _: 1
               }, 8, ["data-testid", "disabled", "tooltip"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `move-widget-right_${t.widgetKey}_${t.index}`,
                 isIconButton: !0,
                 disabled: t.index >= t.maxIndex,
@@ -1409,32 +1412,32 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   placement: "top",
                   title: `${t.index >= t.maxIndex ? "Already at max position" : "Move Widget to the right/down"}`
                 },
-                onClick: m[1] || (m[1] = R((L) => b(1), ["stop"]))
+                onClick: m[2] || (m[2] = j((L) => y(1), ["stop"]))
               }, {
-                default: E(() => [
-                  D(u(Ie), {
-                    class: p(Y)
+                default: M(() => [
+                  D(h(De), {
+                    class: p(J)
                   })
                 ]),
                 _: 1
               }, 8, ["data-testid", "disabled", "tooltip"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `remove-container_${t.title}`,
                 isIconButton: !0,
                 tooltip: {
                   placement: "top",
                   title: "Remove Widget"
                 },
-                onClick: R(l, ["stop"])
+                onClick: j(l, ["stop"])
               }, {
-                default: E(() => [
-                  D(u(De), {
-                    class: p(Y)
+                default: M(() => [
+                  D(h(Be), {
+                    class: p(J)
                   })
                 ]),
                 _: 1
               }, 8, ["data-testid"]),
-              r() ? Z("", !0) : (i(), N(u(A), {
+              r() ? Z("", !0) : (i(), N(h(H), {
                 key: 0,
                 "data-testid": `collapse-expand_${t.widgetKey}_${t.index}`,
                 className: "collapse-button",
@@ -1443,12 +1446,12 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   placement: "top",
                   title: `${d.value ? "Expand Widget" : "Collapse Widget"}`
                 },
-                onClick: m[2] || (m[2] = R(() => I(), ["stop"]))
+                onClick: m[3] || (m[3] = j(() => I(), ["stop"]))
               }, {
-                default: E(() => [
-                  D(u(he), {
-                    class: p(Y),
-                    style: oe({
+                default: M(() => [
+                  D(h(me), {
+                    class: p(J),
+                    style: ne({
                       transform: d.value ? "rotate(0deg)" : "rotate(180deg)",
                       transition: "transform 0.2s ease-in-out"
                     })
@@ -1458,13 +1461,13 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
               }, 8, ["data-testid", "tooltip"]))
             ])
           ])
-        ], 8, Ht)
+        ], 8, Vt)
       ], 2),
       o("div", {
         class: "widget-inner transition-height duration-300 ease-in-out",
         "data-collapsed": d.value
       }, [
-        T(x.$slots, "default")
+        T(C.$slots, "default")
       ], 8, Ut)
     ], 2));
   }
@@ -1474,7 +1477,7 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
 }, Xt = { class: "font-bold text-sm" }, Qt = { class: "flex flex-col text-xs" }, Yt = { class: "flex flex-col mt-3" }, Jt = { class: "ml-2 flex flex-col text-xs" }, es = {
   key: 1,
   class: "flex flex-col"
-}, ts = { class: "flex flex-col mt-3" }, ss = { class: "text-xs break-all" }, we = /* @__PURE__ */ k({
+}, ts = { class: "flex flex-col mt-3" }, ss = { class: "text-xs break-all" }, xe = /* @__PURE__ */ b({
   __name: "WidgetErrorWrapper",
   props: {
     index: {},
@@ -1503,53 +1506,44 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   emits: ["removeClick", "moveClick", "selectContainer", "savedPropsChanged"],
   setup(t, { emit: s }) {
-    const e = t, n = s, { removeClick: a, moveClick: r } = Q(n), d = v(() => e.extraProps);
-    return (w, h) => (i(), N(Ft, {
-      widgetKey: t.widgetKey,
-      title: "Widget Error",
-      parentWidgetKey: t.parentWidgetKey,
-      index: t.index,
-      maxIndex: t.maxIndex,
-      isEditing: t.isEditing,
-      onRemoveClick: u(a),
-      onMoveClick: u(r)
-    }, {
-      default: E(() => [
+    const e = t, a = Y(s), r = v(() => e.extraProps);
+    return (d, u) => (i(), N(Ft, Q(e, pe(h(a)), { title: "Widget Error" }), {
+      default: M(() => [
         o("div", qt, [
           o("span", Gt, 'Failed to load "' + S(t.widgetKey) + '"', 1),
-          d.value?.versionMismatch ? (i(), g("div", Zt, [
+          r.value?.versionMismatch ? (i(), c("div", Zt, [
             o("span", Xt, "Version Mismatch: " + S(t.widgetKey), 1),
             o("div", Qt, [
-              o("span", null, "Widget requires: Vue " + S(d.value?.requiredVer) + ".", 1),
-              o("span", null, "Host version: " + S(d.value?.hostVer) + ".", 1)
+              o("span", null, "Widget requires: Vue " + S(r.value?.requiredVer) + ".", 1),
+              o("span", null, "Host version: " + S(r.value?.hostVer) + ".", 1)
             ]),
             o("div", Yt, [
-              h[0] || (h[0] = o("h5", null, "Externals:", -1)),
+              u[0] || (u[0] = o("h5", null, "Externals:", -1)),
               o("dl", Jt, [
-                (i(!0), g(q, null, G(d.value?.externalDependencies, (c, l) => (i(), g("dd", {
-                  key: `dep-${l}`
-                }, "- " + S(c), 1))), 128))
+                (i(!0), c(q, null, G(r.value?.externalDependencies, ($, g) => (i(), c("dd", {
+                  key: `dep-${g}`
+                }, "- " + S($), 1))), 128))
               ])
             ])
-          ])) : (i(), g("div", es, [
-            h[2] || (h[2] = o("div", { class: "flex flex-col text-xs italic" }, [
+          ])) : (i(), c("div", es, [
+            u[2] || (u[2] = o("div", { class: "flex flex-col text-xs italic" }, [
               o("span", null, "The remote plugin is unavailable.")
             ], -1)),
-            h[3] || (h[3] = o("span", { class: "font-bold text-sm" }, "Error Details:", -1)),
+            u[3] || (u[3] = o("span", { class: "font-bold text-sm" }, "Error Details:", -1)),
             o("div", ts, [
-              h[1] || (h[1] = o("h5", null, "Details:", -1)),
-              o("div", ss, S(d.value?.errorMessage || "Unknown error occurred."), 1)
+              u[1] || (u[1] = o("h5", null, "Details:", -1)),
+              o("div", ss, S(r.value?.errorMessage || "Unknown error occurred."), 1)
             ])
           ]))
         ])
       ]),
       _: 1
-    }, 8, ["widgetKey", "parentWidgetKey", "index", "maxIndex", "isEditing", "onRemoveClick", "onMoveClick"]));
+    }, 16));
   }
 }), os = {
   key: 1,
   class: "flex items-center justify-center p-8 border border-dashed border-base-300"
-}, ns = { class: "text-sm animate-pulse" }, as = { class: "relative min-h-12 flex flex-col items-center justify-center bg-base-200 rounded-lg" }, ao = /* @__PURE__ */ k({
+}, ns = { class: "text-sm animate-pulse" }, rs = { class: "relative min-h-12 flex flex-col items-center justify-center bg-base-200 rounded-lg" }, ro = /* @__PURE__ */ b({
   __name: "DynamicWidgetLoader",
   props: {
     index: {},
@@ -1565,31 +1559,31 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   emits: ["removeClick", "moveClick", "selectContainer", "savedPropsChanged"],
   setup(t, { emit: s }) {
-    const e = (K, y) => {
-      const M = (X) => X.replace(/[^0-9.]/g, ""), z = M(K).split(".").map(Number), P = M(y).split(".").map(Number);
+    const e = (K, x) => {
+      const E = (X) => X.replace(/[^0-9.]/g, ""), z = E(K).split(".").map(Number), P = E(x).split(".").map(Number);
       return !(z[0] !== P[0] || z[1] < P[1]);
-    }, n = t, r = Q(s), d = v(() => `${n.widgetKey}`.split("_")), w = v(() => d.value.length > 1), h = v(() => w.value ? d.value[0] : n.widgetKey), c = v(() => w.value ? ke(n.widgetKey) : ""), l = v(() => n.widgetCatalog.get(h.value)), b = me(null), B = me(null), I = v(() => B.value ? {
+    }, n = t, r = Y(s), d = v(() => `${n.widgetKey}`.split("_")), u = v(() => d.value.length > 1), $ = v(() => u.value ? d.value[0] : n.widgetKey), g = v(() => u.value ? ke(n.widgetKey) : ""), l = v(() => n.widgetCatalog.get($.value)), y = fe(null), B = fe(null), I = v(() => B.value ? {
       ...n.extraProps,
       ...B.value
     } : n.extraProps);
-    Te(async () => {
+    Ae(async () => {
       const K = l.value;
       if (!K) return;
       if (B.value = null, K.component) {
-        b.value = K.component;
+        y.value = K.component;
         return;
       }
-      const y = typeof __HOST_VUE_VERSION__ < "u" ? __HOST_VUE_VERSION__ : "3.5.26", M = K.meta?.externalDependencies || [], z = M.find((P) => P.startsWith("vue@"));
+      const x = typeof __HOST_VUE_VERSION__ < "u" ? __HOST_VUE_VERSION__ : "3.5.26", E = K.meta?.externalDependencies || [], z = E.find((P) => P.startsWith("vue@"));
       if (z) {
         const P = z.split("@")[1];
-        if (!e(y, P)) {
+        if (!e(x, P)) {
           B.value = {
-            hostVer: y,
+            hostVer: x,
             requiredVer: P,
-            externalDependencies: M,
-            errorMessage: `Incompatible Vue version. Required: ${P}, Host: ${y}`,
+            externalDependencies: E,
+            errorMessage: `Incompatible Vue version. Required: ${P}, Host: ${x}`,
             versionMismatch: !0
-          }, b.value = ee(we);
+          }, y.value = te(xe);
           return;
         }
       }
@@ -1597,37 +1591,37 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
         try {
           if (K.isRemote) {
             const P = await K.loader();
-            b.value = ee(P.default || P);
+            y.value = te(P.default || P);
           } else
-            b.value = Ae(K.loader);
+            y.value = je(K.loader);
         } catch (P) {
           console.error(`Widget Load Error [${n.widgetKey}]:`, P), B.value = {
-            hostVer: y,
+            hostVer: x,
             requiredVer: z ? z.split("@")[1] : "Unknown",
-            externalDependencies: M,
+            externalDependencies: E,
             errorMessage: P.message,
             versionMismatch: !1
-          }, b.value = ee(we);
+          }, y.value = te(xe);
         }
     });
-    const x = v(() => w.value ? (n.childWidgetsConfig || []).filter((K) => K.parentWidgetKey === n.widgetKey) : []), m = (K, y) => {
-      r.removeClick(K, y);
-    }, L = (K, y, M) => {
-      r.moveClick(K, y, M);
+    const C = v(() => u.value ? (n.childWidgetsConfig || []).filter((K) => K.parentWidgetKey === n.widgetKey) : []), m = (K, x) => {
+      r.removeClick(K, x);
+    }, L = (K, x, E) => {
+      r.moveClick(K, x, E);
     }, _ = (K) => {
       r.selectContainer(K);
-    }, j = (K) => {
+    }, A = (K) => {
       r.savedPropsChanged(K);
-    }, F = (K, y) => (y || "").trim().length > 0 ? (n.savedProps || []).find(
-      (M) => M.parentWidgetKey === y && M.widgetKey === K
+    }, F = (K, x) => (x || "").trim().length > 0 ? (n.savedProps || []).find(
+      (E) => E.parentWidgetKey === x && E.widgetKey === K
     ) : (n.savedProps || []).find(
-      (M) => (M.parentWidgetKey || "").trim().length === 0 && M.widgetKey === K
+      (E) => (E.parentWidgetKey || "").trim().length === 0 && E.widgetKey === K
     );
-    return (K, y) => {
-      const M = je("DynamicWidgetLoader", !0);
-      return i(), N(Re, null, {
-        default: E(() => [
-          b.value ? (i(), N(pe(b.value), {
+    return (K, x) => {
+      const E = He("DynamicWidgetLoader", !0);
+      return i(), N(Ve, null, {
+        default: M(() => [
+          y.value ? (i(), N(he(y.value), {
             key: 0,
             index: t.index,
             maxIndex: t.maxIndex,
@@ -1635,23 +1629,23 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
             parentWidgetKey: t.parentWidgetKey,
             widgetCatalog: t.widgetCatalog,
             isEditing: t.isEditing,
-            highlight: w.value && t.targetContainerKey === t.widgetKey || !1,
-            title: w.value ? c.value : l.value?.meta?.name || l.value?.title,
+            highlight: u.value && t.targetContainerKey === t.widgetKey || !1,
+            title: u.value ? g.value : l.value?.meta?.name || l.value?.title,
             meta: l.value?.meta,
             widgetSavedProps: F(t.widgetKey, t.parentWidgetKey),
             extraProps: I.value,
             onRemoveClick: m,
             onMoveClick: L,
             onSelectContainer: _,
-            onSavedPropsChanged: j
-          }, He({ _: 2 }, [
-            w.value ? {
+            onSavedPropsChanged: A
+          }, Re({ _: 2 }, [
+            u.value ? {
               name: "default",
-              fn: E(() => [
-                (i(!0), g(q, null, G(x.value, (z, P) => (i(), N(M, {
+              fn: M(() => [
+                (i(!0), c(q, null, G(C.value, (z, P) => (i(), N(E, {
                   key: `${z.widgetKey}_${P}`,
                   index: P,
-                  maxIndex: x.value.length - 1,
+                  maxIndex: C.value.length - 1,
                   widgetKey: z.widgetKey,
                   parentWidgetKey: z.parentWidgetKey,
                   widgetCatalog: t.widgetCatalog,
@@ -1659,29 +1653,30 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   savedProps: t.savedProps,
                   extraProps: t.extraProps,
                   onRemoveClick: m,
-                  onMoveClick: L
+                  onMoveClick: L,
+                  onSavedPropsChanged: A
                 }, null, 8, ["index", "maxIndex", "widgetKey", "parentWidgetKey", "widgetCatalog", "isEditing", "savedProps", "extraProps"]))), 128))
               ]),
               key: "0"
             } : void 0
-          ]), 1064, ["index", "maxIndex", "widgetKey", "parentWidgetKey", "widgetCatalog", "isEditing", "highlight", "title", "meta", "widgetSavedProps", "extraProps"])) : (i(), g("div", os, [
+          ]), 1064, ["index", "maxIndex", "widgetKey", "parentWidgetKey", "widgetCatalog", "isEditing", "highlight", "title", "meta", "widgetSavedProps", "extraProps"])) : (i(), c("div", os, [
             o("p", ns, "Initializing " + S(t.widgetKey) + "...", 1)
           ]))
         ]),
-        fallback: E(() => [
-          o("div", as, [
-            D(u(Mt), {
+        fallback: M(() => [
+          o("div", rs, [
+            D(h(Mt), {
               title: `Loading ${l.value?.title || "Widget"}`
             }, null, 8, ["title"]),
-            y[0] || (y[0] = o("div", { class: "animate-ping absolute h-24 w-24 rounded-full border-4 border-primary opacity-20" }, null, -1)),
-            y[1] || (y[1] = o("div", { class: "animate-spin h-12 w-12 rounded-full border-4 border-primary border-t-transparent" }, null, -1))
+            x[0] || (x[0] = o("div", { class: "animate-ping absolute h-24 w-24 rounded-full border-4 border-primary opacity-20" }, null, -1)),
+            x[1] || (x[1] = o("div", { class: "animate-spin h-12 w-12 rounded-full border-4 border-primary border-t-transparent" }, null, -1))
           ])
         ]),
         _: 1
       });
     };
   }
-}), rs = ["data-testid"], is = { class: "text-sm font-semibold capitalize" }, ls = { "data-testid": "collapse-and-other-actions" }, ds = { class: "actions-inner" }, cs = { class: "actions-buttons-container" }, us = ["data-testid"], J = "size-5", gs = "border-transparent", ps = "border-card-invert", Me = /* @__PURE__ */ k({
+}), as = ["data-testid"], is = { class: "text-sm font-semibold capitalize" }, ls = { "data-testid": "collapse-and-other-actions" }, ds = { class: "actions-inner" }, cs = { class: "actions-buttons-container" }, us = ["data-testid"], ee = "size-5", gs = "border-transparent", ps = "border-card-invert", Me = /* @__PURE__ */ b({
   __name: "WidgetContainer",
   props: {
     index: {},
@@ -1710,66 +1705,66 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   emits: ["removeClick", "moveClick", "selectContainer", "savedPropsChanged"],
   setup(t, { emit: s }) {
-    const e = t, a = Q(s), r = v(() => e.maxIndex > -1), d = v(() => {
+    const e = t, a = Y(s), r = v(() => e.maxIndex > -1), d = v(() => {
       const B = r.value;
       return e.highlight ? gs : e.isEditing && !B ? ps : "border-transparent";
-    }), w = v(() => {
-      const B = e.highlight || !1, I = e.direction || "column", x = r.value, m = e.isEditing || !1;
-      let j = B ? "border-transparent" : m ? "border-card-invert" : "border-transparent";
+    }), u = v(() => {
+      const B = e.highlight || !1, I = e.direction || "column", C = r.value, m = e.isEditing || !1;
+      let A = B ? "border-transparent" : m ? "border-card-invert" : "border-transparent";
       const F = ["large", "xlarge"].includes(e.size || "");
       let K = "";
       ["large", "xlarge"].indexOf(e.size || "") > -1 && (K = `${e.size}-widget`);
-      let y = "";
-      return I === "row" && !x ? y = "min-h-48" : I === "column" && !x && (y = "min-h-96"), V(
+      let x = "";
+      return I === "row" && !C ? x = "min-h-48" : I === "column" && !C && (x = "min-h-96"), R(
         "dashboard-widget-container relative ",
-        x ? "" : "has-no-children",
+        C ? "" : "has-no-children",
         m ? "editing" : "",
-        y,
+        x,
         K,
         F ? "widget-container-grid" : "widget-container-flex",
         `direction-${I}`,
-        `border ${j}`,
-        `${B ? "highlight-container" : ""} ${j}`
+        `border ${A}`,
+        `${B ? "highlight-container" : ""} ${A}`
       );
-    }), h = v(() => `widget-container-header direction-${e.direction} flex items-center border ${d.value}`), c = () => {
+    }), $ = v(() => `widget-container-header direction-${e.direction} flex items-center border ${d.value}`), g = () => {
       e.widgetKey && a.removeClick(e.widgetKey);
     }, l = (B) => {
       e.widgetKey && a.moveClick(B, e.widgetKey, e.parentWidgetKey);
-    }, b = () => {
+    }, y = () => {
       e.widgetKey && a.selectContainer(e.widgetKey);
     };
-    return (B, I) => (i(), g("div", {
+    return (B, I) => (i(), c("div", {
       "data-testid": `container_${e.widgetKey}`,
       "data-change": "asd",
-      class: p(w.value)
+      class: p(u.value)
     }, [
       o("div", {
-        class: p(h.value)
+        class: p($.value)
       }, [
         o("div", {
           class: "widget-title-wrapper w-full flex whitespace-nowrap",
-          onClick: R(b, ["stop"])
+          onClick: j(y, ["stop"])
         }, [
           o("span", is, S(e.title), 1)
         ]),
         o("div", ls, [
           o("div", ds, [
             o("div", cs, [
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `open-widgets-catalog-from-container_${e.title}`,
                 isIconButton: !0,
                 class: "whitespace-nowrap",
                 tooltip: { placement: "top", title: "Target this Container" },
-                onClick: R(b, ["stop"])
+                onClick: j(y, ["stop"])
               }, {
-                default: E(() => [
-                  D(u(ct), {
-                    class: p(`${J} ${e.highlight ? "text-success" : "text-disabled"}`)
+                default: M(() => [
+                  D(h(ut), {
+                    class: p(`${ee} ${e.highlight ? "text-success" : "text-disabled"}`)
                   }, null, 8, ["class"])
                 ]),
                 _: 1
               }, 8, ["data-testid"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `move-container-left_${e.title}`,
                 isIconButton: !0,
                 disabled: e.index < 1,
@@ -1777,16 +1772,16 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   placement: "top",
                   title: e.index < 1 ? "Already at min position" : "Move Container to the left/up"
                 },
-                onClick: I[0] || (I[0] = R((x) => l(-1), ["stop"]))
+                onClick: I[0] || (I[0] = j((C) => l(-1), ["stop"]))
               }, {
-                default: E(() => [
-                  D(u($e), {
-                    class: p(J)
+                default: M(() => [
+                  D(h(Ie), {
+                    class: p(ee)
                   })
                 ]),
                 _: 1
               }, 8, ["data-testid", "disabled", "tooltip"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `move-container-right_${e.title}`,
                 isIconButton: !0,
                 disabled: e.index >= e.maxIndex,
@@ -1794,24 +1789,24 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   placement: "top",
                   title: e.index >= e.maxIndex ? "Already at max position" : "Move Container to the right/down"
                 },
-                onClick: I[1] || (I[1] = R((x) => l(1), ["stop"]))
+                onClick: I[1] || (I[1] = j((C) => l(1), ["stop"]))
               }, {
-                default: E(() => [
-                  D(u(Ie), {
-                    class: p(J)
+                default: M(() => [
+                  D(h(De), {
+                    class: p(ee)
                   })
                 ]),
                 _: 1
               }, 8, ["data-testid", "disabled", "tooltip"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": `remove-container_${e.title}`,
                 isIconButton: !0,
                 tooltip: { placement: "top", title: "Remove Container" },
-                onClick: R(c, ["stop"])
+                onClick: j(g, ["stop"])
               }, {
-                default: E(() => [
-                  D(u(De), {
-                    class: p(J)
+                default: M(() => [
+                  D(h(Be), {
+                    class: p(ee)
                   })
                 ]),
                 _: 1
@@ -1826,9 +1821,9 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
       }, [
         T(B.$slots, "default")
       ], 8, us)
-    ], 10, rs));
+    ], 10, as));
   }
-}), ro = /* @__PURE__ */ k({
+}), ao = /* @__PURE__ */ b({
   __name: "WidgetContainerRow",
   props: {
     index: {},
@@ -1857,22 +1852,18 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   emits: ["removeClick", "moveClick", "selectContainer", "savedPropsChanged"],
   setup(t, { emit: s }) {
-    const e = t, n = s, { removeClick: a, moveClick: r, selectContainer: d } = Q(n), w = v(() => {
-      const { direction: h, ...c } = e;
-      return c;
+    const e = t, a = Y(s), r = v(() => {
+      const { direction: d, ...u } = e;
+      return u;
     });
-    return (h, c) => (i(), N(Me, ne({ direction: "row" }, w.value, {
-      onRemoveClick: u(a),
-      onMoveClick: u(r),
-      onSelectContainer: u(d)
-    }), {
-      default: E(() => [
-        T(h.$slots, "default")
+    return (d, u) => (i(), N(Me, Q({ direction: "row" }, r.value, pe(h(a))), {
+      default: M(() => [
+        T(d.$slots, "default")
       ]),
       _: 3
-    }, 16, ["onRemoveClick", "onMoveClick", "onSelectContainer"]));
+    }, 16));
   }
-}), io = /* @__PURE__ */ k({
+}), io = /* @__PURE__ */ b({
   __name: "WidgetContainerLarge",
   props: {
     index: {},
@@ -1901,22 +1892,18 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   emits: ["removeClick", "moveClick", "selectContainer", "savedPropsChanged"],
   setup(t, { emit: s }) {
-    const e = t, n = s, { removeClick: a, moveClick: r, selectContainer: d } = Q(n), w = v(() => {
-      const { size: h, ...c } = e;
-      return c;
+    const e = t, a = Y(s), r = v(() => {
+      const { size: d, ...u } = e;
+      return u;
     });
-    return (h, c) => (i(), N(Me, ne({ size: "large" }, w.value, {
-      onRemoveClick: u(a),
-      onMoveClick: u(r),
-      onSelectContainer: u(d)
-    }), {
-      default: E(() => [
-        T(h.$slots, "default")
+    return (d, u) => (i(), N(Me, Q({ size: "large" }, r.value, pe(h(a))), {
+      default: M(() => [
+        T(d.$slots, "default")
       ]),
       _: 3
-    }, 16, ["onRemoveClick", "onMoveClick", "onSelectContainer"]));
+    }, 16));
   }
-}), hs = { class: "w-full" }, ms = { class: "flex flex-row items-center gap-2 justify-between" }, fs = { class: "font-bold" }, vs = { class: "text-xs" }, Cs = { class: "flex flex-col gap-2 text-xs" }, ws = { class: "ml-2 flex flex-col text-xs" }, ue = /* @__PURE__ */ k({
+}), hs = { class: "w-full" }, ms = { class: "flex flex-row items-center gap-2 justify-between" }, fs = { class: "font-bold" }, vs = { class: "text-xs" }, ws = { class: "flex flex-col gap-2 text-xs" }, Cs = { class: "ml-2 flex flex-col text-xs" }, ue = /* @__PURE__ */ b({
   __name: "WidgetListItem",
   props: {
     widgetKey: {},
@@ -1925,103 +1912,103 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   },
   emits: ["addWidget"],
   setup(t, { emit: s }) {
-    const e = t, n = s, a = U(!1), r = e.metaData, d = r?.icon || ut, w = r?.name || "Unknown", h = r?.description || "---", c = r?.noDuplicatedWidgets || !1, l = v(() => c && e?.alreadyAdded), b = v(() => V(`
+    const e = t, n = s, a = U(!1), r = e.metaData, d = r?.icon || gt, u = r?.name || "Unknown", $ = r?.description || "---", g = r?.noDuplicatedWidgets || !1, l = v(() => g && e?.alreadyAdded), y = v(() => R(`
     flex flex-row gap-2 p-2 rounded-md border text-sm bg-card content-card backdrop-opacity-100
     ${l.value ? "border-disabled fill-disabled text-disabled" : "cursor-pointer border-primary fill-danger hover:fill-primary content-primary hover:brightness-110"}
   `)), B = () => {
       l.value || n("addWidget");
-    }, I = (x) => {
-      x.stopPropagation(), x.preventDefault(), a.value = !a.value;
+    }, I = (C) => {
+      C.stopPropagation(), C.preventDefault(), a.value = !a.value;
     };
-    return (x, m) => (i(), g("div", {
-      class: p(b.value),
+    return (C, m) => (i(), c("div", {
+      class: p(y.value),
       style: { width: "calc(100% - 1rem)" },
       onClick: B
     }, [
-      (i(), N(pe(u(d)), { class: "" })),
+      (i(), N(he(h(d)), { class: "" })),
       o("div", hs, [
         o("div", ms, [
-          o("span", fs, S(u(w)), 1),
+          o("span", fs, S(h(u)), 1),
           o("div", vs, S(l.value ? "(Added)" : ""), 1)
         ]),
-        o("div", Cs, [
-          o("div", null, S(u(h)), 1),
-          a.value && u(r)?.externalDependencies?.length > 0 ? (i(), g("div", {
+        o("div", ws, [
+          o("div", null, S(h($)), 1),
+          a.value && h(r)?.externalDependencies?.length > 0 ? (i(), c("div", {
             key: 0,
             class: "mt-3 cursor-pointer",
             onClick: I
           }, [
-            m[0] || (m[0] = be(" Externals: ", -1)),
-            o("dl", ws, [
-              (i(!0), g(q, null, G(u(r)?.externalDependencies, (L, _) => (i(), g("dd", { key: _ }, "- " + S(L), 1))), 128))
+            m[0] || (m[0] = _e(" Externals: ", -1)),
+            o("dl", Cs, [
+              (i(!0), c(q, null, G(h(r)?.externalDependencies, (L, _) => (i(), c("dd", { key: _ }, "- " + S(L), 1))), 128))
             ])
           ])) : Z("", !0)
         ])
       ])
     ], 2));
   }
-}), xs = { class: "w-full flex flex-col" }, ys = { class: "font-bold" }, bs = { class: "flex flex-col text-xs" }, ks = { class: "mt-1 flex flex-row gap-2 items-center" }, _s = /* @__PURE__ */ k({
+}), xs = { class: "w-full flex flex-col" }, ys = { class: "font-bold" }, bs = { class: "flex flex-col text-xs" }, _s = { class: "mt-1 flex flex-row gap-2 items-center" }, ks = /* @__PURE__ */ b({
   __name: "SettingListItem",
   props: {
     item: {}
   },
   emits: ["settingChanged"],
   setup(t, { emit: s }) {
-    const e = t, n = s, a = e.item.name || "Unknown", r = e.item.description || "---", d = V(`
+    const e = t, n = s, a = e.item.name || "Unknown", r = e.item.description || "---", d = R(`
   flex flex-row gap-2 px-2 text-sm backdrop-opacity-100
-`), w = (c) => {
+`), u = (g) => {
       n("settingChanged", {
         ...e.item,
-        value: c || ""
+        value: g || ""
       });
-    }, h = (c) => {
-      const l = Ue.incrementOrDecrementValue(e.item, c);
+    }, $ = (g) => {
+      const l = Fe.incrementOrDecrementValue(e.item, g);
       n("settingChanged", l);
     };
-    return (c, l) => (i(), g("div", {
-      class: p(u(d)),
+    return (g, l) => (i(), c("div", {
+      class: p(h(d)),
       style: { width: "calc(100% - 1rem)" }
     }, [
       o("div", xs, [
-        o("h6", ys, S(u(a)), 1),
-        o("p", bs, S(u(r)), 1),
-        o("div", ks, [
-          D(u(Ke), {
+        o("h6", ys, S(h(a)), 1),
+        o("p", bs, S(h(r)), 1),
+        o("div", _s, [
+          D(h(We), {
             label: "",
             size: "small",
             class: "w-full",
             modelValue: t.item.value,
-            "onUpdate:modelValue": w,
+            "onUpdate:modelValue": u,
             onKeydown: [
-              l[0] || (l[0] = fe(R((b) => h(1), ["prevent"]), ["up"])),
-              l[1] || (l[1] = fe(R((b) => h(-1), ["prevent"]), ["down"]))
+              l[0] || (l[0] = ve(j((y) => $(1), ["prevent"]), ["up"])),
+              l[1] || (l[1] = ve(j((y) => $(-1), ["prevent"]), ["down"]))
             ]
           }, null, 8, ["modelValue"]),
-          D(u(A), {
+          D(h(H), {
             "data-testid": `setting-decrease_${t.item.key}`,
             isIconButton: !0,
             tooltip: {
               placement: "top",
               title: "Decrease Value"
             },
-            onClick: l[2] || (l[2] = () => h(-1))
+            onClick: l[2] || (l[2] = () => $(-1))
           }, {
-            default: E(() => [
-              D(u(nt))
+            default: M(() => [
+              D(h(rt))
             ]),
             _: 1
           }, 8, ["data-testid"]),
-          D(u(A), {
+          D(h(H), {
             "data-testid": `setting-increase_${t.item.key}`,
             isIconButton: !0,
             tooltip: {
               placement: "top",
               title: "Increase Value"
             },
-            onClick: l[3] || (l[3] = () => h(1))
+            onClick: l[3] || (l[3] = () => $(1))
           }, {
-            default: E(() => [
-              D(u(ot))
+            default: M(() => [
+              D(h(nt))
             ]),
             _: 1
           }, 8, ["data-testid"])
@@ -2029,13 +2016,13 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
       ])
     ], 2));
   }
-}), $s = { class: "flex flex-col gap-2 p-2" }, Is = { class: "flex flex-row gap-2 justify-between" }, Ds = ["title"], Bs = { class: "flex flex-row gap-2 items-center" }, Ks = { class: "hidden sm:flex sm:flex-row sm:items-center sm:gap-1" }, Ws = ["onClick"], Ms = { class: "flex flex-col gap-1 sm:hidden" }, Es = { class: "group flex items-center gap-2 text-primary group-hover:text-primary-inverse" }, Ss = { class: "py-2 font-bold" }, Ls = { class: "p-2 rounded-md border border-primary" }, Ps = ["onClick"], Ns = { className: "sm:mt-2 flex flex-col gap-1 w-full" }, zs = {
+}), $s = { class: "flex flex-col gap-2 p-2" }, Is = { class: "flex flex-row gap-2 justify-between" }, Ds = ["title"], Bs = { class: "flex flex-row gap-2 items-center" }, Ks = { class: "hidden sm:flex sm:flex-row sm:items-center sm:gap-1" }, Ws = ["onClick"], Es = { class: "flex flex-col gap-1 sm:hidden" }, Ms = { class: "group flex items-center gap-2 text-primary group-hover:text-primary-inverse" }, Ss = { class: "py-2 font-bold" }, Ls = { class: "p-2 rounded-md border border-primary" }, Ps = ["onClick"], Ns = { className: "sm:mt-2 flex flex-col gap-1 w-full" }, zs = {
   class: "flex flex-col gap-2 overflow-x-hidden overflow-y-auto",
   style: { "max-height": "360px" }
 }, Ts = {
   key: 0,
   className: "hidden px-2 w-full font-semibold sm:flex"
-}, As = { class: "mt-4 w-full flex flex-row justify-end pt-1" }, lo = /* @__PURE__ */ k({
+}, As = { class: "mt-4 w-full flex flex-row justify-end pt-1" }, lo = /* @__PURE__ */ b({
   __name: "WidgetsCatalogFlyout",
   props: {
     targetContainerKey: {},
@@ -2054,16 +2041,16 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
     const s = t, e = (f, W) => [
       ...W.widgets.filter((le) => le.indexOf("Container") === -1),
       ...W.childWidgetsConfig.map((le) => le.widgetKey)
-    ].includes(f), n = U("Editing"), a = U(0), r = U(""), d = U(!1), w = U(!1), h = v(() => Array.from(s.widgetsCatalog.keys())), c = v(() => h.value.map((f) => ({
+    ].includes(f), n = U("Editing"), a = U(0), r = U(""), d = U(!1), u = U(!1), $ = v(() => Array.from(s.widgetsCatalog.keys())), g = v(() => $.value.map((f) => ({
       widgetKey: f,
-      metaData: Fe(f, s.widgetsCatalog)
-    }))), l = v(() => c.value.filter(
-      (f) => f.metaData.categories.includes("Widget") && j(f.metaData)
-    )), b = v(() => c.value.filter(
-      (f) => f.metaData.categories.includes("Chart") && j(f.metaData)
-    )), B = v(() => c.value.filter(
-      (f) => f.metaData.categories.includes("Container") && j(f.metaData)
-    )), I = v(() => !!s.targetContainerKey), x = () => I.value, m = v(() => {
+      metaData: qe(f, s.widgetsCatalog)
+    }))), l = v(() => g.value.filter(
+      (f) => f.metaData.categories.includes("Widget") && A(f.metaData)
+    )), y = v(() => g.value.filter(
+      (f) => f.metaData.categories.includes("Chart") && A(f.metaData)
+    )), B = v(() => g.value.filter(
+      (f) => f.metaData.categories.includes("Container") && A(f.metaData)
+    )), I = v(() => !!s.targetContainerKey), C = () => I.value, m = v(() => {
       const f = [
         {
           id: 0,
@@ -2074,43 +2061,43 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
           label: "Charts"
         }
       ];
-      return x() || (f.push({
+      return C() || (f.push({
         id: 2,
         label: "Containers"
       }), f.push({
         id: 3,
         label: "CSS Settings",
         hideLabel: !0,
-        icon: ee(at)
+        icon: te(at)
       })), f;
     }), L = v(() => m.value.find((f) => f.id === a.value)?.label || "Category..."), _ = (f) => {
       r.value = f;
-    }, j = (f) => {
+    }, A = (f) => {
       const W = r.value.trim().toLowerCase();
-      return W.length < 1 ? !0 : f.name.trim().toLowerCase().includes(W) || f.description.toLowerCase().includes(W) || f.categories.some((C) => C.toLowerCase().includes(W));
+      return W.length < 1 ? !0 : f.name.trim().toLowerCase().includes(W) || f.description.toLowerCase().includes(W) || f.categories.some((w) => w.toLowerCase().includes(W));
     }, F = (f) => {
       const W = r.value.trim().toLowerCase();
       return W.length < 1 ? !0 : f.name.trim().toLowerCase().includes(W) || f.description.toLowerCase().includes(W);
-    }, K = (f, W) => V(
+    }, K = (f, W) => R(
       "px-4 py-2 font-medium cursor-pointer",
       `${W ? "" : "border-b-2"} border-transparent hover:border-primary focus:outline-none`,
       f === a.value ? "text-primary border-primary" : ""
-    ), y = (f) => V(
+    ), x = (f) => R(
       "w-full flex items-center gap-2 px-2 py-1 text-left text-sm cursor-pointer border",
       f !== a.value ? "border-transparent content-topbar hover:bg-primary hover:content-primary" : "border-primary text-primary"
-    ), M = (f) => {
-      x() ? s.addWidget(f, s.targetContainerKey) : s.addWidget(f);
+    ), E = (f) => {
+      C() ? s.addWidget(f, s.targetContainerKey) : s.addWidget(f);
     }, z = (f) => {
-      const W = (s.currentDashboardConfig.cssSettings || []).map((C) => C.key === f.key ? f : C);
+      const W = (s.currentDashboardConfig.cssSettings || []).map((w) => w.key === f.key ? f : w);
       s.onSettingItemsUpdated(W);
     }, P = (f) => {
-      w.value = f;
+      u.value = f;
     }, X = (f) => {
-      a.value = f, w.value = !1;
-    }, Ee = (f) => {
+      a.value = f, u.value = !1;
+    }, Se = (f) => {
       d.value = f;
     };
-    return Ve(
+    return Oe(
       () => s.targetContainerKey,
       (f) => {
         if (f) {
@@ -2121,25 +2108,25 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
           n.value = "Widget Catalog";
       },
       { immediate: !0 }
-    ), (f, W) => (i(), N(u(Dt), {
+    ), (f, W) => (i(), N(h(Bt), {
       testId: "dashboard-catalog-flyout",
       className: `transition-colors duration-150 bg-body content-body bg-opacity-70 border-2 ${d.value ? "border-warning" : "border-primary"} max-w-72 sm:max-w-90`,
       zIndex: t.zIndex || 99999,
       style: {
         backdropFilter: "blur(8px)"
       },
-      onDraggingChange: Ee
+      onDraggingChange: Se
     }, {
-      default: E(() => [
+      default: M(() => [
         o("div", $s, [
           o("div", Is, [
             o("div", {
               class: p(`handle cursor-grab flex-1 flex gap-2 w-full ${d.value ? "text-warning" : "hover:text-primary"}`)
             }, [
-              d.value ? (i(), N(u(Be), {
+              d.value ? (i(), N(h(Ke), {
                 key: 0,
                 class: "size-5"
-              })) : (i(), N(u(dt), {
+              })) : (i(), N(h(ct), {
                 key: 1,
                 class: "size-5"
               })),
@@ -2149,7 +2136,7 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
               }, S(n.value), 9, Ds)
             ], 2),
             o("div", Bs, [
-              D(u(A), {
+              D(h(H), {
                 "data-testid": "undo-dashboard-config-change",
                 isIconButton: !0,
                 tooltip: {
@@ -2157,14 +2144,14 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   title: "Undo"
                 },
                 disabled: t.undoStatus.isUndoDisabled,
-                onClick: W[0] || (W[0] = (C) => t.onUndoOrRedo("Undo"))
+                onClick: W[0] || (W[0] = (w) => t.onUndoOrRedo("Undo"))
               }, {
-                default: E(() => [
-                  D(u(it), { class: "size-5" })
+                default: M(() => [
+                  D(h(lt), { class: "size-5" })
                 ]),
                 _: 1
               }, 8, ["disabled"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": "redo-dashboard-config-change",
                 isIconButton: !0,
                 tooltip: {
@@ -2172,14 +2159,14 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                   title: "Redo"
                 },
                 disabled: t.undoStatus.isRedoDisabled,
-                onClick: W[1] || (W[1] = (C) => t.onUndoOrRedo("Redo"))
+                onClick: W[1] || (W[1] = (w) => t.onUndoOrRedo("Redo"))
               }, {
-                default: E(() => [
-                  D(u(lt), { class: "size-5" })
+                default: M(() => [
+                  D(h(dt), { class: "size-5" })
                 ]),
                 _: 1
               }, 8, ["disabled"]),
-              D(u(A), {
+              D(h(H), {
                 "data-testid": "reset-dashboard-to-default",
                 isIconButton: !0,
                 tooltip: {
@@ -2188,50 +2175,50 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
                 },
                 onClick: t.onResetToDefaultDashboardClick
               }, {
-                default: E(() => [
-                  D(u(rt), { class: "size-5" })
+                default: M(() => [
+                  D(h(it), { class: "size-5" })
                 ]),
                 _: 1
               }, 8, ["onClick"])
             ])
           ]),
           o("div", Ks, [
-            (i(!0), g(q, null, G(m.value, (C) => (i(), g("button", {
-              key: C.id,
-              class: p(K(C.id, C.id === 3)),
-              onClick: () => X(C.id)
+            (i(!0), c(q, null, G(m.value, (w) => (i(), c("button", {
+              key: w.id,
+              class: p(K(w.id, w.id === 3)),
+              onClick: () => X(w.id)
             }, [
               o("span", {
-                class: p(C.hideLabel ? "sr-only" : "")
-              }, S(C.label), 3),
-              C.icon ? (i(), N(pe(C.icon), { key: 0 })) : Z("", !0)
+                class: p(w.hideLabel ? "sr-only" : "")
+              }, S(w.label), 3),
+              w.icon ? (i(), N(he(w.icon), { key: 0 })) : Z("", !0)
             ], 10, Ws))), 128))
           ]),
-          o("div", Ms, [
-            D(u(kt), {
+          o("div", Es, [
+            D(h(kt), {
               enabled: !0,
               showChevron: !0,
-              isMenuOpen: w.value,
+              isMenuOpen: u.value,
               onToggleOpen: P
             }, {
-              icon: E(() => [
-                o("div", Es, [
+              icon: M(() => [
+                o("div", Ms, [
                   o("h5", Ss, S(L.value), 1),
-                  D(u(he), { class: "shrink-0 ml-1 size-4" })
+                  D(h(me), { class: "shrink-0 ml-1 size-4" })
                 ])
               ]),
-              default: E(() => [
+              default: M(() => [
                 o("div", Ls, [
                   W[3] || (W[3] = o("h6", { class: "font-semibold" }, "Category:", -1)),
-                  (i(!0), g(q, null, G(m.value, (C) => (i(), g("button", {
-                    key: C.id,
+                  (i(!0), c(q, null, G(m.value, (w) => (i(), c("button", {
+                    key: w.id,
                     type: "button",
-                    class: p(y(C.id)),
+                    class: p(x(w.id)),
                     role: "menuitem",
                     tabIndex: -1,
-                    onClick: () => X(C.id)
+                    onClick: () => X(w.id)
                   }, [
-                    o("span", null, S(C.label), 1)
+                    o("span", null, S(w.label), 1)
                   ], 10, Ps))), 128))
                 ])
               ]),
@@ -2239,46 +2226,46 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
             }, 8, ["isMenuOpen"])
           ]),
           o("div", Ns, [
-            D(u(Ke), {
+            D(h(We), {
               label: "",
               placeholder: "Find...",
               size: "small",
               class: "w-full",
               modelValue: r.value,
               "onUpdate:modelValue": [
-                W[2] || (W[2] = (C) => r.value = C),
+                W[2] || (W[2] = (w) => r.value = w),
                 _
               ]
             }, null, 8, ["modelValue"])
           ]),
           o("div", zs, [
-            a.value === 3 ? (i(), g("div", Ts, S(L.value) + ": ", 1)) : Z("", !0),
-            a.value === 0 ? (i(!0), g(q, { key: 1 }, G(l.value, (C) => (i(), N(ue, {
-              key: C.widgetKey,
-              widgetKey: C.widgetKey,
-              metaData: C.metaData,
-              alreadyAdded: e(C.widgetKey, t.currentDashboardConfig),
-              onAddWidget: () => M(C.widgetKey)
-            }, null, 8, ["widgetKey", "metaData", "alreadyAdded", "onAddWidget"]))), 128)) : a.value === 1 ? (i(!0), g(q, { key: 2 }, G(b.value, (C) => (i(), N(ue, {
-              key: C.widgetKey,
-              widgetKey: C.widgetKey,
-              metaData: C.metaData,
-              alreadyAdded: e(C.widgetKey, t.currentDashboardConfig),
-              onAddWidget: () => M(C.widgetKey)
-            }, null, 8, ["widgetKey", "metaData", "alreadyAdded", "onAddWidget"]))), 128)) : a.value === 2 && !I.value ? (i(!0), g(q, { key: 3 }, G(B.value, (C) => (i(), N(ue, {
-              key: C.widgetKey,
-              widgetKey: C.widgetKey,
-              metaData: C.metaData,
-              alreadyAdded: e(C.widgetKey, t.currentDashboardConfig),
-              onAddWidget: () => t.addContainer(C.widgetKey)
-            }, null, 8, ["widgetKey", "metaData", "alreadyAdded", "onAddWidget"]))), 128)) : a.value === 3 && !I.value ? (i(!0), g(q, { key: 4 }, G((t.currentDashboardConfig.cssSettings || []).filter(F), (C) => (i(), N(_s, {
-              key: C.key,
-              item: C,
+            a.value === 3 ? (i(), c("div", Ts, S(L.value) + ": ", 1)) : Z("", !0),
+            a.value === 0 ? (i(!0), c(q, { key: 1 }, G(l.value, (w) => (i(), N(ue, {
+              key: w.widgetKey,
+              widgetKey: w.widgetKey,
+              metaData: w.metaData,
+              alreadyAdded: e(w.widgetKey, t.currentDashboardConfig),
+              onAddWidget: () => E(w.widgetKey)
+            }, null, 8, ["widgetKey", "metaData", "alreadyAdded", "onAddWidget"]))), 128)) : a.value === 1 ? (i(!0), c(q, { key: 2 }, G(y.value, (w) => (i(), N(ue, {
+              key: w.widgetKey,
+              widgetKey: w.widgetKey,
+              metaData: w.metaData,
+              alreadyAdded: e(w.widgetKey, t.currentDashboardConfig),
+              onAddWidget: () => E(w.widgetKey)
+            }, null, 8, ["widgetKey", "metaData", "alreadyAdded", "onAddWidget"]))), 128)) : a.value === 2 && !I.value ? (i(!0), c(q, { key: 3 }, G(B.value, (w) => (i(), N(ue, {
+              key: w.widgetKey,
+              widgetKey: w.widgetKey,
+              metaData: w.metaData,
+              alreadyAdded: e(w.widgetKey, t.currentDashboardConfig),
+              onAddWidget: () => t.addContainer(w.widgetKey)
+            }, null, 8, ["widgetKey", "metaData", "alreadyAdded", "onAddWidget"]))), 128)) : a.value === 3 && !I.value ? (i(!0), c(q, { key: 4 }, G((t.currentDashboardConfig.cssSettings || []).filter(F), (w) => (i(), N(ks, {
+              key: w.key,
+              item: w,
               onSettingChanged: z
             }, null, 8, ["item"]))), 128)) : Z("", !0)
           ]),
           o("div", As, [
-            D(u(A), {
+            D(h(H), {
               class: "bg-opacity-100",
               tooltip: {
                 placement: "bottom",
@@ -2286,8 +2273,8 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
               },
               onClick: t.onDoneClick
             }, {
-              default: E(() => [...W[4] || (W[4] = [
-                be(" Done ", -1)
+              default: M(() => [...W[4] || (W[4] = [
+                _e(" Done ", -1)
               ])]),
               _: 1
             }, 8, ["onClick"])
@@ -2299,49 +2286,49 @@ const so = /* @__PURE__ */ We(Pt, [["render", zt]]), oo = (t) => {
   }
 });
 export {
-  ot as AddIcon,
-  A as Button,
-  he as ChevronDownIcon,
-  ut as CircleQuestionMarkIcon,
-  ct as CrosshairIcon,
+  nt as AddIcon,
+  H as Button,
+  me as ChevronDownIcon,
+  gt as CircleQuestionMarkIcon,
+  ut as CrosshairIcon,
   no as DashboardGrid,
   Ft as DashboardWidgetBase,
   Os as DeleteIcon,
-  Dt as DraggablePanel,
+  Bt as DraggablePanel,
   kt as Dropdown,
-  ao as DynamicWidgetLoader,
+  ro as DynamicWidgetLoader,
   Us as EditIcon,
   qs as GridIcon,
-  Be as HandGrabIcon,
-  dt as HandIcon,
+  Ke as HandGrabIcon,
+  ct as HandIcon,
   eo as ListItem,
-  nt as MinusCircleIcon,
+  rt as MinusCircleIcon,
   Ys as MonitorIcon,
   Xs as MonitorSmartphoneIcon,
-  $e as MoveLeftIcon,
-  Ie as MoveRightIcon,
-  ot as PlusCircleIcon,
-  lt as RedoIcon,
+  Ie as MoveLeftIcon,
+  De as MoveRightIcon,
+  nt as PlusCircleIcon,
+  dt as RedoIcon,
   Fs as RenameIcon,
   at as SettingsIcon,
   Mt as SpinnerComponent,
-  $t as Stack,
+  It as Stack,
   Qs as TabletSmartphoneIcon,
   Js as TargetIcon,
-  Ke as TextField,
-  rt as TimerResetIcon,
-  it as UndoIcon,
+  We as TextField,
+  it as TimerResetIcon,
+  lt as UndoIcon,
   Me as WidgetContainerColumn,
   io as WidgetContainerLarge,
-  ro as WidgetContainerRow,
+  ao as WidgetContainerRow,
   lo as WidgetsCatalogFlyout,
   to as WrapperColumnContent,
   so as WrapperColumnContentListItem,
-  De as XCircleIcon,
+  Be as XCircleIcon,
   Gs as ZoomInIcon,
   Zs as ZoomOutIcon,
   oo as showToast,
-  Hs as useDashboardStore,
-  Vs as useDashboardUndoService,
-  Q as useWidgetEmits
+  Vs as useDashboardStore,
+  Rs as useDashboardUndoService,
+  Y as useWidgetEmits
 };