@kong-ui-public/dashboard-renderer 7.6.8 → 7.6.10

package/dist/{index-B20-hQXl.js → index-Dvjj5Eg5.js}

@@ -3,33 +3,33 @@ var _t = (d) => {
   throw TypeError(d);
 };
 var li = (d, e, t) => e in d ? ai(d, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[e] = t;
-var bt = (d, e, t) => li(d, typeof e != "symbol" ? e + "" : e, t), it = (d, e, t) => e.has(d) || _t("Cannot " + t);
-var _ = (d, e, t) => (it(d, e, "read from private field"), t ? t.call(d) : e.get(d)), B = (d, e, t) => e.has(d) ? _t("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(d) : e.set(d, t), I = (d, e, t, i) => (it(d, e, "write to private field"), i ? i.call(d, t) : e.set(d, t), t), U = (d, e, t) => (it(d, e, "access private method"), t);
+var bt = (d, e, t) => li(d, typeof e != "symbol" ? e + "" : e, t), st = (d, e, t) => e.has(d) || _t("Cannot " + t);
+var _ = (d, e, t) => (st(d, e, "read from private field"), t ? t.call(d) : e.get(d)), F = (d, e, t) => e.has(d) ? _t("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(d) : e.set(d, t), O = (d, e, t, i) => (st(d, e, "write to private field"), i ? i.call(d, t) : e.set(d, t), t), G = (d, e, t) => (st(d, e, "access private method"), t);
 var ze = (d, e, t, i) => ({
   set _(s) {
-    I(d, e, s, t);
+    O(d, e, s, t);
   },
   get _() {
     return _(d, e, i);
   }
 });
-import { ref as A, watchEffect as Mt, inject as ye, provide as hi, onMounted as at, computed as z, watch as Qe, onUnmounted as lt, defineComponent as ee, resolveComponent as me, createBlock as q, renderSlot as De, createCommentVNode as Y, unref as x, openBlock as C, withCtx as F, createVNode as ae, createTextVNode as Se, toDisplayString as ne, useCssVars as Ye, createElementVNode as ce, normalizeClass as je, mergeProps as It, createSlots as ht, createElementBlock as Q, normalizeProps as ui, guardReactiveProps as di, defineAsyncComponent as qt, readonly as st, toRef as wt, nextTick as ut, resolveDynamicComponent as Pt, toHandlers as ci, Fragment as $t, renderList as Ft, normalizeStyle as Et, mergeModels as xt, useModel as fi, getCurrentInstance as gi } from "vue";
-import { msToGranularity as rt, getFieldDataSources as Gt, stripUnknownFilters as mi, Timeframe as pi, TimePeriods as Bt, TIMEFRAME_LOOKUP as yi, formatTime as Ct, EXPORT_RECORD_LIMIT as vi } from "@kong-ui-public/analytics-utilities";
-import { SimpleChart as _i, AnalyticsChart as bi, TopNTable as wi, CsvExportModal as Ei } from "@kong-ui-public/analytics-chart";
-import xi from "swrv";
+import { ref as N, watchEffect as Mt, inject as ye, provide as hi, onMounted as lt, computed as T, watch as Ve, onUnmounted as ht, defineComponent as J, resolveComponent as me, createBlock as M, renderSlot as Se, createCommentVNode as Q, unref as x, openBlock as C, withCtx as q, createVNode as le, createTextVNode as Qe, toDisplayString as ne, createSlots as Ye, createElementVNode as oe, useCssVars as je, normalizeClass as Xe, mergeProps as It, createElementBlock as V, normalizeProps as ui, guardReactiveProps as di, defineAsyncComponent as qt, readonly as rt, toRef as wt, nextTick as ut, resolveDynamicComponent as Pt, toHandlers as ci, Fragment as $t, renderList as Ft, normalizeStyle as Et, mergeModels as xt, useModel as fi, getCurrentInstance as gi } from "vue";
+import { msToGranularity as nt, getFieldDataSources as Gt, stripUnknownFilters as mi, Timeframe as pi, TimePeriods as Bt, TIMEFRAME_LOOKUP as yi, formatTime as Ct, EXPORT_RECORD_LIMIT as vi } from "@kong-ui-public/analytics-utilities";
+import { handleQueryError as _i, SimpleChart as bi, AnalyticsChart as wi, TopNTable as Ei, CsvExportModal as xi } from "@kong-ui-public/analytics-chart";
+import Ci from "swrv";
 import "axios";
-import { createI18n as Ci, i18nTComponent as Ri } from "@kong-ui-public/i18n";
+import { createI18n as Ri, i18nTComponent as ki } from "@kong-ui-public/i18n";
 import { useAnalyticsConfigStore as dt } from "@kong-ui-public/analytics-config-store";
-import { VisibilityOffIcon as ki, WarningIcon as Ti, EditIcon as zi, MoreIcon as Di } from "@kong/icons";
-import { MetricsProvider as Si, MetricsConsumer as Ni } from "@kong-ui-public/analytics-metric-provider";
+import { VisibilityOffIcon as Ti, WarningIcon as zi, EditIcon as Si, MoreIcon as Di } from "@kong/icons";
+import { MetricsProvider as Ni, MetricsConsumer as Li } from "@kong-ui-public/analytics-metric-provider";
 var Ut = /* @__PURE__ */ ((d) => (d.VALIDATING = "VALIDATING", d.VALIDATING_HAS_DATA = "VALIDATING_HAS_DATA", d.PENDING = "PENDING", d.SUCCESS = "SUCCESS", d.SUCCESS_HAS_DATA = "SUCCESS_HAS_DATA", d.ERROR = "ERROR", d.STALE_IF_ERROR = "STALE_IF_ERROR", d))(Ut || {});
-const Li = (d) => {
+const Ai = (d) => {
   var e, t, i, s, r;
   return d ? !!// TODO: revisit: currently only the first check ever matters?
   ((e = Object.keys(d)) != null && e.length || (t = d.data) != null && t.length || (s = (i = d.data) == null ? void 0 : i.data) != null && s.length || !((r = d.data) != null && r.data) && typeof d.data == "object" && Object.keys(d == null ? void 0 : d.data).length) : !1;
 };
-function Ai(d = A({}), e, t, i = Li) {
-  const s = A(
+function Hi(d = N({}), e, t, i = Ai) {
+  const s = N(
     "PENDING"
     /* PENDING */
   );
@@ -65,7 +65,7 @@ function Ai(d = A({}), e, t, i = Li) {
     swrvState: Ut
   };
 }
-const Hi = {
+const Oi = {
   noQueryBridge: "No query bridge provided.  Unable to render dashboard.",
   trendRange: {
     "24h": "Last 24-hour summary",
@@ -78,10 +78,6 @@ const Hi = {
   fullscreen: "Fullscreen",
   remove: "Remove",
   delete: "Delete"
-}, Oi = {
-  forbidden: "To access this data, either filter for an entity you have access to or request analytics viewer access from your administrator.",
-  timeRangeExceeded: "The time range for this report is outside of your organization's data retention period",
-  timeout: "Query timed out.  Consider querying a shorter time range."
 }, Mi = {
   defaultFilename: "Chart export",
   exportAsCsv: "Export as CSV"
@@ -99,8 +95,7 @@ const Hi = {
   weekly: "1 week",
   unknown: "Unknown"
 }, Fi = {
-  renderer: Hi,
-  queryDataProvider: Oi,
+  renderer: Oi,
   csvExport: Mi,
   jumpToExplore: Ii,
   jumpToRequests: qi,
@@ -108,14 +103,14 @@ const Hi = {
   granularities: $i
 };
 function Gi() {
-  const d = Ci("en-us", Fi);
+  const d = Ri("en-us", Fi);
   return {
     i18n: d,
-    i18nT: Ri(d)
+    i18nT: ki(d)
     // Translation component <i18n-t>
   };
 }
-const Xe = 170, Wt = 6, pe = "analytics-query-provider", Rt = "{entity-id}", Bi = "{cp-id}", Ui = "{timeframe}", Wi = 30 * 1e3, Ki = 3e5, Vi = 36e5;
+const Ze = 170, Wt = 6, pe = "analytics-query-provider", Rt = "{entity-id}", Bi = "{cp-id}", Ui = "{timeframe}", Wi = 30 * 1e3, Ki = 3e5, Vi = 36e5;
 function Qi() {
   const d = ye(pe);
   return {
@@ -163,9 +158,9 @@ var Kt = { exports: {} };
     var u = t ? t + h : h, a = this._events[u];
     return a ? a.fn ? 1 : a.length : 0;
   }, n.prototype.emit = function(h, u, a, f, m, g) {
-    var v = t ? t + h : h;
-    if (!this._events[v]) return !1;
-    var p = this._events[v], S = arguments.length, L, R;
+    var y = t ? t + h : h;
+    if (!this._events[y]) return !1;
+    var p = this._events[y], S = arguments.length, I, R;
     if (p.fn) {
       switch (p.once && this.removeListener(h, p.fn, void 0, !0), S) {
         case 1:
@@ -181,12 +176,12 @@ var Kt = { exports: {} };
         case 6:
           return p.fn.call(p.context, u, a, f, m, g), !0;
       }
-      for (R = 1, L = new Array(S - 1); R < S; R++)
-        L[R - 1] = arguments[R];
-      p.fn.apply(p.context, L);
+      for (R = 1, I = new Array(S - 1); R < S; R++)
+        I[R - 1] = arguments[R];
+      p.fn.apply(p.context, I);
     } else {
-      var k = p.length, G;
-      for (R = 0; R < k; R++)
+      var ee = p.length, B;
+      for (R = 0; R < ee; R++)
         switch (p[R].once && this.removeListener(h, p[R].fn, void 0, !0), S) {
           case 1:
             p[R].fn.call(p[R].context);
@@ -201,9 +196,9 @@ var Kt = { exports: {} };
             p[R].fn.call(p[R].context, u, a, f);
             break;
           default:
-            if (!L) for (G = 1, L = new Array(S - 1); G < S; G++)
-              L[G - 1] = arguments[G];
-            p[R].fn.apply(p[R].context, L);
+            if (!I) for (B = 1, I = new Array(S - 1); B < S; B++)
+              I[B - 1] = arguments[B];
+            p[R].fn.apply(p[R].context, I);
         }
     }
     return !0;
@@ -220,8 +215,8 @@ var Kt = { exports: {} };
     if (g.fn)
       g.fn === u && (!f || g.once) && (!a || g.context === a) && o(this, m);
     else {
-      for (var v = 0, p = [], S = g.length; v < S; v++)
-        (g[v].fn !== u || f && !g[v].once || a && g[v].context !== a) && p.push(g[v]);
+      for (var y = 0, p = [], S = g.length; y < S; y++)
+        (g[y].fn !== u || f && !g[y].once || a && g[y].context !== a) && p.push(g[y]);
       p.length ? this._events[m] = p.length === 1 ? p[0] : p : o(this, m);
     }
     return this;
@@ -304,7 +299,7 @@ function es(d, e, t) {
 var ie;
 class ts {
   constructor() {
-    B(this, ie, []);
+    F(this, ie, []);
   }
   enqueue(e, t) {
     t = {
@@ -342,30 +337,30 @@ class ts {
   }
 }
 ie = new WeakMap();
-var we, Ee, ge, Ae, xe, He, se, Ce, V, Oe, re, Re, de, Me, Ve, D, Qt, Yt, jt, Xt, Zt, Pe, nt, ot, $e, Jt, Fe;
+var we, Ee, ge, Le, xe, Ae, se, Ce, K, He, re, Re, de, Oe, Ke, z, Qt, Yt, jt, Xt, Zt, qe, ot, at, Pe, Jt, $e;
 class is extends Xi {
   // TODO: The `throwOnTimeout` option should affect the return types of `add()` and `addAll()`
   constructor(t) {
     var i, s;
     super();
-    B(this, D);
-    B(this, we);
-    B(this, Ee);
-    B(this, ge, 0);
-    B(this, Ae);
-    B(this, xe);
-    B(this, He, 0);
-    B(this, se);
-    B(this, Ce);
-    B(this, V);
-    B(this, Oe);
-    B(this, re, 0);
+    F(this, z);
+    F(this, we);
+    F(this, Ee);
+    F(this, ge, 0);
+    F(this, Le);
+    F(this, xe);
+    F(this, Ae, 0);
+    F(this, se);
+    F(this, Ce);
+    F(this, K);
+    F(this, He);
+    F(this, re, 0);
     // The `!` is needed because of https://github.com/microsoft/TypeScript/issues/32194
-    B(this, Re);
-    B(this, de);
-    B(this, Me);
+    F(this, Re);
+    F(this, de);
+    F(this, Oe);
     // Use to assign a unique identifier to a promise function, if not explicitly specified
-    B(this, Ve, 1n);
+    F(this, Ke, 1n);
     /**
         Per-operation timeout in milliseconds. Operations fulfill once `timeout` elapses if they haven't already.
     
@@ -384,7 +379,7 @@ class is extends Xi {
       throw new TypeError(`Expected \`intervalCap\` to be a number from 1 and up, got \`${((i = t.intervalCap) == null ? void 0 : i.toString()) ?? ""}\` (${typeof t.intervalCap})`);
     if (t.interval === void 0 || !(Number.isFinite(t.interval) && t.interval >= 0))
       throw new TypeError(`Expected \`interval\` to be a finite number >= 0, got \`${((s = t.interval) == null ? void 0 : s.toString()) ?? ""}\` (${typeof t.interval})`);
-    I(this, we, t.carryoverConcurrencyCount), I(this, Ee, t.intervalCap === Number.POSITIVE_INFINITY || t.interval === 0), I(this, Ae, t.intervalCap), I(this, xe, t.interval), I(this, V, new t.queueClass()), I(this, Oe, t.queueClass), this.concurrency = t.concurrency, this.timeout = t.timeout, I(this, Me, t.throwOnTimeout === !0), I(this, de, t.autoStart === !1);
+    O(this, we, t.carryoverConcurrencyCount), O(this, Ee, t.intervalCap === Number.POSITIVE_INFINITY || t.interval === 0), O(this, Le, t.intervalCap), O(this, xe, t.interval), O(this, K, new t.queueClass()), O(this, He, t.queueClass), this.concurrency = t.concurrency, this.timeout = t.timeout, O(this, Oe, t.throwOnTimeout === !0), O(this, de, t.autoStart === !1);
   }
   get concurrency() {
     return _(this, Re);
@@ -392,7 +387,7 @@ class is extends Xi {
   set concurrency(t) {
     if (!(typeof t == "number" && t >= 1))
       throw new TypeError(`Expected \`concurrency\` to be a number from 1 and up, got \`${t}\` (${typeof t})`);
-    I(this, Re, t), U(this, D, $e).call(this);
+    O(this, Re, t), G(this, z, Pe).call(this);
   }
   /**
       Updates the priority of a promise function by its id, affecting its execution order. Requires a defined concurrency limit to take effect.
@@ -431,21 +426,21 @@ class is extends Xi {
       Here, the promise function with `id: '🦀'` executes last.
       */
   setPriority(t, i) {
-    _(this, V).setPriority(t, i);
+    _(this, K).setPriority(t, i);
   }
   async add(t, i = {}) {
-    return i.id ?? (i.id = (ze(this, Ve)._++).toString()), i = {
+    return i.id ?? (i.id = (ze(this, Ke)._++).toString()), i = {
       timeout: this.timeout,
-      throwOnTimeout: _(this, Me),
+      throwOnTimeout: _(this, Oe),
       ...i
     }, new Promise((s, r) => {
-      _(this, V).enqueue(async () => {
+      _(this, K).enqueue(async () => {
         var o;
         ze(this, re)._++, ze(this, ge)._++;
         try {
           (o = i.signal) == null || o.throwIfAborted();
           let n = t({ signal: i.signal });
-          i.timeout && (n = Ji(Promise.resolve(n), { milliseconds: i.timeout })), i.signal && (n = Promise.race([n, U(this, D, Jt).call(this, i.signal)]));
+          i.timeout && (n = Ji(Promise.resolve(n), { milliseconds: i.timeout })), i.signal && (n = Promise.race([n, G(this, z, Jt).call(this, i.signal)]));
           const l = await n;
           s(l), this.emit("completed", l);
         } catch (n) {
@@ -455,9 +450,9 @@ class is extends Xi {
           }
           r(n), this.emit("error", n);
         } finally {
-          U(this, D, jt).call(this);
+          G(this, z, jt).call(this);
         }
-      }, i), this.emit("add"), U(this, D, Pe).call(this);
+      }, i), this.emit("add"), G(this, z, qe).call(this);
     });
   }
   async addAll(t, i) {
@@ -467,19 +462,19 @@ class is extends Xi {
   Start (or resume) executing enqueued tasks within concurrency limit. No need to call this if queue is not paused (via `options.autoStart = false` or by `.pause()` method.)
   */
   start() {
-    return _(this, de) ? (I(this, de, !1), U(this, D, $e).call(this), this) : this;
+    return _(this, de) ? (O(this, de, !1), G(this, z, Pe).call(this), this) : this;
   }
   /**
   Put queue execution on hold.
   */
   pause() {
-    I(this, de, !0);
+    O(this, de, !0);
   }
   /**
   Clear the queue.
   */
   clear() {
-    I(this, V, new (_(this, Oe))());
+    O(this, K, new (_(this, He))());
   }
   /**
       Can be called multiple times. Useful if you for example add additional items at a later time.
@@ -487,7 +482,7 @@ class is extends Xi {
       @returns A promise that settles when the queue becomes empty.
       */
   async onEmpty() {
-    _(this, V).size !== 0 && await U(this, D, Fe).call(this, "empty");
+    _(this, K).size !== 0 && await G(this, z, $e).call(this, "empty");
   }
   /**
       @returns A promise that settles when the queue size is less than the given limit: `queue.size < limit`.
@@ -497,7 +492,7 @@ class is extends Xi {
       Note that this only limits the number of items waiting to start. There could still be up to `concurrency` jobs already running that this call does not include in its calculation.
       */
   async onSizeLessThan(t) {
-    _(this, V).size < t || await U(this, D, Fe).call(this, "next", () => _(this, V).size < t);
+    _(this, K).size < t || await G(this, z, $e).call(this, "next", () => _(this, K).size < t);
   }
   /**
       The difference with `.onEmpty` is that `.onIdle` guarantees that all work from the queue has finished. `.onEmpty` merely signals that the queue is empty, but it could mean that some promises haven't completed yet.
@@ -505,13 +500,13 @@ class is extends Xi {
       @returns A promise that settles when the queue becomes empty, and all promises have completed; `queue.size === 0 && queue.pending === 0`.
       */
   async onIdle() {
-    _(this, re) === 0 && _(this, V).size === 0 || await U(this, D, Fe).call(this, "idle");
+    _(this, re) === 0 && _(this, K).size === 0 || await G(this, z, $e).call(this, "idle");
   }
   /**
   Size of the queue, the number of queued items waiting to run.
   */
   get size() {
-    return _(this, V).size;
+    return _(this, K).size;
   }
   /**
       Size of the queue, filtered by the given options.
@@ -519,7 +514,7 @@ class is extends Xi {
       For example, this can be used to find the number of items remaining in the queue with a specific priority level.
       */
   sizeBy(t) {
-    return _(this, V).filter(t).length;
+    return _(this, K).filter(t).length;
   }
   /**
   Number of running items (no longer in the queue).
@@ -534,48 +529,48 @@ class is extends Xi {
     return _(this, de);
   }
 }
-we = new WeakMap(), Ee = new WeakMap(), ge = new WeakMap(), Ae = new WeakMap(), xe = new WeakMap(), He = new WeakMap(), se = new WeakMap(), Ce = new WeakMap(), V = new WeakMap(), Oe = new WeakMap(), re = new WeakMap(), Re = new WeakMap(), de = new WeakMap(), Me = new WeakMap(), Ve = new WeakMap(), D = new WeakSet(), Qt = function() {
-  return _(this, Ee) || _(this, ge) < _(this, Ae);
+we = new WeakMap(), Ee = new WeakMap(), ge = new WeakMap(), Le = new WeakMap(), xe = new WeakMap(), Ae = new WeakMap(), se = new WeakMap(), Ce = new WeakMap(), K = new WeakMap(), He = new WeakMap(), re = new WeakMap(), Re = new WeakMap(), de = new WeakMap(), Oe = new WeakMap(), Ke = new WeakMap(), z = new WeakSet(), Qt = function() {
+  return _(this, Ee) || _(this, ge) < _(this, Le);
 }, Yt = function() {
   return _(this, re) < _(this, Re);
 }, jt = function() {
-  ze(this, re)._--, U(this, D, Pe).call(this), this.emit("next");
+  ze(this, re)._--, G(this, z, qe).call(this), this.emit("next");
 }, Xt = function() {
-  U(this, D, ot).call(this), U(this, D, nt).call(this), I(this, Ce, void 0);
+  G(this, z, at).call(this), G(this, z, ot).call(this), O(this, Ce, void 0);
 }, Zt = function() {
   const t = Date.now();
   if (_(this, se) === void 0) {
-    const i = _(this, He) - t;
+    const i = _(this, Ae) - t;
     if (i < 0)
-      I(this, ge, _(this, we) ? _(this, re) : 0);
+      O(this, ge, _(this, we) ? _(this, re) : 0);
     else
-      return _(this, Ce) === void 0 && I(this, Ce, setTimeout(() => {
-        U(this, D, Xt).call(this);
+      return _(this, Ce) === void 0 && O(this, Ce, setTimeout(() => {
+        G(this, z, Xt).call(this);
       }, i)), !0;
   }
   return !1;
-}, Pe = function() {
-  if (_(this, V).size === 0)
-    return _(this, se) && clearInterval(_(this, se)), I(this, se, void 0), this.emit("empty"), _(this, re) === 0 && this.emit("idle"), !1;
+}, qe = function() {
+  if (_(this, K).size === 0)
+    return _(this, se) && clearInterval(_(this, se)), O(this, se, void 0), this.emit("empty"), _(this, re) === 0 && this.emit("idle"), !1;
   if (!_(this, de)) {
-    const t = !_(this, D, Zt);
-    if (_(this, D, Qt) && _(this, D, Yt)) {
-      const i = _(this, V).dequeue();
-      return i ? (this.emit("active"), i(), t && U(this, D, nt).call(this), !0) : !1;
+    const t = !_(this, z, Zt);
+    if (_(this, z, Qt) && _(this, z, Yt)) {
+      const i = _(this, K).dequeue();
+      return i ? (this.emit("active"), i(), t && G(this, z, ot).call(this), !0) : !1;
     }
   }
   return !1;
-}, nt = function() {
-  _(this, Ee) || _(this, se) !== void 0 || (I(this, se, setInterval(() => {
-    U(this, D, ot).call(this);
-  }, _(this, xe))), I(this, He, Date.now() + _(this, xe)));
 }, ot = function() {
-  _(this, ge) === 0 && _(this, re) === 0 && _(this, se) && (clearInterval(_(this, se)), I(this, se, void 0)), I(this, ge, _(this, we) ? _(this, re) : 0), U(this, D, $e).call(this);
+  _(this, Ee) || _(this, se) !== void 0 || (O(this, se, setInterval(() => {
+    G(this, z, at).call(this);
+  }, _(this, xe))), O(this, Ae, Date.now() + _(this, xe)));
+}, at = function() {
+  _(this, ge) === 0 && _(this, re) === 0 && _(this, se) && (clearInterval(_(this, se)), O(this, se, void 0)), O(this, ge, _(this, we) ? _(this, re) : 0), G(this, z, Pe).call(this);
 }, /**
 Executes all queued functions until it reaches the limit.
 */
-$e = function() {
-  for (; U(this, D, Pe).call(this); )
+Pe = function() {
+  for (; G(this, z, qe).call(this); )
     ;
 }, Jt = async function(t) {
   return new Promise((i, s) => {
@@ -583,7 +578,7 @@ $e = function() {
       s(t.reason);
     }, { once: !0 });
   });
-}, Fe = async function(t, i) {
+}, $e = async function(t, i) {
   return new Promise((s) => {
     const r = () => {
       i && !i() || (this.off(t, r), s());
@@ -617,72 +612,72 @@ function rs({
   definition: t,
   chartData: i
 }) {
-  const { evaluateFeatureFlag: s } = ue.useEvaluateFeatureFlag(), r = A(""), o = A(""), n = A(void 0), l = A(void 0), h = s("analytics-chart-zoom-actions", !0), u = dt();
-  at(async () => {
-    var T, H;
-    r.value = await ((T = d == null ? void 0 : d.exploreBaseUrl) == null ? void 0 : T.call(d)) ?? "", o.value = await ((H = d == null ? void 0 : d.requestsBaseUrl) == null ? void 0 : H.call(d)) ?? "";
+  const { evaluateFeatureFlag: s } = ce.useEvaluateFeatureFlag(), r = N(""), o = N(""), n = N(void 0), l = N(void 0), h = s("analytics-chart-zoom-actions", !0), u = dt();
+  lt(async () => {
+    var k, L;
+    r.value = await ((k = d == null ? void 0 : d.exploreBaseUrl) == null ? void 0 : k.call(d)) ?? "", o.value = await ((L = d == null ? void 0 : d.requestsBaseUrl) == null ? void 0 : L.call(d)) ?? "";
   });
-  const a = z(() => u.analytics && u.percentiles), f = z(() => !["golden_signals", "top_n", "gauge"].includes(t.value.chart.type)), m = z(() => h && o.value && t.value.query && t.value.query.datasource !== "llm_usage" && a.value), g = z(() => r.value && t.value.query && ["basic", "api_usage", "llm_usage", void 0].includes(t.value.query.datasource) && a.value), v = z(() => i.value ? rt(i.value.meta.granularity_ms) : void 0), p = z(() => {
-    var j;
-    const T = [...e.value.filters, ...t.value.query.filters ?? []], H = ((j = t.value.query) == null ? void 0 : j.datasource) ?? "api_usage";
-    return T.filter((W) => Gt(W.field).some((E) => H === E));
-  }), S = z(() => {
+  const a = T(() => u.analytics && u.percentiles), f = T(() => !["golden_signals", "top_n", "gauge"].includes(t.value.chart.type)), m = T(() => h && o.value && t.value.query && t.value.query.datasource !== "llm_usage" && a.value), g = T(() => r.value && t.value.query && ["basic", "api_usage", "llm_usage", void 0].includes(t.value.query.datasource) && a.value), y = T(() => i.value ? nt(i.value.meta.granularity_ms) : void 0), p = T(() => {
+    var Y;
+    const k = [...e.value.filters, ...t.value.query.filters ?? []], L = ((Y = t.value.query) == null ? void 0 : Y.datasource) ?? "api_usage";
+    return k.filter((U) => Gt(U.field).some((E) => L === E));
+  }), S = T(() => {
     if (!g.value || !f.value)
       return "";
-    const T = p.value, H = t.value.query.time_range || e.value.timeSpec, j = _e(H, T);
-    return be(j);
-  }), L = z(() => {
+    const k = p.value, L = t.value.query.time_range || e.value.timeSpec, Y = _e(L, k);
+    return be(Y);
+  }), I = T(() => {
     if (!m.value || !f.value)
       return "";
-    const T = p.value, H = k(
+    const k = p.value, L = ee(
       t.value.query.time_range || e.value.timeSpec,
-      T
+      k
     );
-    return R(H);
-  }), R = (T) => m.value ? `${o.value}?q=${JSON.stringify(T)}` : "", k = (T, H) => {
-    var j, W;
+    return R(L);
+  }), R = (k) => m.value ? `${o.value}?q=${JSON.stringify(k)}` : "", ee = (k, L) => {
+    var Y, U;
     return {
-      filter: H,
+      filter: L,
       timeframe: {
-        timePeriodsKey: T.type === "relative" ? T.time_range : "custom",
-        start: T.type === "absolute" ? (j = i.value) == null ? void 0 : j.meta.start_ms : void 0,
-        end: T.type === "absolute" ? (W = i.value) == null ? void 0 : W.meta.end_ms : void 0
+        timePeriodsKey: k.type === "relative" ? k.time_range : "custom",
+        start: k.type === "absolute" ? (Y = i.value) == null ? void 0 : Y.meta.start_ms : void 0,
+        end: k.type === "absolute" ? (U = i.value) == null ? void 0 : U.meta.end_ms : void 0
       }
     };
-  }, G = (T, H) => ({
-    filter: H,
+  }, B = (k, L) => ({
+    filter: L,
     timeframe: {
-      timePeriodsKey: T.type === "relative" ? T.time_range : "custom",
-      start: T.type === "absolute" ? T.start : void 0,
-      end: T.type === "absolute" ? T.end : void 0
+      timePeriodsKey: k.type === "relative" ? k.time_range : "custom",
+      start: k.type === "absolute" ? k.start : void 0,
+      end: k.type === "absolute" ? k.end : void 0
     }
-  }), _e = (T, H) => {
-    const j = t.value.query.dimensions ?? [];
+  }), _e = (k, L) => {
+    const Y = t.value.query.dimensions ?? [];
     return {
-      filters: H,
+      filters: L,
       metrics: t.value.query.metrics ?? [],
-      dimensions: j,
-      time_range: T,
-      granularity: t.value.query.granularity || v.value
+      dimensions: Y,
+      time_range: k,
+      granularity: t.value.query.granularity || y.value
     };
-  }, be = (T) => {
+  }, be = (k) => {
     if (!g.value)
       return "";
-    const H = ["api_usage", "llm_usage"].includes(t.value.query.datasource) ? t.value.query.datasource : "api_usage";
-    return `${r.value}?q=${JSON.stringify(T)}&d=${H}&c=${t.value.chart.type}`;
+    const L = ["api_usage", "llm_usage"].includes(t.value.query.datasource) ? t.value.query.datasource : "api_usage";
+    return `${r.value}?q=${JSON.stringify(k)}&d=${L}&c=${t.value.chart.type}`;
   };
-  return Qe([m, g], ([T, H]) => {
-    T && (n.value = { href: "" }), H && (l.value = { href: "" });
+  return Ve([m, g], ([k, L]) => {
+    k && (n.value = { href: "" }), L && (l.value = { href: "" });
   }), {
     exploreLinkKebabMenu: S,
-    requestsLinkKebabMenu: L,
+    requestsLinkKebabMenu: I,
     canShowKebabMenu: f,
     canGenerateRequestsLink: m,
     canGenerateExploreLink: g,
     requestsLinkZoomActions: n,
     exploreLinkZoomActions: l,
     buildExploreQuery: _e,
-    buildRequestsQueryZoomActions: G,
+    buildRequestsQueryZoomActions: B,
     buildExploreLink: be,
     buildRequestLink: R
   };
@@ -693,7 +688,7 @@ const ns = (d, e, t) => {
 };
 function os() {
   const d = ye(pe), e = new AbortController();
-  return lt(() => {
+  return ht(() => {
     e.abort();
   }), { issueQuery: async (i, s, r) => {
     if (!d)
@@ -723,13 +718,13 @@ function os() {
     return d.queryFn(f, e);
   } };
 }
-const ue = {
+const ce = {
   useContextLinks: rs,
   useEvaluateFeatureFlag: Qi,
   useI18n: Gi,
   useIssueQuery: os,
   useRequestQueue: ss
-}, ct = /* @__PURE__ */ ee({
+}, ct = /* @__PURE__ */ J({
   __name: "QueryDataProvider",
   props: {
     context: {},
@@ -739,25 +734,12 @@ const ue = {
   },
   emits: ["chart-data", "queryComplete"],
   setup(d, { emit: e }) {
-    const t = d, i = e, { i18n: s } = ue.useI18n(), { issueQuery: r } = ue.useIssueQuery(), o = ye(pe), n = () => t.queryReady && o ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, { data: l, error: h, isValidating: u } = xi(n, async () => {
-      var p, S, L, R;
+    const t = d, i = e, { issueQuery: s } = ce.useIssueQuery(), r = ye(pe), o = () => t.queryReady && r ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, { data: n, error: l, isValidating: h } = Ci(o, async () => {
       try {
-        const k = await r(t.query, t.context);
-        return m.value = null, k;
-      } catch (k) {
-        throw (k == null ? void 0 : k.status) === 403 ? m.value = {
-          message: s.t("queryDataProvider.forbidden"),
-          type: "forbidden"
-        } : (k == null ? void 0 : k.status) === 408 ? m.value = {
-          message: s.t("queryDataProvider.timeout"),
-          type: "timeout"
-        } : ((S = (p = k == null ? void 0 : k.response) == null ? void 0 : p.data) == null ? void 0 : S.message) === "Range not allowed for this tier" ? m.value = {
-          message: s.t("queryDataProvider.timeRangeExceeded"),
-          type: "range_exceeded"
-        } : m.value = {
-          message: ((R = (L = k == null ? void 0 : k.response) == null ? void 0 : L.data) == null ? void 0 : R.message) || (k == null ? void 0 : k.message),
-          type: "other"
-        }, k;
+        const y = await s(t.query, t.context);
+        return f.value = null, y;
+      } catch (y) {
+        throw f.value = _i(y), y;
       } finally {
         i("queryComplete");
       }
@@ -765,48 +747,53 @@ const ue = {
       refreshInterval: t.context.refreshInterval,
       revalidateOnFocus: !1,
       shouldRetryOnError: !1
-    }), { state: a, swrvState: f } = Ai(l, h, u), m = A(null), g = z(() => a.value === f.ERROR || !!m.value), v = z(() => !t.queryReady || a.value === f.PENDING);
-    return Qe(l, (p) => {
-      p && i("chart-data", p);
-    }), (p, S) => {
-      var k;
-      const L = me("KSkeleton"), R = me("KEmptyState");
-      return v.value || !x(l) && !g.value ? (C(), q(L, {
+    }), { state: u, swrvState: a } = Hi(n, l, h), f = N(null), m = T(() => u.value === a.ERROR || !!f.value), g = T(() => !t.queryReady || u.value === a.PENDING);
+    return Ve(n, (y) => {
+      y && i("chart-data", y);
+    }), (y, p) => {
+      var R;
+      const S = me("KSkeleton"), I = me("KEmptyState");
+      return g.value || !x(n) && !m.value ? (C(), M(S, {
         key: 0,
         class: "chart-skeleton",
         type: "table"
-      })) : g.value && ((k = m.value) == null ? void 0 : k.type) === "forbidden" ? (C(), q(R, {
+      })) : m.value && ((R = f.value) == null ? void 0 : R.type) === "forbidden" ? (C(), M(I, {
         key: 1,
         "action-button-visible": !1,
         "data-testid": "chart-forbidden-state"
       }, {
-        default: F(() => [
-          Se(ne(m.value.message), 1)
+        default: q(() => [
+          Qe(ne(f.value.message), 1)
         ]),
-        icon: F(() => [
-          ae(x(ki))
+        icon: q(() => [
+          le(x(Ti))
         ]),
         _: 1
-      })) : g.value ? (C(), q(R, {
+      })) : m.value && f.value ? (C(), M(I, {
         key: 2,
         "action-button-visible": !1,
         "data-testid": "chart-empty-state",
         "icon-variant": "error"
-      }, {
-        default: F(() => {
-          var G;
-          return [
-            Se(ne((G = m.value) == null ? void 0 : G.message), 1)
-          ];
-        }),
-        _: 1
-      })) : x(l) ? De(p.$slots, "default", {
+      }, Ye({
+        title: q(() => [
+          oe("p", null, ne(f.value.message), 1)
+        ]),
+        _: 2
+      }, [
+        f.value.details ? {
+          name: "default",
+          fn: q(() => [
+            oe("p", null, ne(f.value.details), 1)
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1024)) : x(n) ? Se(y.$slots, "default", {
         key: 3,
-        data: x(l)
-      }) : Y("", !0);
+        data: x(n)
+      }) : Q("", !0);
     };
   }
-}), as = /* @__PURE__ */ ee({
+}), as = /* @__PURE__ */ J({
   __name: "SimpleChartRenderer",
   props: {
     query: {},
@@ -819,21 +806,21 @@ const ue = {
     exploreLink: {}
   },
   setup(d) {
-    Ye((i) => ({
+    je((i) => ({
       "088169ae": `${i.height}px`
     }));
-    const e = d, t = z(() => e.chartOptions.type === "single_value");
-    return (i, s) => (C(), q(ct, {
+    const e = d, t = T(() => e.chartOptions.type === "single_value");
+    return (i, s) => (C(), M(ct, {
       context: i.context,
       query: i.query,
       "query-ready": i.queryReady,
       "refresh-counter": i.refreshCounter
     }, {
-      default: F(({ data: r }) => [
-        ce("div", {
-          class: je(["analytics-chart", { "single-value": t.value }])
+      default: q(({ data: r }) => [
+        oe("div", {
+          class: Xe(["analytics-chart", { "single-value": t.value }])
         }, [
-          ae(x(_i), {
+          le(x(bi), {
             "chart-data": r,
             "chart-options": i.chartOptions,
             "synthetics-data-key": t.value ? void 0 : i.chartOptions.synthetics_data_key
@@ -848,7 +835,7 @@ const ue = {
   for (const [i, s] of e)
     t[i] = s;
   return t;
-}, zt = /* @__PURE__ */ ve(as, [["__scopeId", "data-v-1e9ff912"]]), ls = { class: "analytics-chart" }, hs = /* @__PURE__ */ ee({
+}, zt = /* @__PURE__ */ ve(as, [["__scopeId", "data-v-1e9ff912"]]), ls = { class: "analytics-chart" }, hs = /* @__PURE__ */ J({
   __name: "BaseAnalyticsChartRenderer",
   props: {
     query: {},
@@ -863,28 +850,28 @@ const ue = {
   },
   emits: ["edit-tile", "chart-data", "zoom-time-range", "view-requests", "select-chart-range"],
   setup(d, { emit: e }) {
-    const t = d, i = e, { i18n: s } = ue.useI18n(), { evaluateFeatureFlag: r } = ue.useEvaluateFeatureFlag(), o = r("ma-4135-allow-zooming-all-dashboard-tiles", !1), n = z(() => ({
+    const t = d, i = e, { i18n: s } = ce.useI18n(), { evaluateFeatureFlag: r } = ce.useEvaluateFeatureFlag(), o = r("ma-4135-allow-zooming-all-dashboard-tiles", !1), n = T(() => ({
       type: t.chartOptions.type,
       stacked: t.chartOptions.stacked ?? !1,
       chartDatasetColors: t.chartOptions.chart_dataset_colors,
       threshold: t.chartOptions.threshold
-    })), l = z(() => o ? t.context.zoomable : t.context.zoomable && !t.query.time_range), h = () => {
+    })), l = T(() => o ? t.context.zoomable : t.context.zoomable && !t.query.time_range), h = () => {
       i("edit-tile");
     }, u = (a) => {
       i("chart-data", a);
     };
     return (a, f) => {
       const m = me("KDropdownItem");
-      return C(), q(ct, {
+      return C(), M(ct, {
         context: a.context,
         query: a.query,
         "query-ready": a.queryReady,
         "refresh-counter": a.refreshCounter,
         onChartData: u
       }, {
-        default: F(({ data: g }) => [
-          ce("div", ls, [
-            ae(x(bi), It({
+        default: q(({ data: g }) => [
+          oe("div", ls, [
+            le(x(wi), It({
               "chart-data": g,
               "chart-options": n.value,
               "explore-link": a.exploreLink,
@@ -894,15 +881,15 @@ const ue = {
               "timeseries-zoom": l.value,
               "tooltip-title": ""
             }, a.extraProps, {
-              onSelectChartRange: f[0] || (f[0] = (v) => i("select-chart-range", v)),
-              onZoomTimeRange: f[1] || (f[1] = (v) => i("zoom-time-range", v))
-            }), ht({ _: 2 }, [
+              onSelectChartRange: f[0] || (f[0] = (y) => i("select-chart-range", y)),
+              onZoomTimeRange: f[1] || (f[1] = (y) => i("zoom-time-range", y))
+            }), Ye({ _: 2 }, [
               a.context.editable ? {
                 name: "menu-items",
-                fn: F(() => [
-                  ae(m, { onClick: h }, {
-                    default: F(() => [
-                      Se(ne(x(s).t("renderer.edit")), 1)
+                fn: q(() => [
+                  le(m, { onClick: h }, {
+                    default: q(() => [
+                      Qe(ne(x(s).t("renderer.edit")), 1)
                     ]),
                     _: 1
                   })
@@ -916,7 +903,7 @@ const ue = {
       }, 8, ["context", "query", "query-ready", "refresh-counter"]);
     };
   }
-}), ft = /* @__PURE__ */ ve(hs, [["__scopeId", "data-v-965790dd"]]), Dt = /* @__PURE__ */ ee({
+}), ft = /* @__PURE__ */ ve(hs, [["__scopeId", "data-v-965790dd"]]), St = /* @__PURE__ */ J({
   __name: "BarChartRenderer",
   props: {
     query: {},
@@ -929,7 +916,7 @@ const ue = {
     exploreLink: {}
   },
   setup(d) {
-    return (e, t) => (C(), q(ft, {
+    return (e, t) => (C(), M(ft, {
       "chart-options": e.chartOptions,
       context: e.context,
       "extra-props": { showAnnotations: !1 },
@@ -939,7 +926,7 @@ const ue = {
       "refresh-counter": e.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), St = /* @__PURE__ */ ee({
+}), Dt = /* @__PURE__ */ J({
   __name: "TimeseriesChartRenderer",
   props: {
     query: {},
@@ -954,7 +941,7 @@ const ue = {
   emits: ["zoom-time-range", "select-chart-range"],
   setup(d, { emit: e }) {
     const t = e;
-    return (i, s) => (C(), q(ft, {
+    return (i, s) => (C(), M(ft, {
       "chart-options": i.chartOptions,
       context: i.context,
       "explore-link": i.exploreLink,
@@ -967,7 +954,7 @@ const ue = {
       onZoomTimeRange: s[1] || (s[1] = (r) => t("zoom-time-range", r))
     }, null, 8, ["chart-options", "context", "explore-link", "height", "query", "query-ready", "refresh-counter", "requests-link"]));
   }
-}), us = { class: "metric-card-tile-wrapper" }, ds = /* @__PURE__ */ ee({
+}), us = { class: "metric-card-tile-wrapper" }, ds = /* @__PURE__ */ J({
   __name: "GoldenSignalsRenderer",
   props: {
     query: {},
@@ -980,7 +967,7 @@ const ue = {
     exploreLink: {}
   },
   setup(d) {
-    const e = d, t = z(() => {
+    const e = d, t = T(() => {
       const s = e.context.timeSpec;
       if (s.type === "absolute")
         return new pi({
@@ -999,7 +986,7 @@ const ue = {
       if (!r)
         throw new Error("Unknown time range");
       return r;
-    }), i = z(() => {
+    }), i = T(() => {
       var r, o;
       const s = (r = e.query) == null ? void 0 : r.datasource;
       if (s && s !== "api_usage" && s !== "basic")
@@ -1017,10 +1004,10 @@ const ue = {
         refreshCounter: e.refreshCounter
       };
     });
-    return (s, r) => (C(), Q("div", us, [
-      ae(x(Si), ui(di(i.value)), {
-        default: F(() => [
-          ae(x(Ni))
+    return (s, r) => (C(), V("div", us, [
+      le(x(Ni), ui(di(i.value)), {
+        default: q(() => [
+          le(x(Li))
         ]),
         _: 1
       }, 16)
@@ -1029,15 +1016,15 @@ const ue = {
 }), cs = /* @__PURE__ */ ve(ds, [["__scopeId", "data-v-7e1b1cc1"]]), Nt = "#6c7489", fs = "12px", Lt = "20px", ei = "20px", gs = {
   class: "fallback-entity-link",
   "data-testid": "entity-link-parent"
-}, At = /* @__PURE__ */ ee({
+}, At = /* @__PURE__ */ J({
   __name: "FallbackEntityLink",
   props: {
     entityLinkData: {}
   },
   setup(d) {
-    return (e, t) => (C(), Q("div", gs, ne(e.entityLinkData.label), 1));
+    return (e, t) => (C(), V("div", gs, ne(e.entityLinkData.label), 1));
   }
-}), ms = /* @__PURE__ */ ee({
+}), ms = /* @__PURE__ */ J({
   __name: "TopNTableRenderer",
   props: {
     query: {},
@@ -1068,21 +1055,21 @@ const ue = {
           return e.chartOptions.entity_link.replace(Rt, r.id);
       return "";
     };
-    return (r, o) => (C(), q(ct, {
+    return (r, o) => (C(), M(ct, {
       context: r.context,
       query: r.query,
       "query-ready": r.queryReady,
       "refresh-counter": r.refreshCounter
     }, {
-      default: F(({ data: n }) => [
-        ae(x(wi), {
+      default: q(({ data: n }) => [
+        le(x(Ei), {
           data: n,
           "synthetics-data-key": r.chartOptions.synthetics_data_key
-        }, ht({ _: 2 }, [
+        }, Ye({ _: 2 }, [
           e.chartOptions.entity_link ? {
             name: "name",
-            fn: F(({ record: l }) => [
-              ae(x(i), {
+            fn: q(({ record: l }) => [
+              le(x(i), {
                 "entity-link-data": {
                   id: l.id,
                   label: l.name,
@@ -1098,7 +1085,7 @@ const ue = {
       _: 1
     }, 8, ["context", "query", "query-ready", "refresh-counter"]));
   }
-}), ps = /* @__PURE__ */ ee({
+}), ps = /* @__PURE__ */ J({
   __name: "DonutChartRenderer",
   props: {
     query: {},
@@ -1111,7 +1098,7 @@ const ue = {
     exploreLink: {}
   },
   setup(d) {
-    return (e, t) => (C(), q(ft, {
+    return (e, t) => (C(), M(ft, {
       "chart-options": e.chartOptions,
       context: e.context,
       height: e.height,
@@ -1123,12 +1110,12 @@ const ue = {
 }), ys = ["data-testid"], vs = {
   key: 0,
   class: "tile-header"
-}, _s = ["data-testid"], bs = { class: "badge-text" }, ws = ["data-testid"], Es = { class: "delete-option" }, xs = ["data-testid"], Cs = ["data-testid"], Rs = /* @__PURE__ */ ee({
+}, _s = ["data-testid"], bs = { class: "badge-text" }, ws = ["data-testid"], Es = { class: "delete-option" }, xs = ["data-testid"], Cs = ["data-testid"], Rs = /* @__PURE__ */ J({
   __name: "DashboardTile",
   props: {
     definition: {},
     context: {},
-    height: { default: Xe },
+    height: { default: Ze },
     isFullscreen: { type: Boolean },
     queryReady: { type: Boolean },
     refreshCounter: {},
@@ -1136,35 +1123,35 @@ const ue = {
   },
   emits: ["edit-tile", "duplicate-tile", "remove-tile", "tile-time-range-zoom"],
   setup(d, { emit: e }) {
-    Ye((y) => ({
-      "0b59d877": `${y.height}px`
+    je((v) => ({
+      "0b59d877": `${v.height}px`
     }));
-    const t = parseInt(ei, 10), i = d, s = e, r = qt(() => import("./GeoMapRenderer-NvV03kSZ.js")), o = ye(pe), n = o == null ? void 0 : o.evaluateFeatureFlagFn("analytics-chart-zoom-actions", !1), { i18n: l } = ue.useI18n(), h = A(), u = A({ status: "loading" }), a = A(!1), f = A(), m = A(!1), g = A(!0), {
-      exploreLinkKebabMenu: v,
+    const t = parseInt(ei, 10), i = d, s = e, r = qt(() => import("./GeoMapRenderer-B9ELIHrp.js")), o = ye(pe), n = o == null ? void 0 : o.evaluateFeatureFlagFn("analytics-chart-zoom-actions", !1), { i18n: l } = ce.useI18n(), h = N(), u = N({ status: "loading" }), a = N(!1), f = N(), m = N(!1), g = N(!0), {
+      exploreLinkKebabMenu: y,
       requestsLinkKebabMenu: p,
       canShowKebabMenu: S,
-      canGenerateRequestsLink: L,
+      canGenerateRequestsLink: I,
       canGenerateExploreLink: R,
-      requestsLinkZoomActions: k,
-      exploreLinkZoomActions: G,
+      requestsLinkZoomActions: ee,
+      exploreLinkZoomActions: B,
       buildExploreQuery: _e,
       buildExploreLink: be,
-      buildRequestLink: T,
-      buildRequestsQueryZoomActions: H
-    } = ue.useContextLinks({
+      buildRequestLink: k,
+      buildRequestsQueryZoomActions: L
+    } = ce.useContextLinks({
       queryBridge: o,
-      chartData: st(h),
-      definition: st(wt(i, "definition")),
-      context: st(wt(i, "context"))
-    }), { issueQuery: j } = ue.useIssueQuery();
-    Qe(() => i.definition, async () => {
+      chartData: rt(h),
+      definition: rt(wt(i, "definition")),
+      context: rt(wt(i, "context"))
+    }), { issueQuery: Y } = ce.useIssueQuery();
+    Ve(() => i.definition, async () => {
       await ut(), f.value && (m.value = f.value.scrollWidth > f.value.clientWidth), g.value = !0;
     }, { immediate: !0, deep: !0 });
-    const W = z(() => l.t("csvExport.defaultFilename")), Ie = z(() => S.value && (E.value || i.context.editable) || !!X.value), E = z(() => !!v.value || ("allow_csv_export" in i.definition.chart ? i.definition.chart.allow_csv_export : !0) || i.context.editable), N = {
-      timeseries_line: St,
-      timeseries_bar: St,
-      horizontal_bar: Dt,
-      vertical_bar: Dt,
+    const U = T(() => l.t("csvExport.defaultFilename")), Me = T(() => S.value && (E.value || i.context.editable) || !!j.value), E = T(() => !!y.value || ("allow_csv_export" in i.definition.chart ? i.definition.chart.allow_csv_export : !0) || i.context.editable), D = {
+      timeseries_line: Dt,
+      timeseries_bar: Dt,
+      horizontal_bar: St,
+      vertical_bar: St,
       gauge: zt,
       donut: ps,
       golden_signals: cs,
@@ -1172,17 +1159,17 @@ const ue = {
       slottable: void 0,
       single_value: zt,
       choropleth_map: r
-    }, O = z(() => {
-      var y, P;
+    }, A = T(() => {
+      var v, P;
       return {
-        ...(y = M.value) != null && y.rendererEvents.supportsRequests ? { "select-chart-range": ni } : {},
-        ...(P = M.value) != null && P.rendererEvents.supportsZoom ? { "zoom-time-range": ri } : {}
+        ...(v = H.value) != null && v.rendererEvents.supportsRequests ? { "select-chart-range": ni } : {},
+        ...(P = H.value) != null && P.rendererEvents.supportsZoom ? { "zoom-time-range": ri } : {}
       };
-    }), M = z(() => {
-      var te, Z;
-      const y = N[i.definition.chart.type], P = !!((te = y == null ? void 0 : y.emits) != null && te.includes("select-chart-range")), $ = !!((Z = y == null ? void 0 : y.emits) != null && Z.includes("zoom-time-range"));
-      return y && {
-        component: y,
+    }), H = T(() => {
+      var te, X;
+      const v = D[i.definition.chart.type], P = !!((te = v == null ? void 0 : v.emits) != null && te.includes("select-chart-range")), $ = !!((X = v == null ? void 0 : v.emits) != null && X.includes("zoom-time-range"));
+      return v && {
+        component: v,
         rendererProps: {
           query: i.definition.query,
           context: i.context,
@@ -1190,202 +1177,202 @@ const ue = {
           chartOptions: i.definition.chart,
           height: i.height - t * 2,
           refreshCounter: i.refreshCounter,
-          requestsLink: k.value,
-          exploreLink: G.value
+          requestsLink: ee.value,
+          exploreLink: B.value
         },
         rendererEvents: {
           supportsRequests: P,
           supportsZoom: $
         }
       };
-    }), X = z(() => {
+    }), j = T(() => {
       var P;
-      const y = (P = i.definition.query) == null ? void 0 : P.time_range;
-      if ((y == null ? void 0 : y.type) === "relative") {
-        const $ = Bt.get(yi[y.time_range]);
-        return $ ? $.display : (console.warn("Did not recognize the given relative time range:", y.time_range), y.time_range);
-      } else if ((y == null ? void 0 : y.type) === "absolute") {
-        const $ = y.tz || "Etc/UTC";
-        return `${Ct(y.start, { short: !0, tz: $ })} - ${Ct(y.end, { short: !0, tz: $ })}`;
+      const v = (P = i.definition.query) == null ? void 0 : P.time_range;
+      if ((v == null ? void 0 : v.type) === "relative") {
+        const $ = Bt.get(yi[v.time_range]);
+        return $ ? $.display : (console.warn("Did not recognize the given relative time range:", v.time_range), v.time_range);
+      } else if ((v == null ? void 0 : v.type) === "absolute") {
+        const $ = v.tz || "Etc/UTC";
+        return `${Ct(v.start, { short: !0, tz: $ })} - ${Ct(v.end, { short: !0, tz: $ })}`;
       }
       return null;
-    }), fe = z(() => h.value ? rt(h.value.meta.granularity_ms) : void 0), qe = z(() => ["timeseries_line", "timeseries_bar"].includes(i.definition.chart.type)), ke = z(() => {
+    }), fe = T(() => h.value ? nt(h.value.meta.granularity_ms) : void 0), Ie = T(() => ["timeseries_line", "timeseries_bar"].includes(i.definition.chart.type)), ke = T(() => {
       var P, $;
-      if (!qe.value || !i.queryReady || g.value)
+      if (!Ie.value || !i.queryReady || g.value)
         return !1;
-      const y = ($ = (P = i.definition) == null ? void 0 : P.query) == null ? void 0 : $.granularity;
-      return !y || !fe.value ? !1 : y !== fe.value;
-    }), Te = z(() => {
-      var $, te, Z;
-      const y = rt((($ = h.value) == null ? void 0 : $.meta.granularity_ms) ?? 0) ?? "unknown", P = ((Z = (te = i.definition) == null ? void 0 : te.query) == null ? void 0 : Z.granularity) ?? "unknown";
+      const v = ($ = (P = i.definition) == null ? void 0 : P.query) == null ? void 0 : $.granularity;
+      return !v || !fe.value ? !1 : v !== fe.value;
+    }), Te = T(() => {
+      var $, te, X;
+      const v = nt((($ = h.value) == null ? void 0 : $.meta.granularity_ms) ?? 0) ?? "unknown", P = ((X = (te = i.definition) == null ? void 0 : te.query) == null ? void 0 : X.granularity) ?? "unknown";
       return l.t("query_aged_out_warning", {
-        currentGranularity: l.t(`granularities.${y}`),
+        currentGranularity: l.t(`granularities.${v}`),
         savedGranularity: l.t(`granularities.${P}`)
       });
-    }), Je = z(() => {
+    }), et = T(() => {
       var $, te;
-      const y = [...i.context.filters, ...i.definition.query.filters ?? []], P = ((te = ($ = i.definition) == null ? void 0 : $.query) == null ? void 0 : te.datasource) ?? "api_usage";
-      return y.filter((Z) => Gt(Z.field).some((oi) => P === oi));
+      const v = [...i.context.filters, ...i.definition.query.filters ?? []], P = ((te = ($ = i.definition) == null ? void 0 : $.query) == null ? void 0 : te.datasource) ?? "api_usage";
+      return v.filter((X) => Gt(X.field).some((oi) => P === oi));
     }), pt = () => {
       s("edit-tile", i.definition);
-    }, et = () => {
-      s("duplicate-tile", i.definition);
     }, tt = () => {
+      s("duplicate-tile", i.definition);
+    }, it = () => {
       s("remove-tile", i.definition);
-    }, yt = (y) => {
-      h.value = y, g.value = !1;
+    }, yt = (v) => {
+      h.value = v, g.value = !1;
     }, ii = () => {
       a.value = !1;
     }, si = async () => {
-      a.value = !0, u.value = { status: "loading" }, j(i.definition.query, i.context, vi).then((y) => {
-        u.value = { status: "success", chartData: y };
-      }).catch((y) => {
-        u.value = { status: "error", error: y };
+      a.value = !0, u.value = { status: "loading" }, Y(i.definition.query, i.context, vi).then((v) => {
+        u.value = { status: "success", chartData: v };
+      }).catch((v) => {
+        u.value = { status: "error", error: v };
       });
-    }, ri = (y) => {
+    }, ri = (v) => {
       const P = {
         tileId: i.tileId.toString(),
-        timeRange: y
+        timeRange: v
       };
       s("tile-time-range-zoom", P);
-    }, ni = (y) => {
-      const P = Je.value, $ = H(y, P), te = _e(y, P);
-      k.value = L.value ? { href: T($) } : void 0, G.value = R.value ? { href: be(te) } : void 0;
+    }, ni = (v) => {
+      const P = et.value, $ = L(v, P), te = _e(v, P);
+      ee.value = I.value ? { href: k($) } : void 0, B.value = R.value ? { href: be(te) } : void 0;
     };
-    return (y, P) => {
-      const $ = me("KTooltip"), te = me("KBadge"), Z = me("KDropdownItem"), vt = me("KDropdown");
-      return C(), Q("div", {
-        class: je(["tile-boundary", { editable: y.context.editable }]),
-        "data-testid": `tile-${y.tileId}`
+    return (v, P) => {
+      const $ = me("KTooltip"), te = me("KBadge"), X = me("KDropdownItem"), vt = me("KDropdown");
+      return C(), V("div", {
+        class: Xe(["tile-boundary", { editable: v.context.editable }]),
+        "data-testid": `tile-${v.tileId}`
       }, [
-        y.definition.chart.type !== "slottable" ? (C(), Q("div", vs, [
-          ae($, {
+        v.definition.chart.type !== "slottable" ? (C(), V("div", vs, [
+          le($, {
             class: "title-tooltip",
             disabled: !m.value,
             "max-width": "500",
-            text: y.definition.chart.chart_title
+            text: v.definition.chart.chart_title
           }, {
-            default: F(() => [
-              ce("div", {
+            default: q(() => [
+              oe("div", {
                 ref_key: "titleRef",
                 ref: f,
                 class: "title"
-              }, ne(y.definition.chart.chart_title), 513)
+              }, ne(v.definition.chart.chart_title), 513)
             ]),
             _: 1
           }, 8, ["disabled", "text"]),
-          Ie.value ? (C(), Q("div", {
+          Me.value ? (C(), V("div", {
             key: 0,
             class: "tile-actions",
-            "data-testid": `tile-actions-${y.tileId}`
+            "data-testid": `tile-actions-${v.tileId}`
           }, [
-            X.value ? (C(), q(te, {
+            j.value ? (C(), M(te, {
               key: 0,
               "data-testid": "time-range-badge",
               tooltip: ke.value ? Te.value : void 0,
               "tooltip-attributes": { maxWidth: "320px" }
-            }, ht({
-              default: F(() => [
-                ce("span", bs, ne(X.value), 1)
+            }, Ye({
+              default: q(() => [
+                oe("span", bs, ne(j.value), 1)
               ]),
               _: 2
             }, [
               ke.value ? {
                 name: "icon",
-                fn: F(() => [
-                  ae(x(Ti), { size: x(fs) }, null, 8, ["size"])
+                fn: q(() => [
+                  le(x(zi), { size: x(fs) }, null, 8, ["size"])
                 ]),
                 key: "0"
               } : void 0
-            ]), 1032, ["tooltip"])) : Y("", !0),
-            x(S) && y.context.editable && !y.isFullscreen ? (C(), q(x(zi), {
+            ]), 1032, ["tooltip"])) : Q("", !0),
+            x(S) && v.context.editable && !v.isFullscreen ? (C(), M(x(Si), {
               key: 1,
               class: "edit-icon",
               color: x(Nt),
-              "data-testid": `edit-tile-${y.tileId}`,
+              "data-testid": `edit-tile-${v.tileId}`,
               size: x(Lt),
               onClick: pt
-            }, null, 8, ["color", "data-testid", "size"])) : Y("", !0),
-            x(S) && E.value && !y.isFullscreen ? (C(), q(vt, {
+            }, null, 8, ["color", "data-testid", "size"])) : Q("", !0),
+            x(S) && E.value && !v.isFullscreen ? (C(), M(vt, {
               key: 2,
               class: "dropdown",
-              "data-testid": `chart-action-menu-${y.tileId}`,
+              "data-testid": `chart-action-menu-${v.tileId}`,
               "kpop-attributes": { placement: "bottom-end" }
             }, {
-              items: F(() => [
-                x(v) ? (C(), q(Z, {
+              items: q(() => [
+                x(y) ? (C(), M(X, {
                   key: 0,
-                  "data-testid": `chart-jump-to-explore-${y.tileId}`,
-                  item: { label: x(l).t("jumpToExplore"), to: x(v) }
-                }, null, 8, ["data-testid", "item"])) : Y("", !0),
-                x(n) && x(p) ? (C(), q(Z, {
+                  "data-testid": `chart-jump-to-explore-${v.tileId}`,
+                  item: { label: x(l).t("jumpToExplore"), to: x(y) }
+                }, null, 8, ["data-testid", "item"])) : Q("", !0),
+                x(n) && x(p) ? (C(), M(X, {
                   key: 1,
-                  "data-testid": `chart-jump-to-requests-${y.tileId}`,
+                  "data-testid": `chart-jump-to-requests-${v.tileId}`,
                   item: { label: x(l).t("jumpToRequests"), to: x(p) }
-                }, null, 8, ["data-testid", "item"])) : Y("", !0),
-                !("allow_csv_export" in y.definition.chart) || y.definition.chart.allow_csv_export ? (C(), q(Z, {
+                }, null, 8, ["data-testid", "item"])) : Q("", !0),
+                !("allow_csv_export" in v.definition.chart) || v.definition.chart.allow_csv_export ? (C(), M(X, {
                   key: 2,
                   class: "chart-export-button",
-                  "data-testid": `chart-csv-export-${y.tileId}`,
+                  "data-testid": `chart-csv-export-${v.tileId}`,
                   onClick: si
                 }, {
-                  default: F(() => [
-                    ce("span", {
+                  default: q(() => [
+                    oe("span", {
                       class: "chart-export-trigger",
-                      "data-testid": `csv-export-button-${y.tileId}`
+                      "data-testid": `csv-export-button-${v.tileId}`
                     }, ne(x(l).t("csvExport.exportAsCsv")), 9, ws)
                   ]),
                   _: 1
-                }, 8, ["data-testid"])) : Y("", !0),
-                y.context.editable ? (C(), q(Z, {
+                }, 8, ["data-testid"])) : Q("", !0),
+                v.context.editable ? (C(), M(X, {
                   key: 3,
-                  "data-testid": `duplicate-tile-${y.tileId}`,
-                  onClick: et
+                  "data-testid": `duplicate-tile-${v.tileId}`,
+                  onClick: tt
                 }, {
-                  default: F(() => [
-                    Se(ne(x(l).t("renderer.duplicateTile")), 1)
+                  default: q(() => [
+                    Qe(ne(x(l).t("renderer.duplicateTile")), 1)
                   ]),
                   _: 1
-                }, 8, ["data-testid"])) : Y("", !0),
-                y.context.editable ? (C(), q(Z, {
+                }, 8, ["data-testid"])) : Q("", !0),
+                v.context.editable ? (C(), M(X, {
                   key: 4,
-                  "data-testid": `remove-tile-${y.tileId}`,
-                  onClick: tt
+                  "data-testid": `remove-tile-${v.tileId}`,
+                  onClick: it
                 }, {
-                  default: F(() => [
-                    ce("span", Es, ne(x(l).t("renderer.delete")), 1)
+                  default: q(() => [
+                    oe("span", Es, ne(x(l).t("renderer.delete")), 1)
                   ]),
                   _: 1
-                }, 8, ["data-testid"])) : Y("", !0)
+                }, 8, ["data-testid"])) : Q("", !0)
               ]),
-              default: F(() => [
-                ae(x(Di), {
+              default: q(() => [
+                le(x(Di), {
                   class: "kebab-action-menu",
                   color: x(Nt),
-                  "data-testid": `kebab-action-menu-${y.tileId}`,
+                  "data-testid": `kebab-action-menu-${v.tileId}`,
                   size: x(Lt)
                 }, null, 8, ["color", "data-testid", "size"])
               ]),
               _: 1
-            }, 8, ["data-testid"])) : Y("", !0)
-          ], 8, _s)) : "description" in y.definition.chart ? (C(), Q("div", {
+            }, 8, ["data-testid"])) : Q("", !0)
+          ], 8, _s)) : "description" in v.definition.chart ? (C(), V("div", {
             key: 1,
             class: "header-description",
-            "data-testid": `tile-description-${y.tileId}`
-          }, ne(y.definition.chart.description), 9, xs)) : Y("", !0),
-          a.value ? (C(), q(x(Ei), {
+            "data-testid": `tile-description-${v.tileId}`
+          }, ne(v.definition.chart.description), 9, xs)) : Q("", !0),
+          a.value ? (C(), M(x(xi), {
             key: 2,
-            "data-testid": `csv-export-modal-${y.tileId}`,
+            "data-testid": `csv-export-modal-${v.tileId}`,
             "export-state": u.value,
-            filename: W.value,
+            filename: U.value,
             onCloseModal: ii
-          }, null, 8, ["data-testid", "export-state", "filename"])) : Y("", !0)
-        ])) : Y("", !0),
-        ce("div", {
+          }, null, 8, ["data-testid", "export-state", "filename"])) : Q("", !0)
+        ])) : Q("", !0),
+        oe("div", {
           class: "tile-content",
-          "data-testid": `tile-content-${y.tileId}`
+          "data-testid": `tile-content-${v.tileId}`
         }, [
-          M.value ? (C(), q(Pt(M.value.component), It({ key: 0 }, M.value.rendererProps, ci(O.value), { onChartData: yt }), null, 16)) : Y("", !0)
+          H.value ? (C(), M(Pt(H.value.component), It({ key: 0 }, H.value.rendererProps, ci(A.value), { onChartData: yt }), null, 16)) : Q("", !0)
         ], 8, Cs)
       ], 10, ys);
     };
@@ -1401,13 +1388,13 @@ const ue = {
   for (let r = 0; r < t; r++)
     i.get(r) ? s.push("auto") : s.push(`${d}px`);
   return s;
-}, zs = /* @__PURE__ */ ee({
+}, zs = /* @__PURE__ */ J({
   __name: "GridLayout",
   props: {
     tileHeight: {
       type: Number,
       required: !1,
-      default: () => Xe
+      default: () => Ze
     },
     tiles: {
       type: Array,
@@ -1415,21 +1402,21 @@ const ue = {
     }
   },
   setup(d) {
-    Ye((n) => ({
+    je((n) => ({
       "2a38e79e": x(Wt),
       "4cc71de6": r.value
     }));
-    const e = d, t = A(null), i = A(0), s = new ResizeObserver((n) => {
+    const e = d, t = N(null), i = N(0), s = new ResizeObserver((n) => {
       window.requestAnimationFrame(() => {
         !Array.isArray(n) || !n.length || (i.value = n[0].contentRect.width);
       });
     });
-    at(() => {
+    lt(() => {
       t.value && s.observe(t.value);
-    }), lt(() => {
+    }), ht(() => {
       t.value && s.unobserve(t.value);
     });
-    const r = z(() => Ts(e.tileHeight, e.tiles).join(" ")), o = z(() => e.tiles.map((n, l) => ({
+    const r = T(() => Ts(e.tileHeight, e.tiles).join(" ")), o = T(() => e.tiles.map((n, l) => ({
       key: `tile-${l}`,
       tile: n,
       style: {
@@ -1439,27 +1426,27 @@ const ue = {
         "grid-row-end": n.layout.position.row + 1 + n.layout.size.rows
       }
     })));
-    return (n, l) => (C(), Q("div", {
+    return (n, l) => (C(), V("div", {
       ref_key: "gridContainer",
       ref: t,
       class: "kong-ui-public-grid-layout"
     }, [
-      (C(!0), Q($t, null, Ft(o.value, (h) => (C(), Q("div", {
+      (C(!0), V($t, null, Ft(o.value, (h) => (C(), V("div", {
         key: h.key,
-        class: je(["grid-cell", {
+        class: Xe(["grid-cell", {
           "empty-cell": !h.tile
         }]),
         style: Et(h.style)
       }, [
-        De(n.$slots, "tile", {
+        Se(n.$slots, "tile", {
           style: Et(h.style),
           tile: h.tile
         }, void 0, !0)
       ], 6))), 128))
     ], 512));
   }
-}), Ds = /* @__PURE__ */ ve(zs, [["__scopeId", "data-v-354b7177"]]);
-function Ss(d, e, t, i, s) {
+}), Ss = /* @__PURE__ */ ve(zs, [["__scopeId", "data-v-354b7177"]]);
+function Ds(d, e, t, i, s) {
   const r = (...o) => (console.warn("gridstack.js: Function `" + t + "` is deprecated in " + s + " and has been replaced with `" + i + "`. It will be **removed** in a future release"), e.apply(d, o));
   return r.prototype = e.prototype, r;
 }
@@ -1799,7 +1786,7 @@ class c {
     return !(!e || e.w === e.h || e.locked || e.noResize || (t = e.grid) != null && t.opts.disableResize || e.minW && e.minW === e.maxW || e.minH && e.minH === e.maxH);
   }
 }
-class le {
+class he {
   constructor(e = {}) {
     this.addedNodes = [], this.removedNodes = [], this.defaultColumn = 12, this.column = e.column || this.defaultColumn, this.column > this.defaultColumn && (this.defaultColumn = this.column), this.maxRow = e.maxRow, this._float = e.float, this.nodes = e.nodes || [], this.onChange = e.onChange;
   }
@@ -1977,7 +1964,7 @@ class le {
    * @param resizing if out of bound, resize down or move into the grid to fit ?
    */
   prepareNode(e, t) {
-    e._id = e._id ?? le._idSeq++;
+    e._id = e._id ?? he._idSeq++;
     const i = e.id;
     if (i) {
       let r = 1;
@@ -2072,7 +2059,7 @@ class le {
     if (t.pack = !0, !this.maxRow)
       return this.moveNode(e, t);
     let i;
-    const s = new le({
+    const s = new he({
       column: this.column,
       float: this.float,
       nodes: this.nodes.map((o) => o._id === e._id ? (i = { ...o }, i) : { ...o })
@@ -2094,7 +2081,7 @@ class le {
   willItFit(e) {
     if (delete e._willFitPos, !this.maxRow)
       return !0;
-    const t = new le({
+    const t = new he({
       column: this.column,
       float: this.float,
       nodes: this.nodes.map((s) => ({ ...s }))
@@ -2122,8 +2109,8 @@ class le {
       const a = e._moving && !t.nested;
       let f = a ? this.directionCollideCoverage(e, t, n) : n[0];
       if (a && f && ((u = (h = e.grid) == null ? void 0 : h.opts) != null && u.subGridDynamic) && !e.grid._isTemp) {
-        const m = c.areaIntercept(t.rect, f._rect), g = c.area(t.rect), v = c.area(f._rect);
-        m / (g < v ? g : v) > 0.8 && (f.grid.makeSubGrid(f.el, void 0, e), f = void 0);
+        const m = c.areaIntercept(t.rect, f._rect), g = c.area(t.rect), y = c.area(f._rect);
+        m / (g < y ? g : y) > 0.8 && (f.grid.makeSubGrid(f.el, void 0, e), f = void 0);
       }
       f ? l = !this._fixCollisions(e, r, f, t) : (l = !1, i && delete t.pack);
     }
@@ -2230,7 +2217,7 @@ class le {
     return e.forEach((r, o) => {
       if (r._id === void 0) {
         const n = r.id ? this.nodes.find((l) => l.id === r.id) : void 0;
-        r._id = (n == null ? void 0 : n._id) ?? le._idSeq++;
+        r._id = (n == null ? void 0 : n._id) ?? he._idSeq++;
       }
       s[o] = { x: r.x, y: r.y, w: r.w, _id: r._id };
     }), this._layouts = i ? [] : this._layouts || [], this._layouts[t] = s, this;
@@ -2241,7 +2228,7 @@ class le {
    * @param column corresponding column index to save it under
    */
   cacheOneLayout(e, t) {
-    e._id = e._id ?? le._idSeq++;
+    e._id = e._id ?? he._idSeq++;
     const i = { x: e.x, y: e.y, w: e.w, _id: e._id };
     (e.autoPosition || e.x === void 0) && (delete i.x, delete i.y, e.autoPosition && (i.autoPosition = !0)), this._layouts = this._layouts || [], this._layouts[t] = this._layouts[t] || [];
     const s = this.findCacheLayout(e, t);
@@ -2265,8 +2252,8 @@ class le {
     return this;
   }
 }
-le._idSeq = 0;
-const J = {
+he._idSeq = 0;
+const Z = {
   alwaysShowResizeHandle: "mobile",
   animate: !0,
   auto: !0,
@@ -2298,55 +2285,55 @@ const J = {
 };
 class w {
 }
-const oe = typeof window < "u" && typeof document < "u" && ("ontouchstart" in document || "ontouchstart" in window || window.DocumentTouch && document instanceof window.DocumentTouch || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0);
-class he {
+const ae = typeof window < "u" && typeof document < "u" && ("ontouchstart" in document || "ontouchstart" in window || window.DocumentTouch && document instanceof window.DocumentTouch || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0);
+class ue {
 }
-function Ge(d, e) {
+function Fe(d, e) {
   d.touches.length > 1 || (d.cancelable && d.preventDefault(), c.simulateMouseEvent(d.changedTouches[0], e));
 }
 function ti(d, e) {
   d.cancelable && d.preventDefault(), c.simulateMouseEvent(d, e);
 }
+function Ge(d) {
+  ue.touchHandled || (ue.touchHandled = !0, Fe(d, "mousedown"));
+}
 function Be(d) {
-  he.touchHandled || (he.touchHandled = !0, Ge(d, "mousedown"));
+  ue.touchHandled && Fe(d, "mousemove");
 }
 function Ue(d) {
-  he.touchHandled && Ge(d, "mousemove");
-}
-function We(d) {
-  if (!he.touchHandled)
+  if (!ue.touchHandled)
     return;
-  he.pointerLeaveTimeout && (window.clearTimeout(he.pointerLeaveTimeout), delete he.pointerLeaveTimeout);
+  ue.pointerLeaveTimeout && (window.clearTimeout(ue.pointerLeaveTimeout), delete ue.pointerLeaveTimeout);
   const e = !!w.dragElement;
-  Ge(d, "mouseup"), e || Ge(d, "click"), he.touchHandled = !1;
+  Fe(d, "mouseup"), e || Fe(d, "click"), ue.touchHandled = !1;
 }
-function Ke(d) {
+function We(d) {
   d.pointerType !== "mouse" && d.target.releasePointerCapture(d.pointerId);
 }
 function Ht(d) {
   w.dragElement && d.pointerType !== "mouse" && ti(d, "mouseenter");
 }
 function Ot(d) {
-  w.dragElement && d.pointerType !== "mouse" && (he.pointerLeaveTimeout = window.setTimeout(() => {
-    delete he.pointerLeaveTimeout, ti(d, "mouseleave");
+  w.dragElement && d.pointerType !== "mouse" && (ue.pointerLeaveTimeout = window.setTimeout(() => {
+    delete ue.pointerLeaveTimeout, ti(d, "mouseleave");
   }, 10));
 }
-class Ze {
+class Je {
   constructor(e, t, i) {
     this.host = e, this.dir = t, this.option = i, this.moving = !1, this._mouseDown = this._mouseDown.bind(this), this._mouseMove = this._mouseMove.bind(this), this._mouseUp = this._mouseUp.bind(this), this._keyEvent = this._keyEvent.bind(this), this._init();
   }
   /** @internal */
   _init() {
     const e = this.el = document.createElement("div");
-    return e.classList.add("ui-resizable-handle"), e.classList.add(`${Ze.prefix}${this.dir}`), e.style.zIndex = "100", e.style.userSelect = "none", this.host.appendChild(this.el), this.el.addEventListener("mousedown", this._mouseDown), oe && (this.el.addEventListener("touchstart", Be), this.el.addEventListener("pointerdown", Ke)), this;
+    return e.classList.add("ui-resizable-handle"), e.classList.add(`${Je.prefix}${this.dir}`), e.style.zIndex = "100", e.style.userSelect = "none", this.host.appendChild(this.el), this.el.addEventListener("mousedown", this._mouseDown), ae && (this.el.addEventListener("touchstart", Ge), this.el.addEventListener("pointerdown", We)), this;
   }
   /** call this when resize handle needs to be removed and cleaned up */
   destroy() {
-    return this.moving && this._mouseUp(this.mouseDownEvent), this.el.removeEventListener("mousedown", this._mouseDown), oe && (this.el.removeEventListener("touchstart", Be), this.el.removeEventListener("pointerdown", Ke)), this.host.removeChild(this.el), delete this.el, delete this.host, this;
+    return this.moving && this._mouseUp(this.mouseDownEvent), this.el.removeEventListener("mousedown", this._mouseDown), ae && (this.el.removeEventListener("touchstart", Ge), this.el.removeEventListener("pointerdown", We)), this.host.removeChild(this.el), delete this.el, delete this.host, this;
   }
   /** @internal called on mouse down on us: capture move on the entire document (mouse might not stay on us) until we release the mouse */
   _mouseDown(e) {
-    this.mouseDownEvent = e, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), oe && (this.el.addEventListener("touchmove", Ue), this.el.addEventListener("touchend", We)), e.stopPropagation(), e.preventDefault();
+    this.mouseDownEvent = e, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), ae && (this.el.addEventListener("touchmove", Be), this.el.addEventListener("touchend", Ue)), e.stopPropagation(), e.preventDefault();
   }
   /** @internal */
   _mouseMove(e) {
@@ -2355,7 +2342,7 @@ class Ze {
   }
   /** @internal */
   _mouseUp(e) {
-    this.moving && (this._triggerEvent("stop", e), document.removeEventListener("keydown", this._keyEvent)), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), oe && (this.el.removeEventListener("touchmove", Ue), this.el.removeEventListener("touchend", We)), delete this.moving, delete this.mouseDownEvent, e.stopPropagation(), e.preventDefault();
+    this.moving && (this._triggerEvent("stop", e), document.removeEventListener("keydown", this._keyEvent)), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), ae && (this.el.removeEventListener("touchmove", Be), this.el.removeEventListener("touchend", Ue)), delete this.moving, delete this.mouseDownEvent, e.stopPropagation(), e.preventDefault();
   }
   /** @internal call when keys are being pressed - use Esc to cancel */
   _keyEvent(e) {
@@ -2367,7 +2354,7 @@ class Ze {
     return this.option[e] && this.option[e](t), this;
   }
 }
-Ze.prefix = "ui-resizable-";
+Je.prefix = "ui-resizable-";
 class gt {
   constructor() {
     this._eventRegister = {};
@@ -2396,7 +2383,7 @@ class gt {
       return this._eventRegister[e](t);
   }
 }
-class Ne extends gt {
+class De extends gt {
   // have to be public else complains for HTMLElementExtendOpt ?
   constructor(e, t = {}) {
     super(), this.el = e, this.option = t, this.rectScale = { x: 1, y: 1 }, this._ui = () => {
@@ -2466,7 +2453,7 @@ class Ne extends gt {
   }
   /** @internal */
   _setupHandlers() {
-    return this.handlers = this.option.handles.split(",").map((e) => e.trim()).map((e) => new Ze(this.el, e, {
+    return this.handlers = this.option.handles.split(",").map((e) => e.trim()).map((e) => new Je(this.el, e, {
       start: (t) => {
         this._resizeStart(t);
       },
@@ -2497,7 +2484,7 @@ class Ne extends gt {
   }
   /** @internal */
   _setupHelper() {
-    this.elOriginStyleVal = Ne._originStyleProp.map((i) => this.el.style[i]), this.parentOriginStylePosition = this.el.parentElement.style.position;
+    this.elOriginStyleVal = De._originStyleProp.map((i) => this.el.style[i]), this.parentOriginStylePosition = this.el.parentElement.style.position;
     const e = this.el.parentElement, t = c.getValuesFromTransformedElement(e);
     return this.rectScale = {
       x: t.xScale,
@@ -2506,7 +2493,7 @@ class Ne extends gt {
   }
   /** @internal */
   _cleanHelper() {
-    return Ne._originStyleProp.forEach((e, t) => {
+    return De._originStyleProp.forEach((e, t) => {
       this.el.style[e] = this.elOriginStyleVal[t] || null;
     }), this.el.parentElement.style.position = this.parentOriginStylePosition || null, this;
   }
@@ -2545,9 +2532,9 @@ class Ne extends gt {
     return this.handlers.forEach((e) => e.destroy()), delete this.handlers, this;
   }
 }
-Ne._originStyleProp = ["width", "height", "position", "left", "top", "opacity", "zIndex"];
+De._originStyleProp = ["width", "height", "position", "left", "top", "opacity", "zIndex"];
 const Ns = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
-class Le extends gt {
+class Ne extends gt {
   constructor(e, t = {}) {
     var r;
     super(), this.el = e, this.option = t, this.dragTransform = {
@@ -2567,12 +2554,12 @@ class Le extends gt {
   }
   enable() {
     this.disabled !== !1 && (super.enable(), this.dragEls.forEach((e) => {
-      e.addEventListener("mousedown", this._mouseDown), oe && (e.addEventListener("touchstart", Be), e.addEventListener("pointerdown", Ke));
+      e.addEventListener("mousedown", this._mouseDown), ae && (e.addEventListener("touchstart", Ge), e.addEventListener("pointerdown", We));
     }), this.el.classList.remove("ui-draggable-disabled"));
   }
   disable(e = !1) {
     this.disabled !== !0 && (super.disable(), this.dragEls.forEach((t) => {
-      t.removeEventListener("mousedown", this._mouseDown), oe && (t.removeEventListener("touchstart", Be), t.removeEventListener("pointerdown", Ke));
+      t.removeEventListener("mousedown", this._mouseDown), ae && (t.removeEventListener("touchstart", Ge), t.removeEventListener("pointerdown", We));
     }), e || this.el.classList.add("ui-draggable-disabled"));
   }
   destroy() {
@@ -2584,7 +2571,7 @@ class Le extends gt {
   /** @internal call when mouse goes down before a dragstart happens */
   _mouseDown(e) {
     if (!w.mouseHandled)
-      return e.button !== 0 || !this.dragEls.find((t) => t === e.target) && e.target.closest(Ns) || this.option.cancel && e.target.closest(this.option.cancel) || (this.mouseDownEvent = e, delete this.dragging, delete w.dragElement, delete w.dropElement, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), oe && (e.currentTarget.addEventListener("touchmove", Ue), e.currentTarget.addEventListener("touchend", We)), e.preventDefault(), document.activeElement && document.activeElement.blur(), w.mouseHandled = !0), !0;
+      return e.button !== 0 || !this.dragEls.find((t) => t === e.target) && e.target.closest(Ns) || this.option.cancel && e.target.closest(this.option.cancel) || (this.mouseDownEvent = e, delete this.dragging, delete w.dragElement, delete w.dropElement, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), ae && (e.currentTarget.addEventListener("touchmove", Be), e.currentTarget.addEventListener("touchend", Ue)), e.preventDefault(), document.activeElement && document.activeElement.blur(), w.mouseHandled = !0), !0;
   }
   /** @internal method to call actual drag event */
   _callDrag(e) {
@@ -2615,7 +2602,7 @@ class Le extends gt {
   /** @internal call when the mouse gets released to drop the item at current location */
   _mouseUp(e) {
     var t, i;
-    if (document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), oe && e.currentTarget && (e.currentTarget.removeEventListener("touchmove", Ue, !0), e.currentTarget.removeEventListener("touchend", We, !0)), this.dragging) {
+    if (document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), ae && e.currentTarget && (e.currentTarget.removeEventListener("touchmove", Be, !0), e.currentTarget.removeEventListener("touchend", Ue, !0)), this.dragging) {
       delete this.dragging, (t = this.el.gridstackNode) == null || delete t._origRotate, document.removeEventListener("keydown", this._keyEvent), ((i = w.dropElement) == null ? void 0 : i.el) === this.el.parentElement && delete w.dropElement, this.helperContainment.style.position = this.parentOriginStylePosition || null, this.helper !== this.el && this.helper.remove(), this._removeHelperStyle();
       const s = c.initEvent(e, { target: this.el, type: "dragstop" });
       this.option.stop && this.option.stop(s), this.triggerEvent("dragstop", s), w.dropElement && w.dropElement.drop(e);
@@ -2637,7 +2624,7 @@ class Le extends gt {
   /** @internal create a clone copy (or user defined method) of the original drag item if set */
   _createHelper() {
     let e = this.el;
-    return typeof this.option.helper == "function" ? e = this.option.helper(this.el) : this.option.helper === "clone" && (e = c.cloneNode(this.el)), e.parentElement || c.appendTo(e, this.option.appendTo === "parent" ? this.el.parentElement : this.option.appendTo), this.dragElementOriginStyle = Le.originStyleProp.map((t) => this.el.style[t]), e;
+    return typeof this.option.helper == "function" ? e = this.option.helper(this.el) : this.option.helper === "clone" && (e = c.cloneNode(this.el)), e.parentElement || c.appendTo(e, this.option.appendTo === "parent" ? this.el.parentElement : this.option.appendTo), this.dragElementOriginStyle = Ne.originStyleProp.map((t) => this.el.style[t]), e;
   }
   /** @internal set the fix position of the dragged item */
   _setupHelperStyle(e) {
@@ -2654,7 +2641,7 @@ class Le extends gt {
     const e = (t = this.helper) == null ? void 0 : t.gridstackNode;
     if (!(e != null && e._isAboutToRemove) && this.dragElementOriginStyle) {
       const i = this.helper, s = this.dragElementOriginStyle.transition || null;
-      i.style.transition = this.dragElementOriginStyle.transition = "none", Le.originStyleProp.forEach((r) => i.style[r] = this.dragElementOriginStyle[r] || null), setTimeout(() => i.style.transition = s, 50);
+      i.style.transition = this.dragElementOriginStyle.transition = "none", Ne.originStyleProp.forEach((r) => i.style[r] = this.dragElementOriginStyle[r] || null), setTimeout(() => i.style.transition = s, 50);
     }
     return delete this.dragElementOriginStyle, this;
   }
@@ -2696,7 +2683,7 @@ class Le extends gt {
     };
   }
 }
-Le.originStyleProp = ["width", "height", "transform", "transform-origin", "transition", "pointerEvents", "position", "left", "top", "minWidth", "willChange"];
+Ne.originStyleProp = ["width", "height", "transform", "transform-origin", "transition", "pointerEvents", "position", "left", "top", "minWidth", "willChange"];
 class Ls extends gt {
   constructor(e, t = {}) {
     super(), this.el = e, this.option = t, this._mouseEnter = this._mouseEnter.bind(this), this._mouseLeave = this._mouseLeave.bind(this), this.enable(), this._setupAccept();
@@ -2708,10 +2695,10 @@ class Ls extends gt {
     super.off(e);
   }
   enable() {
-    this.disabled !== !1 && (super.enable(), this.el.classList.add("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), this.el.addEventListener("mouseenter", this._mouseEnter), this.el.addEventListener("mouseleave", this._mouseLeave), oe && (this.el.addEventListener("pointerenter", Ht), this.el.addEventListener("pointerleave", Ot)));
+    this.disabled !== !1 && (super.enable(), this.el.classList.add("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), this.el.addEventListener("mouseenter", this._mouseEnter), this.el.addEventListener("mouseleave", this._mouseLeave), ae && (this.el.addEventListener("pointerenter", Ht), this.el.addEventListener("pointerleave", Ot)));
   }
   disable(e = !1) {
-    this.disabled !== !0 && (super.disable(), this.el.classList.remove("ui-droppable"), e || this.el.classList.add("ui-droppable-disabled"), this.el.removeEventListener("mouseenter", this._mouseEnter), this.el.removeEventListener("mouseleave", this._mouseLeave), oe && (this.el.removeEventListener("pointerenter", Ht), this.el.removeEventListener("pointerleave", Ot)));
+    this.disabled !== !0 && (super.disable(), this.el.classList.remove("ui-droppable"), e || this.el.classList.add("ui-droppable-disabled"), this.el.removeEventListener("mouseenter", this._mouseEnter), this.el.removeEventListener("mouseleave", this._mouseLeave), ae && (this.el.removeEventListener("pointerenter", Ht), this.el.removeEventListener("pointerleave", Ot)));
   }
   destroy() {
     this.disable(!0), this.el.classList.remove("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), super.destroy();
@@ -2777,13 +2764,13 @@ class mt {
     return this.ddDraggable && ["drag", "dragstart", "dragstop"].indexOf(e) > -1 ? this.ddDraggable.off(e) : this.ddDroppable && ["drop", "dropover", "dropout"].indexOf(e) > -1 ? this.ddDroppable.off(e) : this.ddResizable && ["resizestart", "resize", "resizestop"].indexOf(e) > -1 && this.ddResizable.off(e), this;
   }
   setupDraggable(e) {
-    return this.ddDraggable ? this.ddDraggable.updateOption(e) : this.ddDraggable = new Le(this.el, e), this;
+    return this.ddDraggable ? this.ddDraggable.updateOption(e) : this.ddDraggable = new Ne(this.el, e), this;
   }
   cleanDraggable() {
     return this.ddDraggable && (this.ddDraggable.destroy(), delete this.ddDraggable), this;
   }
   setupResizable(e) {
-    return this.ddResizable ? this.ddResizable.updateOption(e) : this.ddResizable = new Ne(this.el, e), this;
+    return this.ddResizable ? this.ddResizable.updateOption(e) : this.ddResizable = new De(this.el, e), this;
   }
   cleanResizable() {
     return this.ddResizable && (this.ddResizable.destroy(), delete this.ddResizable), this;
@@ -2884,7 +2871,7 @@ class As {
  * Copyright (c) 2021-2024  Alain Dumesny
  * see root license https://github.com/gridstack/gridstack.js/tree/master/LICENSE
  */
-const K = new As();
+const W = new As();
 class b {
   /**
    * initializing the HTML element, or selector string, into a grid will return the grid. Calling it again will
@@ -2949,7 +2936,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   /** @internal create placeholder DIV as needed */
   get placeholder() {
     if (!this._placeholder) {
-      this._placeholder = c.createDiv([this.opts.placeholderClass, J.itemClass, this.opts.itemClass]);
+      this._placeholder = c.createDiv([this.opts.placeholderClass, Z.itemClass, this.opts.itemClass]);
       const e = c.createDiv(["placeholder-content"], this._placeholder);
       this.opts.placeholderText && (e.textContent = this.opts.placeholderText);
     }
@@ -2970,42 +2957,42 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (r.oneColumnModeDomSort && (delete r.oneColumnModeDomSort, console.log("warning: Gridstack oneColumnModeDomSort no longer supported. Use GridStackOptions.columnOpts instead.")), r.oneColumnSize || r.disableOneColumnMode === !1) {
       const g = r.oneColumnSize || 768;
       delete r.oneColumnSize, delete r.disableOneColumnMode, t.columnOpts = t.columnOpts || {}, s = t.columnOpts.breakpoints = t.columnOpts.breakpoints || [];
-      let v = s.find((p) => p.c === 1);
-      v ? v.w = g : (v = { c: 1, w: g }, s.push(v, { c: 12, w: g + 1 }));
+      let y = s.find((p) => p.c === 1);
+      y ? y.w = g : (y = { c: 1, w: g }, s.push(y, { c: 12, w: g + 1 }));
     }
     const o = t.columnOpts;
-    o && (!o.columnWidth && !((f = o.breakpoints) != null && f.length) ? (delete t.columnOpts, s = void 0) : o.columnMax = o.columnMax || 12), (s == null ? void 0 : s.length) > 1 && s.sort((g, v) => (v.w || 0) - (g.w || 0));
+    o && (!o.columnWidth && !((f = o.breakpoints) != null && f.length) ? (delete t.columnOpts, s = void 0) : o.columnMax = o.columnMax || 12), (s == null ? void 0 : s.length) > 1 && s.sort((g, y) => (y.w || 0) - (g.w || 0));
     const n = {
-      ...c.cloneDeep(J),
-      column: c.toNumber(e.getAttribute("gs-column")) || J.column,
-      minRow: i || c.toNumber(e.getAttribute("gs-min-row")) || J.minRow,
-      maxRow: i || c.toNumber(e.getAttribute("gs-max-row")) || J.maxRow,
-      staticGrid: c.toBool(e.getAttribute("gs-static")) || J.staticGrid,
+      ...c.cloneDeep(Z),
+      column: c.toNumber(e.getAttribute("gs-column")) || Z.column,
+      minRow: i || c.toNumber(e.getAttribute("gs-min-row")) || Z.minRow,
+      maxRow: i || c.toNumber(e.getAttribute("gs-max-row")) || Z.maxRow,
+      staticGrid: c.toBool(e.getAttribute("gs-static")) || Z.staticGrid,
       sizeToContent: c.toBool(e.getAttribute("gs-size-to-content")) || void 0,
       draggable: {
-        handle: (t.handleClass ? "." + t.handleClass : t.handle ? t.handle : "") || J.draggable.handle
+        handle: (t.handleClass ? "." + t.handleClass : t.handle ? t.handle : "") || Z.draggable.handle
       },
       removableOptions: {
-        accept: t.itemClass || J.removableOptions.accept,
-        decline: J.removableOptions.decline
+        accept: t.itemClass || Z.removableOptions.accept,
+        decline: Z.removableOptions.decline
       }
     };
     e.getAttribute("gs-animate") && (n.animate = c.toBool(e.getAttribute("gs-animate"))), t = c.defaults(t, n), this._initMargin(), this.checkDynamicColumn(), this.el.classList.add("gs-" + t.column), t.rtl === "auto" && (t.rtl = e.style.direction === "rtl"), t.rtl && this.el.classList.add("grid-stack-rtl");
-    const l = this.el.closest("." + J.itemClass), h = l == null ? void 0 : l.gridstackNode;
-    h && (h.subGrid = this, this.parentGridNode = h, this.el.classList.add("grid-stack-nested"), h.el.classList.add("grid-stack-sub-grid")), this._isAutoCellHeight = t.cellHeight === "auto", this._isAutoCellHeight || t.cellHeight === "initial" ? this.cellHeight(void 0, !1) : (typeof t.cellHeight == "number" && t.cellHeightUnit && t.cellHeightUnit !== J.cellHeightUnit && (t.cellHeight = t.cellHeight + t.cellHeightUnit, delete t.cellHeightUnit), this.cellHeight(t.cellHeight, !1)), t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = oe), this._styleSheetClass = "gs-id-" + le._idSeq++, this.el.classList.add(this._styleSheetClass), this._setStaticClass();
-    const u = t.engineClass || b.engineClass || le;
+    const l = this.el.closest("." + Z.itemClass), h = l == null ? void 0 : l.gridstackNode;
+    h && (h.subGrid = this, this.parentGridNode = h, this.el.classList.add("grid-stack-nested"), h.el.classList.add("grid-stack-sub-grid")), this._isAutoCellHeight = t.cellHeight === "auto", this._isAutoCellHeight || t.cellHeight === "initial" ? this.cellHeight(void 0, !1) : (typeof t.cellHeight == "number" && t.cellHeightUnit && t.cellHeightUnit !== Z.cellHeightUnit && (t.cellHeight = t.cellHeight + t.cellHeightUnit, delete t.cellHeightUnit), this.cellHeight(t.cellHeight, !1)), t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = ae), this._styleSheetClass = "gs-id-" + he._idSeq++, this.el.classList.add(this._styleSheetClass), this._setStaticClass();
+    const u = t.engineClass || b.engineClass || he;
     if (this.engine = new u({
       column: this.getColumn(),
       float: t.float,
       maxRow: t.maxRow,
       onChange: (g) => {
-        let v = 0;
+        let y = 0;
         this.engine.nodes.forEach((p) => {
-          v = Math.max(v, p.y + p.h);
+          y = Math.max(y, p.y + p.h);
         }), g.forEach((p) => {
           const S = p.el;
           S && (p._removeDOM ? (S && S.remove(), delete p._removeDOM) : this._writePosAttr(S, p));
-        }), this._updateStyles(!1, v);
+        }), this._updateStyles(!1, y);
       }
     }), this._updateStyles(!1, 0), t.auto && (this.batchUpdate(), this.engine._loading = !0, this.getGridItems().forEach((g) => this._prepareElement(g)), delete this.engine._loading, this.batchUpdate(!1)), t.children) {
       const g = t.children;
@@ -3062,13 +3049,13 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @returns newly created grid
    */
   makeSubGrid(e, t, i, s = !0) {
-    var m, g, v;
+    var m, g, y;
     let r = e.gridstackNode;
     if (r || (r = this.makeWidget(e).gridstackNode), (m = r.subGrid) != null && m.el)
       return r.subGrid;
     let o, n = this;
     for (; n && !o; )
-      o = (g = n.opts) == null ? void 0 : g.subGridOpts, n = (v = n.parentGridNode) == null ? void 0 : v.grid;
+      o = (g = n.opts) == null ? void 0 : g.subGridOpts, n = (y = n.parentGridNode) == null ? void 0 : y.grid;
     t = c.cloneDeep({
       // by default sub-grid inherit from us | parent, other than id, children, etc...
       ...this.opts,
@@ -3085,8 +3072,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     t.column === "auto" && (l = !0, t.column = Math.max(r.w || 1, (i == null ? void 0 : i.w) || 1), delete t.columnOpts);
     let h = r.el.querySelector(".grid-stack-item-content"), u, a;
     if (s && (this._removeDD(r.el), a = { ...r, x: 0, y: 0 }, c.removeInternalForSave(a), delete a.subGridOpts, r.content && (a.content = r.content, delete r.content), b.addRemoveCB ? u = b.addRemoveCB(this.el, a, !0, !1) : (u = c.createDiv(["grid-stack-item"]), u.appendChild(h), h = c.createDiv(["grid-stack-item-content"], r.el)), this.prepareDragDrop(r.el)), i) {
-      const p = l ? t.column : r.w, S = r.h + i.h, L = r.el.style;
-      L.transition = "none", this.update(r.el, { w: p, h: S }), setTimeout(() => L.transition = null);
+      const p = l ? t.column : r.w, S = r.h + i.h, I = r.el.style;
+      I.transition = "none", this.update(r.el, { w: p, h: S }), setTimeout(() => I.transition = null);
     }
     const f = r.subGrid = b.addGrid(h, t);
     return i != null && i._moving && (f._isTemp = !0), l && (f._autoColumn = !0), s && f.makeWidget(u, a), i && (i._moving ? window.setTimeout(() => c.simulateMouseEvent(i._event, "mouseenter", f.el), 0) : f.makeWidget(r.el, r)), this.resizeToContentCheck(!1, r), f;
@@ -3127,7 +3114,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       const r = c.cloneDeep(this.opts);
       r.marginBottom === r.marginTop && r.marginRight === r.marginLeft && r.marginTop === r.marginRight && (r.margin = r.marginTop, delete r.marginTop, delete r.marginRight, delete r.marginBottom, delete r.marginLeft), r.rtl === (this.el.style.direction === "rtl") && (r.rtl = "auto"), this._isAutoCellHeight && (r.cellHeight = "auto"), this._autoColumn && (r.column = "auto");
       const o = r._alwaysShowResizeHandle;
-      return delete r._alwaysShowResizeHandle, o !== void 0 ? r.alwaysShowResizeHandle = o : delete r.alwaysShowResizeHandle, c.removeInternalAndSame(r, J), r.children = s, r;
+      return delete r._alwaysShowResizeHandle, o !== void 0 ? r.alwaysShowResizeHandle = o : delete r.alwaysShowResizeHandle, c.removeInternalAndSame(r, Z), r.children = s, r;
     }
     return s;
   }
@@ -3507,8 +3494,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     let h;
     if (t.subGrid) {
       h = t.subGrid.getRow() * t.subGrid.getCellHeight(!0);
-      const g = t.subGrid.el.getBoundingClientRect(), v = t.subGrid.el.parentElement.getBoundingClientRect();
-      h += g.top - v.top;
+      const g = t.subGrid.el.getBoundingClientRect(), y = t.subGrid.el.parentElement.getBoundingClientRect();
+      h += g.top - y.top;
     } else {
       if ((m = (f = t.subGridOpts) == null ? void 0 : f.children) != null && m.length)
         return;
@@ -3678,7 +3665,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** @internal */
   _prepareElement(e, t = !1, i) {
-    i = i || this._readAttr(e), e.gridstackNode = i, i.el = e, i.grid = this, i = this.engine.addNode(i, t), this._writeAttr(e, i), e.classList.add(J.itemClass, this.opts.itemClass);
+    i = i || this._readAttr(e), e.gridstackNode = i, i.el = e, i.grid = this, i = this.engine.addNode(i, t), this._writeAttr(e, i), e.classList.add(Z.itemClass, this.opts.itemClass);
     const s = c.shouldSizeToContent(i);
     return s ? e.classList.add("size-to-content") : e.classList.remove("size-to-content"), s && this.resizeToContentCheck(!1, i), c.lazyLoad(i) || this.prepareDragDrop(i.el), this;
   }
@@ -3784,7 +3771,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   /** get the global (but static to this code) DD implementation */
   static getDD() {
-    return K;
+    return W;
   }
   /**
    * call to setup dragging in from the outside (say toolbar), by specifying the class selection and options.
@@ -3797,7 +3784,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   static setupDragIn(e, t, i, s = document) {
     (t == null ? void 0 : t.pause) !== void 0 && (w.pauseDrag = t.pause), t = { appendTo: "body", helper: "clone", ...t || {} }, (typeof e == "string" ? c.getElements(e, s) : e).forEach((o, n) => {
-      K.isDraggable(o) || K.dragIn(o, t), i != null && i[n] && (o.gridstackNode = i[n]);
+      W.isDraggable(o) || W.dragIn(o, t), i != null && i[n] && (o.gridstackNode = i[n]);
     });
   }
   /**
@@ -3876,12 +3863,12 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** @internal removes any drag&drop present (called during destroy) */
   _removeDD(e) {
-    return K.draggable(e, "destroy").resizable(e, "destroy"), e.gridstackNode && delete e.gridstackNode._initDD, delete e.ddElement, this;
+    return W.draggable(e, "destroy").resizable(e, "destroy"), e.gridstackNode && delete e.gridstackNode._initDD, delete e.ddElement, this;
   }
   /** @internal called to add drag over to support widgets being added externally */
   _setupAcceptWidget() {
     if (this.opts.staticGrid || !this.opts.acceptWidgets && !this.opts.removable)
-      return K.droppable(this.el, "destroy"), this;
+      return W.droppable(this.el, "destroy"), this;
     let e, t;
     const i = (s, r, o) => {
       var f;
@@ -3906,7 +3893,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       if (n._temporaryRemoved) {
         if (n.x = Math.max(0, Math.round(h / t)), n.y = Math.max(0, Math.round(l / e)), delete n.autoPosition, this.engine.nodeBoundFix(n), !this.engine.willItFit(n)) {
           if (n.autoPosition = !0, !this.engine.willItFit(n)) {
-            K.off(r, "drag");
+            W.off(r, "drag");
             return;
           }
           n._willFitPos && (c.copyPos(n, n._willFitPos), delete n._willFitPos);
@@ -3915,7 +3902,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       } else
         this._dragOrResize(o, s, a, n, t, e);
     };
-    return K.droppable(this.el, {
+    return W.droppable(this.el, {
       accept: (s) => {
         const r = s.gridstackNode || this._readAttr(s, !1);
         if ((r == null ? void 0 : r.grid) === this)
@@ -3954,12 +3941,12 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       n.grid || (n.el || (n = { ...n }), n._isExternal = !0, o.gridstackNode = n);
       const l = n.w || Math.round(o.offsetWidth / t) || 1, h = n.h || Math.round(o.offsetHeight / e) || 1;
       return n.grid && n.grid !== this ? (r._gridstackNodeOrig || (r._gridstackNodeOrig = n), r.gridstackNode = n = { ...n, w: l, h, grid: this }, delete n.x, delete n.y, this.engine.cleanupNode(n).nodeBoundFix(n), n._initDD = n._isExternal = // DOM needs to be re-parented on a drop
-      n._temporaryRemoved = !0) : (n.w = l, n.h = h, n._temporaryRemoved = !0), b._itemRemoving(n.el, !1), K.on(r, "drag", i), i(s, r, o), !1;
+      n._temporaryRemoved = !0) : (n.w = l, n.h = h, n._temporaryRemoved = !0), b._itemRemoving(n.el, !1), W.on(r, "drag", i), i(s, r, o), !1;
     }).on(this.el, "dropout", (s, r, o) => {
       const n = (o == null ? void 0 : o.gridstackNode) || r.gridstackNode;
       return n && (!n.grid || n.grid === this) && (this._leave(r, o), this._isTemp && this.removeAsSubGrid(n)), !1;
     }).on(this.el, "drop", (s, r, o) => {
-      var m, g, v;
+      var m, g, y;
       const n = (o == null ? void 0 : o.gridstackNode) || r.gridstackNode;
       if ((n == null ? void 0 : n.grid) === this && !n._isExternal)
         return !1;
@@ -3972,9 +3959,9 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         const p = a.grid;
         p.engine.removeNodeFromLayoutCache(a), p.engine.removedNodes.push(a), p._triggerRemoveEvent()._triggerChangeEvent(), p.parentGridNode && !p.engine.nodes.length && p.opts.subGridDynamic && p.removeAsSubGrid();
       }
-      if (!n || (l && (this.engine.cleanupNode(n), n.grid = this), (m = n.grid) == null || delete m._isTemp, K.off(r, "drag"), o !== r ? (o.remove(), r = o) : r.remove(), this._removeDD(r), !l))
+      if (!n || (l && (this.engine.cleanupNode(n), n.grid = this), (m = n.grid) == null || delete m._isTemp, W.off(r, "drag"), o !== r ? (o.remove(), r = o) : r.remove(), this._removeDD(r), !l))
         return !1;
-      const f = (v = (g = n.subGrid) == null ? void 0 : g.el) == null ? void 0 : v.gridstack;
+      const f = (y = (g = n.subGrid) == null ? void 0 : g.el) == null ? void 0 : y.gridstack;
       return c.copyPos(n, this._readAttr(this.placeholder)), c.removePositioningStyles(r), h && (n.content || n.subGridOpts || b.addRemoveCB) ? (delete n.el, r = this.addWidget(n)) : (this._prepareElement(r, !0, n), this.el.appendChild(r), this.resizeToContentCheck(!1, n), f && (f.parentGridNode = n, f.opts.styleInHead || f._updateStyles(!0)), this._updateContainerHeight()), this.engine.addedNodes.push(n), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...s, type: "dropped" }, a && a.grid ? a : void 0, n), u && this.setAnimation(this.opts.animate, !0), !1;
     }), this;
   }
@@ -3990,7 +3977,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (typeof this.opts.removable != "string")
       return this;
     const e = document.querySelector(this.opts.removable);
-    return e ? (!this.opts.staticGrid && !K.isDroppable(e) && K.droppable(e, this.opts.removableOptions).on(e, "dropover", (t, i) => b._itemRemoving(i, !0)).on(e, "dropout", (t, i) => b._itemRemoving(i, !1)), this) : this;
+    return e ? (!this.opts.staticGrid && !W.isDroppable(e) && W.droppable(e, this.opts.removableOptions).on(e, "dropover", (t, i) => b._itemRemoving(i, !0)).on(e, "dropout", (t, i) => b._itemRemoving(i, !1)), this) : this;
   }
   /**
    * prepares the element for drag&drop - this is normally called by makeWidget() unless are are delay loading
@@ -4015,14 +4002,14 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         const m = i.w !== i._orig.w, g = f.target;
         if (!(!g.gridstackNode || g.gridstackNode.grid !== this)) {
           if (i.el = g, i._isAboutToRemove) {
-            const v = e.gridstackNode.grid;
-            v._gsEventHandler[f.type] && v._gsEventHandler[f.type](f, g), v.engine.nodes.push(i), v.removeWidget(e, !0, !0);
+            const y = e.gridstackNode.grid;
+            y._gsEventHandler[f.type] && y._gsEventHandler[f.type](f, g), y.engine.nodes.push(i), y.removeWidget(e, !0, !0);
           } else
             c.removePositioningStyles(g), i._temporaryRemoved ? (c.copyPos(i, i._orig), this._writePosAttr(g, i), this.engine.addNode(i)) : this._writePosAttr(g, i), this._gsEventHandler[f.type] && this._gsEventHandler[f.type](f, g);
           this._extraDragRow = 0, this._updateContainerHeight(), this._triggerChangeEvent(), this.engine.endUpdate(), f.type === "resizestop" && (Number.isInteger(i.sizeToContent) && (i.sizeToContent = i.h), this.resizeToContentCheck(m, i));
         }
       };
-      K.draggable(e, {
+      W.draggable(e, {
         start: h,
         stop: a,
         drag: u
@@ -4032,7 +4019,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         resize: u
       }), i._initDD = !0;
     }
-    return K.draggable(e, s ? "disable" : "enable").resizable(e, r ? "disable" : "enable"), this;
+    return W.draggable(e, s ? "disable" : "enable").resizable(e, r ? "disable" : "enable"), this;
   }
   /** @internal handles actual drag/resize start */
   _onStartMoving(e, t, i, s, r, o) {
@@ -4051,7 +4038,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       };
     if (s.el = this.placeholder, s._lastUiPosition = i.position, s._prevYPix = i.position.top, s._moving = t.type === "dragstart", delete s._lastTried, t.type === "dropover" && s._temporaryRemoved && (this.engine.addNode(s), s._moving = !0), this.engine.cacheRects(r, o, this.opts.marginTop, this.opts.marginRight, this.opts.marginBottom, this.opts.marginLeft), t.type === "resizestart") {
       const l = this.getColumn() - s.x, h = (this.opts.maxRow || Number.MAX_SAFE_INTEGER) - s.y;
-      K.resizable(e, "option", "minWidth", r * Math.min(s.minW || 1, l)).resizable(e, "option", "minHeight", o * Math.min(s.minH || 1, h)).resizable(e, "option", "maxWidth", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, l)).resizable(e, "option", "maxWidthMoveLeft", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, s.x + s.w)).resizable(e, "option", "maxHeight", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, h)).resizable(e, "option", "maxHeightMoveUp", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, s.y + s.h));
+      W.resizable(e, "option", "minWidth", r * Math.min(s.minW || 1, l)).resizable(e, "option", "minHeight", o * Math.min(s.minH || 1, h)).resizable(e, "option", "maxWidth", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, l)).resizable(e, "option", "maxWidthMoveLeft", r * Math.min(s.maxW || Number.MAX_SAFE_INTEGER, s.x + s.w)).resizable(e, "option", "maxHeight", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, h)).resizable(e, "option", "maxHeightMoveUp", o * Math.min(s.maxH || Number.MAX_SAFE_INTEGER, s.y + s.h));
     }
   }
   /** @internal handles actual drag/resize */
@@ -4064,13 +4051,13 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         return;
       const p = i.position.top - s._prevYPix;
       s._prevYPix = i.position.top, this.opts.draggable.scroll !== !1 && c.updateScrollPosition(e, i.position, p);
-      const S = i.position.left + (i.position.left > s._lastUiPosition.left ? -u : h), L = i.position.top + (i.position.top > s._lastUiPosition.top ? -f : a);
-      n.x = Math.round(S / r), n.y = Math.round(L / o);
+      const S = i.position.left + (i.position.left > s._lastUiPosition.left ? -u : h), I = i.position.top + (i.position.top > s._lastUiPosition.top ? -f : a);
+      n.x = Math.round(S / r), n.y = Math.round(I / o);
       const R = this._extraDragRow;
       if (this.engine.collide(s, n)) {
-        const k = this.getRow();
-        let G = Math.max(0, n.y + s.h - k);
-        this.opts.maxRow && k + G > this.opts.maxRow && (G = Math.max(0, this.opts.maxRow - k)), this._extraDragRow = G;
+        const ee = this.getRow();
+        let B = Math.max(0, n.y + s.h - ee);
+        this.opts.maxRow && ee + B > this.opts.maxRow && (B = Math.max(0, this.opts.maxRow - ee)), this._extraDragRow = B;
       } else
         this._extraDragRow = 0;
       if (this._extraDragRow !== R && this._updateContainerHeight(), s.x === n.x && s.y === n.y)
@@ -4082,13 +4069,13 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       n.x = Math.round(p / r), n.y = Math.round(S / o), l = !0;
     }
     s._event = t, s._lastTried = n;
-    const v = {
+    const y = {
       x: i.position.left + h,
       y: i.position.top + a,
       w: (i.size ? i.size.width : s.w * r) - h - u,
       h: (i.size ? i.size.height : s.h * o) - a - f
     };
-    if (this.engine.moveNodeCheck(s, { ...n, cellWidth: r, cellHeight: o, rect: v, resizing: l })) {
+    if (this.engine.moveNodeCheck(s, { ...n, cellWidth: r, cellHeight: o, rect: y, resizing: l })) {
       s._lastUiPosition = i.position, this.engine.cacheRects(r, o, a, u, f, h), delete s._skipDown, l && s.subGrid && s.subGrid.onResize(), this._extraDragRow = 0, this._updateContainerHeight();
       const p = t.target;
       s._sidebarOrig || this._writePosAttr(p, s), this._gsEventHandler[t.type] && this._gsEventHandler[t.type](t, p);
@@ -4101,7 +4088,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   _leave(e, t) {
     t = t || e;
     const i = t.gridstackNode;
-    if (!i || (t.style.transform = t.style.transformOrigin = null, K.off(e, "drag"), i._temporaryRemoved))
+    if (!i || (t.style.transform = t.style.transformOrigin = null, W.off(e, "drag"), i._temporaryRemoved))
       return;
     i._temporaryRemoved = !0, this.engine.removeNode(i), i.el = i._isExternal && t ? t : e;
     const s = i._sidebarOrig;
@@ -4109,7 +4096,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   // legacy method removed
   commit() {
-    return Ss(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
+    return Ds(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
   }
 }
 b.renderCB = (d, e) => {
@@ -4117,24 +4104,24 @@ b.renderCB = (d, e) => {
 };
 b.resizeToContentParent = ".grid-stack-item-content";
 b.Utils = c;
-b.Engine = le;
+b.Engine = he;
 b.GDRev = "11.5.1";
-const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { class: "grid-stack-item-content" }, Ms = /* @__PURE__ */ ee({
+const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { class: "grid-stack-item-content" }, Ms = /* @__PURE__ */ J({
   __name: "DraggableGridLayout",
   props: {
     tiles: {},
-    tileHeight: { default: Xe }
+    tileHeight: { default: Ze }
   },
   emits: ["update-tiles"],
   setup(d, { expose: e, emit: t }) {
-    const i = d, s = t, r = A(null), o = A(new Map(i.tiles.map((m) => [`${m.id}`, m])));
+    const i = d, s = t, r = N(null), o = N(new Map(i.tiles.map((m) => [`${m.id}`, m])));
     let n = null;
     const l = (m) => `[data-id="${m}"]`, h = (m) => m.map((g) => {
       var p;
-      const v = o.value.get(`${(p = g.el) == null ? void 0 : p.getAttribute("data-id")}`);
-      if (v)
+      const y = o.value.get(`${(p = g.el) == null ? void 0 : p.getAttribute("data-id")}`);
+      if (y)
         return {
-          ...v,
+          ...y,
           layout: {
             position: { col: Number(g.x), row: Number(g.y) },
             size: { cols: Number(g.w), rows: Number(g.h) }
@@ -4145,12 +4132,12 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
         o.value.set(`${p.id}`, p);
       }), s("update-tiles", Array.from(o.value.values())));
     }, a = (m, g) => {
-      g.forEach((v) => {
+      g.forEach((y) => {
         var p;
-        o.value.delete(`${(p = v.el) == null ? void 0 : p.getAttribute("data-id")}`);
+        o.value.delete(`${(p = y.el) == null ? void 0 : p.getAttribute("data-id")}`);
       }), s("update-tiles", Array.from(o.value.values()));
     };
-    at(() => {
+    lt(() => {
       r.value && (n = b.init({
         margin: 10,
         column: Wt,
@@ -4158,7 +4145,7 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
         resizable: { handles: "se, sw" },
         handle: ".tile-header"
       }, r.value), n.on("change", u), n.on("added", u), n.on("removed", a));
-    }), lt(() => {
+    }), ht(() => {
       n && n.destroy(!1);
     });
     const f = (m) => {
@@ -4167,10 +4154,10 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
         g && n.removeWidget(g);
       }
     };
-    return Qe(() => i.tiles.length, async (m, g) => {
+    return Ve(() => i.tiles.length, async (m, g) => {
       if (m > g && n) {
-        const v = i.tiles.slice(g);
-        for (const p of v)
+        const y = i.tiles.slice(g);
+        for (const p of y)
           o.value.set(`${p.id}`, p), await ut(), n.makeWidget(l(p.id), {
             autoPosition: !0,
             w: p.layout.size.cols,
@@ -4181,24 +4168,24 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
       i.tiles.forEach((m) => {
         o.value.set(`${m.id}`, m);
       });
-    }), e({ removeWidget: f }), (m, g) => (C(), Q("div", {
+    }), e({ removeWidget: f }), (m, g) => (C(), V("div", {
       ref_key: "gridContainer",
       ref: r,
       class: "grid-stack"
     }, [
-      (C(!0), Q($t, null, Ft(i.tiles, (v) => (C(), Q("div", {
-        key: v.id,
+      (C(!0), V($t, null, Ft(i.tiles, (y) => (C(), V("div", {
+        key: y.id,
         class: "grid-stack-item",
-        "data-id": `${v.id}`,
-        "data-testid": `grid-stack-item-${v.id}`,
-        "gs-h": v.layout.size.rows,
+        "data-id": `${y.id}`,
+        "data-testid": `grid-stack-item-${y.id}`,
+        "gs-h": y.layout.size.rows,
         "gs-lazy-load": !0,
-        "gs-w": v.layout.size.cols,
-        "gs-x": v.layout.position.col,
-        "gs-y": v.layout.position.row
+        "gs-w": y.layout.size.cols,
+        "gs-x": y.layout.position.col,
+        "gs-y": y.layout.position.row
       }, [
-        ce("div", Os, [
-          De(m.$slots, "tile", { tile: v }, void 0, !0)
+        oe("div", Os, [
+          Se(m.$slots, "tile", { tile: y }, void 0, !0)
         ])
       ], 8, Hs))), 128))
     ], 512));
@@ -4209,7 +4196,7 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
 }, Ps = {
   key: 0,
   class: "tile-container slottable-tile"
-}, $s = /* @__PURE__ */ ee({
+}, $s = /* @__PURE__ */ J({
   __name: "DashboardRenderer",
   props: /* @__PURE__ */ xt({
     context: {}
@@ -4219,30 +4206,30 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
   }),
   emits: /* @__PURE__ */ xt(["edit-tile", "tile-time-range-zoom"], ["update:modelValue"]),
   setup(d, { expose: e, emit: t }) {
-    Ye((E) => ({
+    je((E) => ({
       "82baf22a": a.value
     }));
-    const i = d, s = t, r = fi(d, "modelValue"), { i18n: o } = ue.useI18n(), n = A(0), l = A(null), h = A(), u = A(), a = A("scale(1)"), f = ye(pe);
-    f || (console.warn("Analytics dashboards require a query bridge supplied via provide / inject."), console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"), console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/dashboard-renderer/README.md#requirements")), ue.useRequestQueue();
-    const m = dt(), g = z(() => i.context.timeSpec ? i.context.timeSpec : {
+    const i = d, s = t, r = fi(d, "modelValue"), { i18n: o } = ce.useI18n(), n = N(0), l = N(null), h = N(), u = N(), a = N("scale(1)"), f = ye(pe);
+    f || (console.warn("Analytics dashboards require a query bridge supplied via provide / inject."), console.warn("Please ensure your application has a query bridge provided under the key 'analytics-query-provider', as described in"), console.warn("https://github.com/Kong/public-ui-components/blob/main/packages/analytics/dashboard-renderer/README.md#requirements")), ce.useRequestQueue();
+    const m = dt(), g = T(() => i.context.timeSpec ? i.context.timeSpec : {
       type: "relative",
       time_range: m.defaultQueryTimeForOrg
-    }), v = z(() => !!i.context.timeSpec || !m.loading), p = (E, N) => {
-      const O = E.layout.position.row - N.layout.position.row;
-      return O !== 0 ? O : E.layout.position.col - N.layout.position.col;
-    }, S = z(() => r.value.tiles.map((E) => {
-      var O;
-      let N = E.definition;
-      if ("description" in N.chart) {
-        const M = (O = N.chart.description) == null ? void 0 : O.replace(Ui, () => {
+    }), y = T(() => !!i.context.timeSpec || !m.loading), p = (E, D) => {
+      const A = E.layout.position.row - D.layout.position.row;
+      return A !== 0 ? A : E.layout.position.col - D.layout.position.col;
+    }, S = T(() => r.value.tiles.map((E) => {
+      var A;
+      let D = E.definition;
+      if ("description" in D.chart) {
+        const H = (A = D.chart.description) == null ? void 0 : A.replace(Ui, () => {
           const fe = `renderer.trendRange.${g.value.type === "absolute" ? "custom" : g.value.time_range}`;
           return o.te(fe) ? o.t(fe) : "";
         });
-        N = {
-          ...N,
+        D = {
+          ...D,
           chart: {
-            ...N.chart,
-            description: M
+            ...D.chart,
+            description: H
           }
         };
       }
@@ -4252,48 +4239,48 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
         E
       ), {
         layout: E.layout,
-        meta: N,
+        meta: D,
         type: E.type,
         // Add a unique key to each tile internally.
         id: E.id ?? crypto.randomUUID()
       };
-    })), L = z(() => {
-      var fe, qe, ke;
-      let { tz: E, refreshInterval: N, editable: O } = i.context;
-      const M = [...i.context.filters ?? [], ...r.value.preset_filters ?? []];
-      if (E || (E = new Intl.DateTimeFormat().resolvedOptions().timeZone), N === void 0 && (N = Wi), W.value) {
+    })), I = T(() => {
+      var fe, Ie, ke;
+      let { tz: E, refreshInterval: D, editable: A } = i.context;
+      const H = [...i.context.filters ?? [], ...r.value.preset_filters ?? []];
+      if (E || (E = new Intl.DateTimeFormat().resolvedOptions().timeZone), D === void 0 && (D = Wi), U.value) {
         let Te = !1;
         if (g.value.type === "relative")
           Te = ["15m", "1h", "6h", "12h", "24h"].includes(g.value.time_range);
         else {
-          const et = g.value.start.getTime(), tt = g.value.end.getTime();
-          Te = Math.abs(tt - et) <= 864e5;
+          const tt = g.value.start.getTime(), it = g.value.end.getTime();
+          Te = Math.abs(it - tt) <= 864e5;
         }
-        const Je = (/* @__PURE__ */ new Date()).getTime();
-        g.value.type === "absolute" && g.value.end.getTime() < Je ? N = 0 : Te ? N = Ki : N = Vi;
+        const et = (/* @__PURE__ */ new Date()).getTime();
+        g.value.type === "absolute" && g.value.end.getTime() < et ? D = 0 : Te ? D = Ki : D = Vi;
       }
-      O === void 0 && (O = !1);
-      const X = !!((ke = (qe = (fe = gi()) == null ? void 0 : fe.vnode) == null ? void 0 : qe.props) != null && ke.onTileTimeRangeZoom);
+      A === void 0 && (A = !1);
+      const j = !!((ke = (Ie = (fe = gi()) == null ? void 0 : fe.vnode) == null ? void 0 : Ie.props) != null && ke.onTileTimeRangeZoom);
       return {
-        filters: M,
+        filters: H,
         tz: E,
         timeSpec: g.value,
-        refreshInterval: N,
-        editable: O,
-        zoomable: X
+        refreshInterval: D,
+        editable: A,
+        zoomable: j
       };
     }), R = (E) => {
       s("edit-tile", E);
-    }, k = (E) => E.type === "slottable", G = (E) => {
-      const N = k(E.meta.chart) ? { ...E.meta.chart } : {
+    }, ee = (E) => E.type === "slottable", B = (E) => {
+      const D = ee(E.meta.chart) ? { ...E.meta.chart } : {
         ...E.meta.chart,
         chart_title: E.meta.chart.chart_title ? `Copy of ${E.meta.chart.chart_title}` : ""
-      }, O = {
+      }, A = {
         id: crypto.randomUUID(),
         type: "chart",
         definition: {
           ...E.meta,
-          chart: N
+          chart: D
         },
         layout: {
           position: {
@@ -4303,82 +4290,82 @@ const Hs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], Os = { cl
           size: E.layout.size
         }
       };
-      r.value.tiles.push(O);
+      r.value.tiles.push(A);
     }, _e = (E) => {
       l.value && l.value.removeWidget(E.id);
     }, be = () => {
       n.value++;
-    }, T = (E) => {
-      const N = E.map((O) => ({
-        id: O.id,
-        type: O.type,
-        layout: O.layout,
-        definition: O.meta
+    }, k = (E) => {
+      const D = E.map((A) => ({
+        id: A.id,
+        type: A.type,
+        layout: A.layout,
+        definition: A.meta
       }));
-      r.value.tiles = N.sort(p);
-    }, H = async () => {
+      r.value.tiles = D.sort(p);
+    }, L = async () => {
       if (a.value = "scale(1)", await ut(), u.value) {
-        const { availWidth: E, availHeight: N } = window.screen, { width: O, height: M } = u.value.getBoundingClientRect(), X = Math.min(N / M, E / O);
-        a.value = `scale(${X})`;
+        const { availWidth: E, availHeight: D } = window.screen, { width: A, height: H } = u.value.getBoundingClientRect(), j = Math.min(D / H, E / A);
+        a.value = `scale(${j})`;
       }
-    }, j = () => {
+    }, Y = () => {
       h.value && (document.fullscreenElement ? document.exitFullscreen() : h.value.requestFullscreen());
-    }, W = A(!1), Ie = () => {
-      W.value = document.fullscreenElement !== null, W.value && H();
+    }, U = N(!1), Me = () => {
+      U.value = document.fullscreenElement !== null, U.value && L();
     };
     return e({
       refresh: be,
-      toggleFullscreen: j
-    }), (E, N) => {
-      const O = me("KAlert");
-      return C(), Q("div", {
+      toggleFullscreen: Y
+    }), (E, D) => {
+      const A = me("KAlert");
+      return C(), V("div", {
         ref_key: "dashboardContainer",
         ref: h,
-        class: je(["kong-ui-public-dashboard-renderer", { "is-fullscreen": W.value }]),
-        onFullscreenchange: Ie
+        class: Xe(["kong-ui-public-dashboard-renderer", { "is-fullscreen": U.value }]),
+        onFullscreenchange: Me
       }, [
-        ce("div", {
+        oe("div", {
           ref_key: "layoutContainer",
           ref: u,
           class: "layout"
         }, [
-          x(f) && W.value ? (C(), Q("div", qs, [
-            De(E.$slots, "fullscreenHeader", {}, void 0, !0)
-          ])) : Y("", !0),
-          x(f) ? (C(), q(Pt(E.context.editable && !W.value ? Is : Ds), {
+          x(f) && U.value ? (C(), V("div", qs, [
+            Se(E.$slots, "fullscreenHeader", {}, void 0, !0)
+          ])) : Q("", !0),
+          x(f) ? (C(), M(Pt(E.context.editable && !U.value ? Is : Ss), {
             key: 2,
             ref_key: "gridLayoutRef",
             ref: l,
             "tile-height": r.value.tile_height,
             tiles: S.value,
-            onUpdateTiles: T
+            onUpdateTiles: k
           }, {
-            tile: F(({ tile: M }) => [
-              M.meta.chart.type === "slottable" ? (C(), Q("div", Ps, [
-                De(E.$slots, M.meta.chart.id, {}, void 0, !0)
-              ])) : (C(), q(ks, {
-                key: W.value ? `${M.id}-tile` : `${M.id}-tile-fullscreen`,
+            tile: q(({ tile: H }) => [
+              H.meta.chart.type === "slottable" ? (C(), V("div", Ps, [
+                Se(E.$slots, H.meta.chart.id, {}, void 0, !0)
+              ])) : (C(), M(ks, {
+                key: U.value ? `${H.id}-tile` : `${H.id}-tile-fullscreen`,
                 class: "tile-container",
-                context: L.value,
-                definition: M.meta,
-                height: M.layout.size.rows * (r.value.tile_height || x(Xe)) + parseInt(x(ei), 10),
-                "is-fullscreen": W.value,
-                "query-ready": v.value,
+                context: I.value,
+                definition: H.meta,
+                height: H.layout.size.rows * (r.value.tile_height || x(Ze)) + parseInt(x(ei), 10),
+                "is-fullscreen": U.value,
+                "query-ready": y.value,
                 "refresh-counter": n.value,
-                "tile-id": M.id,
-                onDuplicateTile: (X) => G(M),
-                onEditTile: (X) => R(M),
-                onRemoveTile: (X) => _e(M),
-                onTileTimeRangeZoom: N[0] || (N[0] = (X) => s("tile-time-range-zoom", X))
+                "tile-id": H.id,
+                onDuplicateTile: (j) => B(H),
+                onEditTile: (j) => R(H),
+                onRemoveTile: (j) => _e(H),
+                onTileTimeRangeZoom: D[0] || (D[0] = (j) => s("tile-time-range-zoom", j))
               }, null, 8, ["context", "definition", "height", "is-fullscreen", "query-ready", "refresh-counter", "tile-id", "onDuplicateTile", "onEditTile", "onRemoveTile"]))
             ]),
             _: 3
-          }, 40, ["tile-height", "tiles"])) : (C(), q(O, {
+          }, 40, ["tile-height", "tiles"])) : (C(), M(A, {
             key: 1,
             appearance: "danger"
           }, {
-            default: F(() => [
-              Se(ne(x(o).t("renderer.noQueryBridge")), 1)
+            default: q(() => [
+              Qe(ne(x(o).t("renderer.noQueryBridge")), 1)
             ]),
             _: 1
           }))
@@ -4392,11 +4379,11 @@ export {
   Xs as D,
   Rt as E,
   Ki as F,
-  Ds as G,
+  Ss as G,
   pe as I,
   Ui as T,
   ct as _,
-  Xe as a,
+  Ze as a,
   Wt as b,
   Wi as c,
   Vi as d