@kong-ui-public/dashboard-renderer 7.0.16 → 7.0.18

package/dist/dashboard-renderer.es.js

@@ -1,34 +1,34 @@
-var Xt = Object.defineProperty;
-var ot = (c) => {
+var Qt = Object.defineProperty;
+var nt = (c) => {
   throw TypeError(c);
 };
-var Qt = (c, e, t) => e in c ? Xt(c, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[e] = t;
-var at = (c, e, t) => Qt(c, typeof e != "symbol" ? e + "" : e, t), Ge = (c, e, t) => e.has(c) || ot("Cannot " + t);
-var _ = (c, e, t) => (Ge(c, e, "read from private field"), t ? t.call(c) : e.get(c)), $ = (c, e, t) => e.has(c) ? ot("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(c) : e.set(c, t), I = (c, e, t, i) => (Ge(c, e, "write to private field"), i ? i.call(c, t) : e.set(c, t), t), B = (c, e, t) => (Ge(c, e, "access private method"), t);
+var Zt = (c, e, t) => e in c ? Qt(c, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[e] = t;
+var ot = (c, e, t) => Zt(c, typeof e != "symbol" ? e + "" : e, t), Ge = (c, e, t) => e.has(c) || nt("Cannot " + t);
+var _ = (c, e, t) => (Ge(c, e, "read from private field"), t ? t.call(c) : e.get(c)), $ = (c, e, t) => e.has(c) ? nt("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(c) : e.set(c, t), L = (c, e, t, i) => (Ge(c, e, "write to private field"), i ? i.call(c, t) : e.set(c, t), t), B = (c, e, t) => (Ge(c, e, "access private method"), t);
 var we = (c, e, t, i) => ({
   set _(s) {
-    I(c, e, s, t);
+    L(c, e, s, t);
   },
   get _() {
     return _(c, e, i);
   }
 });
-import { ref as G, watchEffect as Et, inject as _e, provide as Zt, defineComponent as j, onUnmounted as Ve, computed as N, watch as Ke, resolveComponent as he, createBlock as M, renderSlot as Pe, createCommentVNode as Y, unref as k, openBlock as C, withCtx as q, createVNode as se, createTextVNode as Ee, toDisplayString as te, useCssVars as Ye, createElementVNode as ae, normalizeClass as je, mergeProps as xt, createSlots as Xe, createElementBlock as W, normalizeProps as Jt, guardReactiveProps as ei, defineAsyncComponent as ti, onMounted as Qe, nextTick as Ct, resolveDynamicComponent as Rt, toHandlers as ii, Fragment as Tt, renderList as zt, normalizeStyle as lt, mergeModels as ht, useModel as si, getCurrentInstance as ri } from "vue";
-import { stripUnknownFilters as ni, Timeframe as oi, TimePeriods as Dt, TIMEFRAME_LOOKUP as ai, formatTime as dt, msToGranularity as Ue, getFieldDataSources as li } from "@kong-ui-public/analytics-utilities";
-import { SimpleChart as hi, AnalyticsChart as di, TopNTable as ui, CsvExportModal as ci } from "@kong-ui-public/analytics-chart";
-import fi from "swrv";
+import { ref as G, watchEffect as Et, inject as _e, provide as Jt, defineComponent as X, onUnmounted as We, computed as S, watch as Ve, resolveComponent as de, createBlock as I, renderSlot as Pe, createCommentVNode as j, unref as D, openBlock as C, withCtx as q, createVNode as se, createTextVNode as Ee, toDisplayString as te, useCssVars as Ke, createElementVNode as le, normalizeClass as Ye, mergeProps as xt, createSlots as je, createElementBlock as W, normalizeProps as ei, guardReactiveProps as ti, defineAsyncComponent as ii, onMounted as Xe, nextTick as Ct, resolveDynamicComponent as Rt, toHandlers as si, Fragment as Tt, renderList as zt, normalizeStyle as at, mergeModels as lt, useModel as ri, getCurrentInstance as ni } from "vue";
+import { stripUnknownFilters as oi, Timeframe as ai, TimePeriods as Dt, TIMEFRAME_LOOKUP as li, formatTime as ht, msToGranularity as dt, getFieldDataSources as hi } from "@kong-ui-public/analytics-utilities";
+import { SimpleChart as di, AnalyticsChart as ui, TopNTable as ci, CsvExportModal as fi } from "@kong-ui-public/analytics-chart";
+import gi from "swrv";
 import "axios";
-import { createI18n as gi, i18nTComponent as mi } from "@kong-ui-public/i18n";
+import { createI18n as mi, i18nTComponent as pi } from "@kong-ui-public/i18n";
 import { useAnalyticsConfigStore as kt } from "@kong-ui-public/analytics-config-store";
-import { VisibilityOffIcon as pi, WarningIcon as yi, EditIcon as vi, MoreIcon as _i } from "@kong/icons";
-import { MetricsProvider as bi, MetricsConsumer as wi } from "@kong-ui-public/analytics-metric-provider";
+import { VisibilityOffIcon as yi, WarningIcon as vi, EditIcon as _i, MoreIcon as bi } from "@kong/icons";
+import { MetricsProvider as wi, MetricsConsumer as Ei } from "@kong-ui-public/analytics-metric-provider";
 var St = /* @__PURE__ */ ((c) => (c.VALIDATING = "VALIDATING", c.VALIDATING_HAS_DATA = "VALIDATING_HAS_DATA", c.PENDING = "PENDING", c.SUCCESS = "SUCCESS", c.SUCCESS_HAS_DATA = "SUCCESS_HAS_DATA", c.ERROR = "ERROR", c.STALE_IF_ERROR = "STALE_IF_ERROR", c))(St || {});
-const Ei = (c) => {
+const xi = (c) => {
   var e, t, i, s, r;
   return c ? !!// TODO: revisit: currently only the first check ever matters?
   ((e = Object.keys(c)) != null && e.length || (t = c.data) != null && t.length || (s = (i = c.data) == null ? void 0 : i.data) != null && s.length || !((r = c.data) != null && r.data) && typeof c.data == "object" && Object.keys(c == null ? void 0 : c.data).length) : !1;
 };
-function xi(c = G({}), e, t, i = Ei) {
+function Ci(c = G({}), e, t, i = xi) {
   const s = G(
     "PENDING"
     /* PENDING */
@@ -65,7 +65,7 @@ function xi(c = G({}), e, t, i = Ei) {
     swrvState: St
   };
 }
-const Ci = {
+const Ri = {
   noQueryBridge: "No query bridge provided.  Unable to render dashboard.",
   trendRange: {
     "24h": "Last 24-hour summary",
@@ -76,14 +76,14 @@ const Ci = {
   duplicateTile: "Duplicate",
   remove: "Remove",
   delete: "Delete"
-}, Ri = {
+}, Ti = {
   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."
-}, Ti = {
+}, zi = {
   defaultFilename: "Chart export",
   exportAsCsv: "Export as CSV"
-}, zi = "Explore", Di = "View requests", ki = "This tile was configured with {savedGranularity} granularity, which is no longer available. It now shows {currentGranularity} data, the closest available granularity.", Si = {
+}, Di = "Explore", ki = "View requests", Si = "This tile was configured with {savedGranularity} granularity, which is no longer available. It now shows {currentGranularity} data, the closest available granularity.", Ni = {
   daily: "1 day",
   fiveMinutely: "5 minutes",
   hourly: "1 hour",
@@ -96,31 +96,31 @@ const Ci = {
   twoHourly: "2 hours",
   weekly: "1 week",
   unknown: "Unknown"
-}, Ni = {
-  renderer: Ci,
-  queryDataProvider: Ri,
-  csvExport: Ti,
-  jumpToExplore: zi,
-  jumpToRequests: Di,
-  query_aged_out_warning: ki,
-  granularities: Si
+}, Oi = {
+  renderer: Ri,
+  queryDataProvider: Ti,
+  csvExport: zi,
+  jumpToExplore: Di,
+  jumpToRequests: ki,
+  query_aged_out_warning: Si,
+  granularities: Ni
 };
-function Oi() {
-  const c = gi("en-us", Ni);
+function Ai() {
+  const c = mi("en-us", Oi);
   return {
     i18n: c,
-    i18nT: mi(c)
+    i18nT: pi(c)
     // Translation component <i18n-t>
   };
 }
-const $e = 170, Nt = 6, ue = "analytics-query-provider", ut = "{entity-id}", Ai = "{cp-id}", Hi = "{timeframe}", Li = 30 * 1e3;
-function Ii() {
+const $e = 170, Nt = 6, ue = "analytics-query-provider", ut = "{entity-id}", Hi = "{cp-id}", Li = "{timeframe}", Ii = 30 * 1e3;
+function Mi() {
   const c = _e(ue);
   return {
     evaluateFeatureFlag: (t, i) => c ? c.evaluateFeatureFlagFn(t, i) : i
   };
 }
-function Mi(c) {
+function qi(c) {
   return c && c.__esModule && Object.prototype.hasOwnProperty.call(c, "default") ? c.default : c;
 }
 var Ot = { exports: {} };
@@ -163,7 +163,7 @@ var Ot = { exports: {} };
   }, n.prototype.emit = function(l, d, a, f, m, g) {
     var v = t ? t + l : l;
     if (!this._events[v]) return !1;
-    var p = this._events[v], R = arguments.length, A, T;
+    var p = this._events[v], R = arguments.length, O, T;
     if (p.fn) {
       switch (p.once && this.removeListener(l, p.fn, void 0, !0), R) {
         case 1:
@@ -179,12 +179,12 @@ var Ot = { exports: {} };
         case 6:
           return p.fn.call(p.context, d, a, f, m, g), !0;
       }
-      for (T = 1, A = new Array(R - 1); T < R; T++)
-        A[T - 1] = arguments[T];
-      p.fn.apply(p.context, A);
+      for (T = 1, O = new Array(R - 1); T < R; T++)
+        O[T - 1] = arguments[T];
+      p.fn.apply(p.context, O);
     } else {
-      var H = p.length, E;
-      for (T = 0; T < H; T++)
+      var P = p.length, E;
+      for (T = 0; T < P; T++)
         switch (p[T].once && this.removeListener(l, p[T].fn, void 0, !0), R) {
           case 1:
             p[T].fn.call(p[T].context);
@@ -199,9 +199,9 @@ var Ot = { exports: {} };
             p[T].fn.call(p[T].context, d, a, f);
             break;
           default:
-            if (!A) for (E = 1, A = new Array(R - 1); E < R; E++)
-              A[E - 1] = arguments[E];
-            p[T].fn.apply(p[T].context, A);
+            if (!O) for (E = 1, O = new Array(R - 1); E < R; E++)
+              O[E - 1] = arguments[E];
+            p[T].fn.apply(p[T].context, O);
         }
     }
     return !0;
@@ -228,23 +228,23 @@ var Ot = { exports: {} };
     return l ? (d = t ? t + l : l, this._events[d] && o(this, d)) : (this._events = new i(), this._eventsCount = 0), this;
   }, n.prototype.off = n.prototype.removeListener, n.prototype.addListener = n.prototype.on, n.prefixed = t, n.EventEmitter = n, c.exports = n;
 })(Ot);
-var qi = Ot.exports;
-const Pi = /* @__PURE__ */ Mi(qi);
+var Pi = Ot.exports;
+const $i = /* @__PURE__ */ qi(Pi);
 class At extends Error {
   constructor(e) {
     super(e), this.name = "TimeoutError";
   }
 }
-class $i extends Error {
+class Bi extends Error {
   constructor(e) {
     super(), this.name = "AbortError", this.message = e;
   }
 }
-const ct = (c) => globalThis.DOMException === void 0 ? new $i(c) : new DOMException(c), ft = (c) => {
+const ct = (c) => globalThis.DOMException === void 0 ? new Bi(c) : new DOMException(c), ft = (c) => {
   const e = c.reason === void 0 ? ct("This operation was aborted.") : c.reason;
   return e instanceof Error ? e : ct(e);
 };
-function Bi(c, e) {
+function Gi(c, e) {
   const {
     milliseconds: t,
     fallback: i,
@@ -290,7 +290,7 @@ function Bi(c, e) {
     r.clearTimeout.call(void 0, o), o = void 0;
   }, l;
 }
-function Gi(c, e, t) {
+function Ui(c, e, t) {
   let i = 0, s = c.length;
   for (; s > 0; ) {
     const r = Math.trunc(s / 2);
@@ -299,10 +299,10 @@ function Gi(c, e, t) {
   }
   return i;
 }
-var Q;
-class Ui {
+var Z;
+class Fi {
   constructor() {
-    $(this, Q, []);
+    $(this, Z, []);
   }
   enqueue(e, t) {
     t = {
@@ -314,34 +314,34 @@ class Ui {
       id: t.id,
       run: e
     };
-    if (this.size === 0 || _(this, Q)[this.size - 1].priority >= t.priority) {
-      _(this, Q).push(i);
+    if (this.size === 0 || _(this, Z)[this.size - 1].priority >= t.priority) {
+      _(this, Z).push(i);
       return;
     }
-    const s = Gi(_(this, Q), i, (r, o) => o.priority - r.priority);
-    _(this, Q).splice(s, 0, i);
+    const s = Ui(_(this, Z), i, (r, o) => o.priority - r.priority);
+    _(this, Z).splice(s, 0, i);
   }
   setPriority(e, t) {
-    const i = _(this, Q).findIndex((r) => r.id === e);
+    const i = _(this, Z).findIndex((r) => r.id === e);
     if (i === -1)
       throw new ReferenceError(`No promise function with the id "${e}" exists in the queue.`);
-    const [s] = _(this, Q).splice(i, 1);
+    const [s] = _(this, Z).splice(i, 1);
     this.enqueue(s.run, { priority: t, id: e });
   }
   dequeue() {
-    const e = _(this, Q).shift();
+    const e = _(this, Z).shift();
     return e == null ? void 0 : e.run;
   }
   filter(e) {
-    return _(this, Q).filter((t) => t.priority === e.priority).map((t) => t.run);
+    return _(this, Z).filter((t) => t.priority === e.priority).map((t) => t.run);
   }
   get size() {
-    return _(this, Q).length;
+    return _(this, Z).length;
   }
 }
-Q = new WeakMap();
-var fe, ge, le, Re, me, Te, Z, pe, F, ze, J, ye, oe, De, qe, z, Ht, Lt, It, Mt, qt, Se, Fe, We, Ne, Pt, Oe;
-class Fi extends Pi {
+Z = new WeakMap();
+var fe, ge, he, Re, me, Te, J, pe, F, ze, ee, ye, ae, De, qe, z, Ht, Lt, It, Mt, qt, Se, Ue, Fe, Ne, Pt, Oe;
+class Wi extends $i {
   // TODO: The `throwOnTimeout` option should affect the return types of `add()` and `addAll()`
   constructor(t) {
     var i, s;
@@ -349,18 +349,18 @@ class Fi extends Pi {
     $(this, z);
     $(this, fe);
     $(this, ge);
-    $(this, le, 0);
+    $(this, he, 0);
     $(this, Re);
     $(this, me);
     $(this, Te, 0);
-    $(this, Z);
+    $(this, J);
     $(this, pe);
     $(this, F);
     $(this, ze);
-    $(this, J, 0);
+    $(this, ee, 0);
     // The `!` is needed because of https://github.com/microsoft/TypeScript/issues/32194
     $(this, ye);
-    $(this, oe);
+    $(this, ae);
     $(this, De);
     // Use to assign a unique identifier to a promise function, if not explicitly specified
     $(this, qe, 1n);
@@ -369,20 +369,20 @@ class Fi extends Pi {
     
         Applies to each future operation.
         */
-    at(this, "timeout");
+    ot(this, "timeout");
     if (t = {
       carryoverConcurrencyCount: !1,
       intervalCap: Number.POSITIVE_INFINITY,
       interval: 0,
       concurrency: Number.POSITIVE_INFINITY,
       autoStart: !0,
-      queueClass: Ui,
+      queueClass: Fi,
       ...t
     }, !(typeof t.intervalCap == "number" && t.intervalCap >= 1))
       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, fe, t.carryoverConcurrencyCount), I(this, ge, t.intervalCap === Number.POSITIVE_INFINITY || t.interval === 0), I(this, Re, t.intervalCap), I(this, me, t.interval), I(this, F, new t.queueClass()), I(this, ze, t.queueClass), this.concurrency = t.concurrency, this.timeout = t.timeout, I(this, De, t.throwOnTimeout === !0), I(this, oe, t.autoStart === !1);
+    L(this, fe, t.carryoverConcurrencyCount), L(this, ge, t.intervalCap === Number.POSITIVE_INFINITY || t.interval === 0), L(this, Re, t.intervalCap), L(this, me, t.interval), L(this, F, new t.queueClass()), L(this, ze, t.queueClass), this.concurrency = t.concurrency, this.timeout = t.timeout, L(this, De, t.throwOnTimeout === !0), L(this, ae, t.autoStart === !1);
   }
   get concurrency() {
     return _(this, ye);
@@ -390,7 +390,7 @@ class Fi extends Pi {
   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, ye, t), B(this, z, Ne).call(this);
+    L(this, ye, t), B(this, z, Ne).call(this);
   }
   /**
       Updates the priority of a promise function by its id, affecting its execution order. Requires a defined concurrency limit to take effect.
@@ -439,11 +439,11 @@ class Fi extends Pi {
     }, new Promise((s, r) => {
       _(this, F).enqueue(async () => {
         var o;
-        we(this, J)._++, we(this, le)._++;
+        we(this, ee)._++, we(this, he)._++;
         try {
           (o = i.signal) == null || o.throwIfAborted();
           let n = t({ signal: i.signal });
-          i.timeout && (n = Bi(Promise.resolve(n), { milliseconds: i.timeout })), i.signal && (n = Promise.race([n, B(this, z, Pt).call(this, i.signal)]));
+          i.timeout && (n = Gi(Promise.resolve(n), { milliseconds: i.timeout })), i.signal && (n = Promise.race([n, B(this, z, Pt).call(this, i.signal)]));
           const h = await n;
           s(h), this.emit("completed", h);
         } catch (n) {
@@ -465,19 +465,19 @@ class Fi extends Pi {
   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, oe) ? (I(this, oe, !1), B(this, z, Ne).call(this), this) : this;
+    return _(this, ae) ? (L(this, ae, !1), B(this, z, Ne).call(this), this) : this;
   }
   /**
   Put queue execution on hold.
   */
   pause() {
-    I(this, oe, !0);
+    L(this, ae, !0);
   }
   /**
   Clear the queue.
   */
   clear() {
-    I(this, F, new (_(this, ze))());
+    L(this, F, new (_(this, ze))());
   }
   /**
       Can be called multiple times. Useful if you for example add additional items at a later time.
@@ -503,7 +503,7 @@ class Fi extends Pi {
       @returns A promise that settles when the queue becomes empty, and all promises have completed; `queue.size === 0 && queue.pending === 0`.
       */
   async onIdle() {
-    _(this, J) === 0 && _(this, F).size === 0 || await B(this, z, Oe).call(this, "idle");
+    _(this, ee) === 0 && _(this, F).size === 0 || await B(this, z, Oe).call(this, "idle");
   }
   /**
   Size of the queue, the number of queued items waiting to run.
@@ -523,52 +523,52 @@ class Fi extends Pi {
   Number of running items (no longer in the queue).
   */
   get pending() {
-    return _(this, J);
+    return _(this, ee);
   }
   /**
   Whether the queue is currently paused.
   */
   get isPaused() {
-    return _(this, oe);
+    return _(this, ae);
   }
 }
-fe = new WeakMap(), ge = new WeakMap(), le = new WeakMap(), Re = new WeakMap(), me = new WeakMap(), Te = new WeakMap(), Z = new WeakMap(), pe = new WeakMap(), F = new WeakMap(), ze = new WeakMap(), J = new WeakMap(), ye = new WeakMap(), oe = new WeakMap(), De = new WeakMap(), qe = new WeakMap(), z = new WeakSet(), Ht = function() {
-  return _(this, ge) || _(this, le) < _(this, Re);
+fe = new WeakMap(), ge = new WeakMap(), he = new WeakMap(), Re = new WeakMap(), me = new WeakMap(), Te = new WeakMap(), J = new WeakMap(), pe = new WeakMap(), F = new WeakMap(), ze = new WeakMap(), ee = new WeakMap(), ye = new WeakMap(), ae = new WeakMap(), De = new WeakMap(), qe = new WeakMap(), z = new WeakSet(), Ht = function() {
+  return _(this, ge) || _(this, he) < _(this, Re);
 }, Lt = function() {
-  return _(this, J) < _(this, ye);
+  return _(this, ee) < _(this, ye);
 }, It = function() {
-  we(this, J)._--, B(this, z, Se).call(this), this.emit("next");
+  we(this, ee)._--, B(this, z, Se).call(this), this.emit("next");
 }, Mt = function() {
-  B(this, z, We).call(this), B(this, z, Fe).call(this), I(this, pe, void 0);
+  B(this, z, Fe).call(this), B(this, z, Ue).call(this), L(this, pe, void 0);
 }, qt = function() {
   const t = Date.now();
-  if (_(this, Z) === void 0) {
+  if (_(this, J) === void 0) {
     const i = _(this, Te) - t;
     if (i < 0)
-      I(this, le, _(this, fe) ? _(this, J) : 0);
+      L(this, he, _(this, fe) ? _(this, ee) : 0);
     else
-      return _(this, pe) === void 0 && I(this, pe, setTimeout(() => {
+      return _(this, pe) === void 0 && L(this, pe, setTimeout(() => {
         B(this, z, Mt).call(this);
       }, i)), !0;
   }
   return !1;
 }, Se = function() {
   if (_(this, F).size === 0)
-    return _(this, Z) && clearInterval(_(this, Z)), I(this, Z, void 0), this.emit("empty"), _(this, J) === 0 && this.emit("idle"), !1;
-  if (!_(this, oe)) {
+    return _(this, J) && clearInterval(_(this, J)), L(this, J, void 0), this.emit("empty"), _(this, ee) === 0 && this.emit("idle"), !1;
+  if (!_(this, ae)) {
     const t = !_(this, z, qt);
     if (_(this, z, Ht) && _(this, z, Lt)) {
       const i = _(this, F).dequeue();
-      return i ? (this.emit("active"), i(), t && B(this, z, Fe).call(this), !0) : !1;
+      return i ? (this.emit("active"), i(), t && B(this, z, Ue).call(this), !0) : !1;
     }
   }
   return !1;
+}, Ue = function() {
+  _(this, ge) || _(this, J) !== void 0 || (L(this, J, setInterval(() => {
+    B(this, z, Fe).call(this);
+  }, _(this, me))), L(this, Te, Date.now() + _(this, me)));
 }, Fe = function() {
-  _(this, ge) || _(this, Z) !== void 0 || (I(this, Z, setInterval(() => {
-    B(this, z, We).call(this);
-  }, _(this, me))), I(this, Te, Date.now() + _(this, me)));
-}, We = function() {
-  _(this, le) === 0 && _(this, J) === 0 && _(this, Z) && (clearInterval(_(this, Z)), I(this, Z, void 0)), I(this, le, _(this, fe) ? _(this, J) : 0), B(this, z, Ne).call(this);
+  _(this, he) === 0 && _(this, ee) === 0 && _(this, J) && (clearInterval(_(this, J)), L(this, J, void 0)), L(this, he, _(this, fe) ? _(this, ee) : 0), B(this, z, Ne).call(this);
 }, /**
 Executes all queued functions until it reaches the limit.
 */
@@ -589,7 +589,7 @@ Ne = function() {
     this.on(t, r);
   });
 };
-const Wi = () => {
+const Vi = () => {
   const c = kt(), e = _e(ue);
   if (!e)
     return;
@@ -597,7 +597,7 @@ const Wi = () => {
     console.warn("Detected incorrect use of useRequestQueue.  This composable should not be used in nested components.  Please discuss with team-data or report an issue if you feel you have a use case.");
     return;
   }
-  const t = new Fi({
+  const t = new Wi({
     carryoverConcurrencyCount: !0,
     concurrency: c.maxParallelRequests,
     interval: c.requestInterval,
@@ -607,12 +607,12 @@ const Wi = () => {
     queryFnOverride: !0,
     queryFn: (s, r) => t.add(() => e.queryFn(s, r), { throwOnTimeout: !0 })
   };
-  Zt(ue, i);
+  Jt(ue, i);
 }, ve = {
-  useI18n: Oi,
-  useEvaluateFeatureFlag: Ii,
-  useRequestQueue: Wi
-}, Ze = /* @__PURE__ */ j({
+  useI18n: Ai,
+  useEvaluateFeatureFlag: Mi,
+  useRequestQueue: Vi
+}, Qe = /* @__PURE__ */ X({
   __name: "QueryDataProvider",
   props: {
     context: {},
@@ -623,38 +623,38 @@ const Wi = () => {
   emits: ["chart-data", "queryComplete"],
   setup(c, { emit: e }) {
     const t = c, i = e, { i18n: s } = ve.useI18n(), r = _e(ue), o = () => t.queryReady && r ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, n = new AbortController();
-    Ve(() => {
+    We(() => {
       n.abort();
     });
-    const h = (R, A, T) => {
-      const H = [];
-      return A && H.push(...A), H.push(...ni(R, T)), H;
-    }, { data: l, error: d, isValidating: a } = fi(o, async () => {
-      var R, A, T, H;
+    const h = (R, O, T) => {
+      const P = [];
+      return O && P.push(...O), P.push(...oi(R, T)), P;
+    }, { data: l, error: d, isValidating: a } = gi(o, async () => {
+      var R, O, T, P;
       try {
         let {
           datasource: E,
           ...x
         } = t.query;
         E || (E = "basic");
-        const O = h(E, t.query.filters, t.context.filters);
-        let D = t.query.time_range;
-        D ? D.tz || (D = {
-          ...D,
+        const A = h(E, t.query.filters, t.context.filters);
+        let N = t.query.time_range;
+        N ? N.tz || (N = {
+          ...N,
           tz: t.context.tz
-        }) : D = {
+        }) : N = {
           ...t.context.timeSpec,
           tz: t.context.tz
         };
-        const P = {
+        const M = {
           datasource: E,
           query: {
             ...x,
-            time_range: D,
-            filters: O
+            time_range: N,
+            filters: A
           }
-        }, ee = await (r == null ? void 0 : r.queryFn(P, n));
-        return g.value = null, ee;
+        }, V = await (r == null ? void 0 : r.queryFn(M, n));
+        return g.value = null, V;
       } catch (E) {
         throw (E == null ? void 0 : E.status) === 403 ? g.value = {
           message: s.t("queryDataProvider.forbidden"),
@@ -662,11 +662,11 @@ const Wi = () => {
         } : (E == null ? void 0 : E.status) === 408 ? g.value = {
           message: s.t("queryDataProvider.timeout"),
           type: "timeout"
-        } : ((A = (R = E == null ? void 0 : E.response) == null ? void 0 : R.data) == null ? void 0 : A.message) === "Range not allowed for this tier" ? g.value = {
+        } : ((O = (R = E == null ? void 0 : E.response) == null ? void 0 : R.data) == null ? void 0 : O.message) === "Range not allowed for this tier" ? g.value = {
           message: s.t("queryDataProvider.timeRangeExceeded"),
           type: "range_exceeded"
         } : g.value = {
-          message: ((H = (T = E == null ? void 0 : E.response) == null ? void 0 : T.data) == null ? void 0 : H.message) || (E == null ? void 0 : E.message),
+          message: ((P = (T = E == null ? void 0 : E.response) == null ? void 0 : T.data) == null ? void 0 : P.message) || (E == null ? void 0 : E.message),
           type: "other"
         }, E;
       } finally {
@@ -676,17 +676,17 @@ const Wi = () => {
       refreshInterval: t.context.refreshInterval,
       revalidateOnFocus: !1,
       shouldRetryOnError: !1
-    }), { state: f, swrvState: m } = xi(l, d, a), g = G(null), v = N(() => f.value === m.ERROR || !!g.value), p = N(() => !t.queryReady || f.value === m.PENDING);
-    return Ke(l, (R) => {
+    }), { state: f, swrvState: m } = Ci(l, d, a), g = G(null), v = S(() => f.value === m.ERROR || !!g.value), p = S(() => !t.queryReady || f.value === m.PENDING);
+    return Ve(l, (R) => {
       R && i("chart-data", R);
-    }), (R, A) => {
+    }), (R, O) => {
       var E;
-      const T = he("KSkeleton"), H = he("KEmptyState");
-      return p.value || !k(l) && !v.value ? (C(), M(T, {
+      const T = de("KSkeleton"), P = de("KEmptyState");
+      return p.value || !D(l) && !v.value ? (C(), I(T, {
         key: 0,
         class: "chart-skeleton",
         type: "table"
-      })) : v.value && ((E = g.value) == null ? void 0 : E.type) === "forbidden" ? (C(), M(H, {
+      })) : v.value && ((E = g.value) == null ? void 0 : E.type) === "forbidden" ? (C(), I(P, {
         key: 1,
         "action-button-visible": !1,
         "data-testid": "chart-forbidden-state"
@@ -695,10 +695,10 @@ const Wi = () => {
           Ee(te(g.value.message), 1)
         ]),
         icon: q(() => [
-          se(k(pi))
+          se(D(yi))
         ]),
         _: 1
-      })) : v.value ? (C(), M(H, {
+      })) : v.value ? (C(), I(P, {
         key: 2,
         "action-button-visible": !1,
         "data-testid": "chart-empty-state",
@@ -711,13 +711,13 @@ const Wi = () => {
           ];
         }),
         _: 1
-      })) : k(l) ? Pe(R.$slots, "default", {
+      })) : D(l) ? Pe(R.$slots, "default", {
         key: 3,
-        data: k(l)
-      }) : Y("", !0);
+        data: D(l)
+      }) : j("", !0);
     };
   }
-}), Vi = /* @__PURE__ */ j({
+}), Ki = /* @__PURE__ */ X({
   __name: "SimpleChartRenderer",
   props: {
     query: {},
@@ -729,21 +729,21 @@ const Wi = () => {
     requestsLink: {}
   },
   setup(c) {
-    Ye((i) => ({
+    Ke((i) => ({
       "088169ae": `${i.height}px`
     }));
-    const e = c, t = N(() => e.chartOptions.type === "single_value");
-    return (i, s) => (C(), M(Ze, {
+    const e = c, t = S(() => e.chartOptions.type === "single_value");
+    return (i, s) => (C(), I(Qe, {
       context: i.context,
       query: i.query,
       "query-ready": i.queryReady,
       "refresh-counter": i.refreshCounter
     }, {
       default: q(({ data: r }) => [
-        ae("div", {
-          class: je(["analytics-chart", { "single-value": t.value }])
+        le("div", {
+          class: Ye(["analytics-chart", { "single-value": t.value }])
         }, [
-          se(k(hi), {
+          se(D(di), {
             "chart-data": r,
             "chart-options": i.chartOptions,
             "synthetics-data-key": t.value ? void 0 : i.chartOptions.synthetics_data_key
@@ -758,7 +758,7 @@ const Wi = () => {
   for (const [i, s] of e)
     t[i] = s;
   return t;
-}, gt = /* @__PURE__ */ ce(Vi, [["__scopeId", "data-v-1e9ff912"]]), Ki = { class: "analytics-chart" }, Yi = /* @__PURE__ */ j({
+}, gt = /* @__PURE__ */ ce(Ki, [["__scopeId", "data-v-1e9ff912"]]), Yi = { class: "analytics-chart" }, ji = /* @__PURE__ */ X({
   __name: "BaseAnalyticsChartRenderer",
   props: {
     query: {},
@@ -772,19 +772,19 @@ const Wi = () => {
   },
   emits: ["edit-tile", "chart-data", "zoom-time-range", "view-requests", "select-chart-range"],
   setup(c, { emit: e }) {
-    const t = c, i = e, { i18n: s } = ve.useI18n(), { evaluateFeatureFlag: r } = ve.useEvaluateFeatureFlag(), o = r("ma-4135-allow-zooming-all-dashboard-tiles", !1), n = N(() => ({
+    const t = c, i = e, { i18n: s } = ve.useI18n(), { evaluateFeatureFlag: r } = ve.useEvaluateFeatureFlag(), o = r("ma-4135-allow-zooming-all-dashboard-tiles", !1), n = S(() => ({
       type: t.chartOptions.type,
       stacked: t.chartOptions.stacked ?? !1,
       chartDatasetColors: t.chartOptions.chart_dataset_colors,
       threshold: t.chartOptions.threshold
-    })), h = N(() => o ? t.context.zoomable : t.context.zoomable && !t.query.time_range), l = () => {
+    })), h = S(() => o ? t.context.zoomable : t.context.zoomable && !t.query.time_range), l = () => {
       i("edit-tile");
     }, d = (a) => {
       i("chart-data", a);
     };
     return (a, f) => {
-      const m = he("KDropdownItem");
-      return C(), M(Ze, {
+      const m = de("KDropdownItem");
+      return C(), I(Qe, {
         context: a.context,
         query: a.query,
         "query-ready": a.queryReady,
@@ -792,41 +792,39 @@ const Wi = () => {
         onChartData: d
       }, {
         default: q(({ data: g }) => [
-          ae("div", Ki, [
-            se(k(di), xt({
-              "allow-csv-export": a.chartOptions.allow_csv_export,
+          le("div", Yi, [
+            se(D(ui), xt({
               "chart-data": g,
               "chart-options": n.value,
               "legend-position": "bottom",
               "requests-link": a.requestsLink,
-              "show-menu": a.context.editable,
               "synthetics-data-key": a.chartOptions.synthetics_data_key,
               "timeseries-zoom": h.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))
-            }), Xe({ _: 2 }, [
+            }), je({ _: 2 }, [
               a.context.editable ? {
                 name: "menu-items",
                 fn: q(() => [
                   se(m, { onClick: l }, {
                     default: q(() => [
-                      Ee(te(k(s).t("renderer.edit")), 1)
+                      Ee(te(D(s).t("renderer.edit")), 1)
                     ]),
                     _: 1
                   })
                 ]),
                 key: "0"
               } : void 0
-            ]), 1040, ["allow-csv-export", "chart-data", "chart-options", "requests-link", "show-menu", "synthetics-data-key", "timeseries-zoom"])
+            ]), 1040, ["chart-data", "chart-options", "requests-link", "synthetics-data-key", "timeseries-zoom"])
           ])
         ]),
         _: 1
       }, 8, ["context", "query", "query-ready", "refresh-counter"]);
     };
   }
-}), Je = /* @__PURE__ */ ce(Yi, [["__scopeId", "data-v-9d4f6602"]]), mt = /* @__PURE__ */ j({
+}), Ze = /* @__PURE__ */ ce(ji, [["__scopeId", "data-v-959ffa20"]]), mt = /* @__PURE__ */ X({
   __name: "BarChartRenderer",
   props: {
     query: {},
@@ -838,7 +836,7 @@ const Wi = () => {
     requestsLink: {}
   },
   setup(c) {
-    return (e, t) => (C(), M(Je, {
+    return (e, t) => (C(), I(Ze, {
       "chart-options": e.chartOptions,
       context: e.context,
       "extra-props": { showAnnotations: !1 },
@@ -848,7 +846,7 @@ const Wi = () => {
       "refresh-counter": e.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), pt = /* @__PURE__ */ j({
+}), pt = /* @__PURE__ */ X({
   __name: "TimeseriesChartRenderer",
   props: {
     query: {},
@@ -862,7 +860,7 @@ const Wi = () => {
   emits: ["zoom-time-range", "select-chart-range"],
   setup(c, { emit: e }) {
     const t = e;
-    return (i, s) => (C(), M(Je, {
+    return (i, s) => (C(), I(Ze, {
       "chart-options": i.chartOptions,
       context: i.context,
       height: i.height,
@@ -874,7 +872,7 @@ const Wi = () => {
       onZoomTimeRange: s[1] || (s[1] = (r) => t("zoom-time-range", r))
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter", "requests-link"]));
   }
-}), ji = { class: "metric-card-tile-wrapper" }, Xi = /* @__PURE__ */ j({
+}), Xi = { class: "metric-card-tile-wrapper" }, Qi = /* @__PURE__ */ X({
   __name: "GoldenSignalsRenderer",
   props: {
     query: {},
@@ -886,10 +884,10 @@ const Wi = () => {
     requestsLink: {}
   },
   setup(c) {
-    const e = c, t = N(() => {
+    const e = c, t = S(() => {
       const s = e.context.timeSpec;
       if (s.type === "absolute")
-        return new oi({
+        return new ai({
           key: "custom",
           timeframeText: "custom",
           display: "custom",
@@ -905,7 +903,7 @@ const Wi = () => {
       if (!r)
         throw new Error("Unknown time range");
       return r;
-    }), i = N(() => {
+    }), i = S(() => {
       var r, o;
       const s = (r = e.query) == null ? void 0 : r.datasource;
       if (s && s !== "api_usage" && s !== "basic")
@@ -923,27 +921,27 @@ const Wi = () => {
         refreshCounter: e.refreshCounter
       };
     });
-    return (s, r) => (C(), W("div", ji, [
-      se(k(bi), Jt(ei(i.value)), {
+    return (s, r) => (C(), W("div", Xi, [
+      se(D(wi), ei(ti(i.value)), {
         default: q(() => [
-          se(k(wi))
+          se(D(Ei))
         ]),
         _: 1
       }, 16)
     ]));
   }
-}), Qi = /* @__PURE__ */ ce(Xi, [["__scopeId", "data-v-7e1b1cc1"]]), yt = "#6c7489", Zi = "12px", vt = "20px", $t = "20px", Ji = {
+}), Zi = /* @__PURE__ */ ce(Qi, [["__scopeId", "data-v-7e1b1cc1"]]), yt = "#6c7489", Ji = "12px", vt = "20px", $t = "20px", es = {
   class: "fallback-entity-link",
   "data-testid": "entity-link-parent"
-}, _t = /* @__PURE__ */ j({
+}, _t = /* @__PURE__ */ X({
   __name: "FallbackEntityLink",
   props: {
     entityLinkData: {}
   },
   setup(c) {
-    return (e, t) => (C(), W("div", Ji, te(e.entityLinkData.label), 1));
+    return (e, t) => (C(), W("div", es, te(e.entityLinkData.label), 1));
   }
-}), es = /* @__PURE__ */ j({
+}), ts = /* @__PURE__ */ X({
   __name: "TopNTableRenderer",
   props: {
     query: {},
@@ -955,7 +953,7 @@ const Wi = () => {
     requestsLink: {}
   },
   setup(c) {
-    const e = c, t = _e(ue), i = ti(async () => {
+    const e = c, t = _e(ue), i = ii(async () => {
       if (t != null && t.fetchComponent)
         try {
           return await t.fetchComponent("EntityLink");
@@ -968,26 +966,26 @@ const Wi = () => {
       if ((o = e.chartOptions) != null && o.entity_link)
         if (r.id.includes(":")) {
           const [n, h] = r.id.split(":");
-          return e.chartOptions.entity_link.replace(Ai, n).replace(ut, h);
+          return e.chartOptions.entity_link.replace(Hi, n).replace(ut, h);
         } else
           return e.chartOptions.entity_link.replace(ut, r.id);
       return "";
     };
-    return (r, o) => (C(), M(Ze, {
+    return (r, o) => (C(), I(Qe, {
       context: r.context,
       query: r.query,
       "query-ready": r.queryReady,
       "refresh-counter": r.refreshCounter
     }, {
       default: q(({ data: n }) => [
-        se(k(ui), {
+        se(D(ci), {
           data: n,
           "synthetics-data-key": r.chartOptions.synthetics_data_key
-        }, Xe({ _: 2 }, [
+        }, je({ _: 2 }, [
           e.chartOptions.entity_link ? {
             name: "name",
             fn: q(({ record: h }) => [
-              se(k(i), {
+              se(D(i), {
                 "entity-link-data": {
                   id: h.id,
                   label: h.name,
@@ -1003,7 +1001,7 @@ const Wi = () => {
       _: 1
     }, 8, ["context", "query", "query-ready", "refresh-counter"]));
   }
-}), ts = /* @__PURE__ */ j({
+}), is = /* @__PURE__ */ X({
   __name: "DonutChartRenderer",
   props: {
     query: {},
@@ -1015,7 +1013,7 @@ const Wi = () => {
     requestsLink: {}
   },
   setup(c) {
-    return (e, t) => (C(), M(Je, {
+    return (e, t) => (C(), I(Ze, {
       "chart-options": e.chartOptions,
       context: e.context,
       height: e.height,
@@ -1024,10 +1022,10 @@ const Wi = () => {
       "refresh-counter": e.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), is = ["data-testid"], ss = {
+}), ss = ["data-testid"], rs = {
   key: 0,
   class: "tile-header"
-}, rs = ["data-testid"], ns = { class: "badge-text" }, os = ["data-testid"], as = { class: "delete-option" }, ls = ["data-testid"], hs = ["data-testid"], ds = /* @__PURE__ */ j({
+}, ns = ["data-testid"], os = { class: "badge-text" }, as = ["data-testid"], ls = { class: "delete-option" }, hs = ["data-testid"], ds = ["data-testid"], us = /* @__PURE__ */ X({
   __name: "DashboardTile",
   props: {
     definition: {},
@@ -1039,58 +1037,58 @@ const Wi = () => {
   },
   emits: ["edit-tile", "duplicate-tile", "remove-tile", "tile-time-range-zoom"],
   setup(c, { emit: e }) {
-    Ye((y) => ({
-      "3ec3fc5c": `${y.height}px`
+    Ke((y) => ({
+      "832850d2": `${y.height}px`
     }));
-    const t = parseInt($t, 10), i = c, s = e, r = _e(ue), o = r == null ? void 0 : r.evaluateFeatureFlagFn("analytics-chart-zoom-actions", !1), { i18n: n } = ve.useI18n(), h = G(), l = G(!1), d = G(), a = G(!1), f = G(""), m = G(""), g = G(void 0);
-    Qe(async () => {
-      var y, S;
-      f.value = await ((y = r == null ? void 0 : r.exploreBaseUrl) == null ? void 0 : y.call(r)) ?? "", m.value = await ((S = r == null ? void 0 : r.requestsBaseUrl) == null ? void 0 : S.call(r)) ?? "";
-    }), Ke(() => i.definition, async () => {
-      await Ct(), d.value && (a.value = d.value.scrollWidth > d.value.clientWidth);
+    const t = parseInt($t, 10), i = c, s = e, r = _e(ue), o = r == null ? void 0 : r.evaluateFeatureFlagFn("analytics-chart-zoom-actions", !1), { i18n: n } = ve.useI18n(), h = G(), l = G(!1), d = G(), a = G(!1), f = G(""), m = G(""), g = G(void 0), v = G(!0);
+    Xe(async () => {
+      var y, k;
+      f.value = await ((y = r == null ? void 0 : r.exploreBaseUrl) == null ? void 0 : y.call(r)) ?? "", m.value = await ((k = r == null ? void 0 : r.requestsBaseUrl) == null ? void 0 : k.call(r)) ?? "";
+    }), Ve(() => i.definition, async () => {
+      await Ct(), d.value && (a.value = d.value.scrollWidth > d.value.clientWidth), v.value = !0;
     }, { immediate: !0, deep: !0 });
-    const v = N(() => {
-      if (!f.value || !i.definition.query || !H.value)
+    const p = S(() => {
+      if (!f.value || !i.definition.query || !E.value)
         return "";
-      const y = Gt.value, S = i.definition.query.dimensions ?? [], L = {
+      const y = Ut.value, k = i.definition.query.dimensions ?? [], H = {
         filters: y,
         metrics: i.definition.query.metrics ?? [],
-        dimensions: S,
+        dimensions: k,
         time_range: i.definition.query.time_range || i.context.timeSpec,
-        granularity: i.definition.query.granularity || ee.value
-      }, X = ["api_usage", "llm_usage"].includes(i.definition.query.datasource) ? i.definition.query.datasource : "api_usage";
-      return `${f.value}?q=${JSON.stringify(L)}&d=${X}&c=${i.definition.chart.type}`;
-    }), p = N(() => {
+        granularity: i.definition.query.granularity || oe.value
+      }, Q = ["api_usage", "llm_usage"].includes(i.definition.query.datasource) ? i.definition.query.datasource : "api_usage";
+      return `${f.value}?q=${JSON.stringify(H)}&d=${Q}&c=${i.definition.chart.type}`;
+    }), R = S(() => {
       var y;
       return m.value && i.definition.query && ((y = i.definition.query) == null ? void 0 : y.datasource) !== "llm_usage";
-    }), R = N(() => {
-      if (!p.value || !H.value)
+    }), O = S(() => {
+      if (!R.value || !E.value)
         return "";
-      const y = [...i.context.filters, ...i.definition.query.filters ?? []], S = st(
+      const y = [...i.context.filters, ...i.definition.query.filters ?? []], k = it(
         i.definition.query.time_range || i.context.timeSpec,
         y
       );
-      return `${m.value}?q=${JSON.stringify(S)}`;
-    }), A = N(() => n.t("csvExport.defaultFilename")), T = N(() => H.value && (E.value || i.context.editable) || !!P.value), H = N(() => !["golden_signals", "top_n", "gauge"].includes(i.definition.chart.type)), E = N(() => !!v.value || "allow_csv_export" in i.definition.chart && i.definition.chart.allow_csv_export || i.context.editable), x = {
+      return `${m.value}?q=${JSON.stringify(k)}`;
+    }), T = S(() => n.t("csvExport.defaultFilename")), P = S(() => E.value && (x.value || i.context.editable) || !!V.value), E = S(() => !["golden_signals", "top_n", "gauge"].includes(i.definition.chart.type)), x = S(() => !!p.value || "allow_csv_export" in i.definition.chart && i.definition.chart.allow_csv_export || i.context.editable), A = {
       timeseries_line: pt,
       timeseries_bar: pt,
       horizontal_bar: mt,
       vertical_bar: mt,
       gauge: gt,
-      donut: ts,
-      golden_signals: Qi,
-      top_n: es,
+      donut: is,
+      golden_signals: Zi,
+      top_n: ts,
       slottable: void 0,
       single_value: gt
-    }, O = N(() => {
-      var y, S;
+    }, N = S(() => {
+      var y, k;
       return {
-        ...(y = D.value) != null && y.rendererEvents.supportsRequests ? { "select-chart-range": jt } : {},
-        ...(S = D.value) != null && S.rendererEvents.supportsZoom ? { "zoom-time-range": Yt } : {}
+        ...(y = M.value) != null && y.rendererEvents.supportsRequests ? { "select-chart-range": Xt } : {},
+        ...(k = M.value) != null && k.rendererEvents.supportsZoom ? { "zoom-time-range": jt } : {}
       };
-    }), D = N(() => {
-      var X, V;
-      const y = x[i.definition.chart.type], S = !!((X = y == null ? void 0 : y.emits) != null && X.includes("select-chart-range")), L = !!((V = y == null ? void 0 : y.emits) != null && V.includes("zoom-time-range"));
+    }), M = S(() => {
+      var Q, K;
+      const y = A[i.definition.chart.type], k = !!((Q = y == null ? void 0 : y.emits) != null && Q.includes("select-chart-range")), H = !!((K = y == null ? void 0 : y.emits) != null && K.includes("zoom-time-range"));
       return y && {
         component: y,
         rendererProps: {
@@ -1103,84 +1101,86 @@ const Wi = () => {
           requestsLink: g.value
         },
         rendererEvents: {
-          supportsRequests: S,
-          supportsZoom: L
+          supportsRequests: k,
+          supportsZoom: H
         }
       };
-    }), P = N(() => {
-      var S;
-      const y = (S = i.definition.query) == null ? void 0 : S.time_range;
+    }), V = S(() => {
+      var k;
+      const y = (k = i.definition.query) == null ? void 0 : k.time_range;
       if ((y == null ? void 0 : y.type) === "relative") {
-        const L = Dt.get(ai[y.time_range]);
-        return L ? L.display : (console.warn("Did not recognize the given relative time range:", y.time_range), y.time_range);
+        const H = Dt.get(li[y.time_range]);
+        return H ? H.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 L = y.tz || "Etc/UTC";
-        return `${dt(y.start, { short: !0, tz: L })} - ${dt(y.end, { short: !0, tz: L })}`;
+        const H = y.tz || "Etc/UTC";
+        return `${ht(y.start, { short: !0, tz: H })} - ${ht(y.end, { short: !0, tz: H })}`;
       }
       return null;
-    }), ee = N(() => h.value ? Ue(h.value.meta.granularity_ms) : void 0), de = N(() => ["timeseries_line", "timeseries_bar"].includes(i.definition.chart.type)), be = N(() => {
-      var L;
-      const y = i.definition.query.granularity, S = Ue(((L = h.value) == null ? void 0 : L.meta.granularity_ms) || 0);
-      return de.value && y !== S;
-    }), ke = N(() => {
-      var L, X, V;
-      const y = Ue(((L = h.value) == null ? void 0 : L.meta.granularity_ms) ?? 0) ?? "unknown", S = ((V = (X = i.definition) == null ? void 0 : X.query) == null ? void 0 : V.granularity) ?? "unknown";
+    }), oe = S(() => h.value ? dt(h.value.meta.granularity_ms) : void 0), ke = S(() => ["timeseries_line", "timeseries_bar"].includes(i.definition.chart.type)), be = S(() => {
+      var k, H;
+      if (!ke.value || !i.queryReady || v.value)
+        return !1;
+      const y = (H = (k = i.definition) == null ? void 0 : k.query) == null ? void 0 : H.granularity;
+      return !y || !oe.value ? !1 : y !== oe.value;
+    }), Gt = S(() => {
+      var H, Q, K;
+      const y = dt(((H = h.value) == null ? void 0 : H.meta.granularity_ms) ?? 0) ?? "unknown", k = ((K = (Q = i.definition) == null ? void 0 : Q.query) == null ? void 0 : K.granularity) ?? "unknown";
       return n.t("query_aged_out_warning", {
         currentGranularity: n.t(`granularities.${y}`),
-        savedGranularity: n.t(`granularities.${S}`)
+        savedGranularity: n.t(`granularities.${k}`)
       });
-    }), Gt = N(() => {
-      var L, X;
-      const y = [...i.context.filters, ...i.definition.query.filters ?? []], S = ((X = (L = i.definition) == null ? void 0 : L.query) == null ? void 0 : X.datasource) ?? "api_usage";
-      return y.filter((V) => li(V.field).some((nt) => S === nt));
-    }), Ut = () => {
+    }), Ut = S(() => {
+      var H, Q;
+      const y = [...i.context.filters, ...i.definition.query.filters ?? []], k = ((Q = (H = i.definition) == null ? void 0 : H.query) == null ? void 0 : Q.datasource) ?? "api_usage";
+      return y.filter((K) => hi(K.field).some((rt) => k === rt));
+    }), Ft = () => {
       s("edit-tile", i.definition);
-    }, Ft = () => {
-      s("duplicate-tile", i.definition);
     }, Wt = () => {
+      s("duplicate-tile", i.definition);
+    }, Vt = () => {
       s("remove-tile", i.definition);
-    }, Vt = (y) => {
-      h.value = y;
-    }, it = (y) => {
+    }, Kt = (y) => {
+      h.value = y, v.value = !1;
+    }, tt = (y) => {
       l.value = y;
-    }, Kt = () => {
-      it(!0);
-    }, Yt = (y) => {
-      const S = {
+    }, Yt = () => {
+      tt(!0);
+    }, jt = (y) => {
+      const k = {
         tileId: i.tileId.toString(),
         timeRange: y
       };
-      s("tile-time-range-zoom", S);
-    }, st = (y, S) => ({
-      filter: S,
+      s("tile-time-range-zoom", k);
+    }, it = (y, k) => ({
+      filter: k,
       timeframe: {
         timePeriodsKey: y.type === "relative" ? y.time_range : "custom",
         start: y.type === "absolute" ? y.start : void 0,
         end: y.type === "absolute" ? y.end : void 0
       }
-    }), jt = (y) => {
-      if (!p.value) {
+    }), Xt = (y) => {
+      if (!R.value) {
         g.value = void 0;
         return;
       }
-      const S = [...i.context.filters, ...i.definition.query.filters ?? []], L = st(y, S);
-      g.value = { href: `${m.value}?q=${JSON.stringify(L)}` };
+      const k = [...i.context.filters, ...i.definition.query.filters ?? []], H = it(y, k);
+      g.value = { href: `${m.value}?q=${JSON.stringify(H)}` };
     };
-    return (y, S) => {
-      const L = he("KTooltip"), X = he("KBadge"), V = he("KDropdownItem"), rt = he("KDropdown");
+    return (y, k) => {
+      const H = de("KTooltip"), Q = de("KBadge"), K = de("KDropdownItem"), st = de("KDropdown");
       return C(), W("div", {
-        class: je(["tile-boundary", { editable: y.context.editable }]),
+        class: Ye(["tile-boundary", { editable: y.context.editable }]),
         "data-testid": `tile-${y.tileId}`
       }, [
-        y.definition.chart.type !== "slottable" ? (C(), W("div", ss, [
-          se(L, {
+        y.definition.chart.type !== "slottable" ? (C(), W("div", rs, [
+          se(H, {
             class: "title-tooltip",
             disabled: !a.value,
             "max-width": "500",
             text: y.definition.chart.chart_title
           }, {
             default: q(() => [
-              ae("div", {
+              le("div", {
                 ref_key: "titleRef",
                 ref: d,
                 class: "title"
@@ -1188,123 +1188,123 @@ const Wi = () => {
             ]),
             _: 1
           }, 8, ["disabled", "text"]),
-          T.value ? (C(), W("div", {
+          P.value ? (C(), W("div", {
             key: 0,
             class: "tile-actions",
             "data-testid": `tile-actions-${y.tileId}`
           }, [
-            P.value ? (C(), M(X, {
+            V.value ? (C(), I(Q, {
               key: 0,
               "data-testid": "time-range-badge",
-              tooltip: be.value ? ke.value : void 0,
+              tooltip: be.value ? Gt.value : void 0,
               "tooltip-attributes": { maxWidth: "320px" }
-            }, Xe({
+            }, je({
               default: q(() => [
-                ae("span", ns, te(P.value), 1)
+                le("span", os, te(V.value), 1)
               ]),
               _: 2
             }, [
               be.value ? {
                 name: "icon",
                 fn: q(() => [
-                  se(k(yi), { size: k(Zi) }, null, 8, ["size"])
+                  se(D(vi), { size: D(Ji) }, null, 8, ["size"])
                 ]),
                 key: "0"
               } : void 0
-            ]), 1032, ["tooltip"])) : Y("", !0),
-            H.value && y.context.editable ? (C(), M(k(vi), {
+            ]), 1032, ["tooltip"])) : j("", !0),
+            E.value && y.context.editable ? (C(), I(D(_i), {
               key: 1,
               class: "edit-icon",
-              color: k(yt),
+              color: D(yt),
               "data-testid": `edit-tile-${y.tileId}`,
-              size: k(vt),
-              onClick: Ut
-            }, null, 8, ["color", "data-testid", "size"])) : Y("", !0),
-            H.value && E.value ? (C(), M(rt, {
+              size: D(vt),
+              onClick: Ft
+            }, null, 8, ["color", "data-testid", "size"])) : j("", !0),
+            E.value && x.value ? (C(), I(st, {
               key: 2,
               class: "dropdown",
               "data-testid": `chart-action-menu-${y.tileId}`,
               "kpop-attributes": { placement: "bottom-end" }
             }, {
               items: q(() => [
-                v.value ? (C(), M(V, {
+                p.value ? (C(), I(K, {
                   key: 0,
                   "data-testid": `chart-jump-to-explore-${y.tileId}`,
-                  item: { label: k(n).t("jumpToExplore"), to: v.value }
-                }, null, 8, ["data-testid", "item"])) : Y("", !0),
-                k(o) && R.value ? (C(), M(V, {
+                  item: { label: D(n).t("jumpToExplore"), to: p.value }
+                }, null, 8, ["data-testid", "item"])) : j("", !0),
+                D(o) && O.value ? (C(), I(K, {
                   key: 1,
                   "data-testid": `chart-jump-to-requests-${y.tileId}`,
-                  item: { label: k(n).t("jumpToRequests"), to: R.value }
-                }, null, 8, ["data-testid", "item"])) : Y("", !0),
-                !("allowCsvExport" in y.definition.chart) || y.definition.chart.allowCsvExport ? (C(), M(V, {
+                  item: { label: D(n).t("jumpToRequests"), to: O.value }
+                }, null, 8, ["data-testid", "item"])) : j("", !0),
+                !("allow_csv_export" in y.definition.chart) || y.definition.chart.allow_csv_export ? (C(), I(K, {
                   key: 2,
                   class: "chart-export-button",
                   "data-testid": `chart-csv-export-${y.tileId}`,
-                  onClick: S[0] || (S[0] = (nt) => Kt())
+                  onClick: k[0] || (k[0] = (rt) => Yt())
                 }, {
                   default: q(() => [
-                    ae("span", {
+                    le("span", {
                       class: "chart-export-trigger",
                       "data-testid": `csv-export-button-${y.tileId}`
-                    }, te(k(n).t("csvExport.exportAsCsv")), 9, os)
+                    }, te(D(n).t("csvExport.exportAsCsv")), 9, as)
                   ]),
                   _: 1
-                }, 8, ["data-testid"])) : Y("", !0),
-                y.context.editable ? (C(), M(V, {
+                }, 8, ["data-testid"])) : j("", !0),
+                y.context.editable ? (C(), I(K, {
                   key: 3,
                   "data-testid": `duplicate-tile-${y.tileId}`,
-                  onClick: Ft
+                  onClick: Wt
                 }, {
                   default: q(() => [
-                    Ee(te(k(n).t("renderer.duplicateTile")), 1)
+                    Ee(te(D(n).t("renderer.duplicateTile")), 1)
                   ]),
                   _: 1
-                }, 8, ["data-testid"])) : Y("", !0),
-                y.context.editable ? (C(), M(V, {
+                }, 8, ["data-testid"])) : j("", !0),
+                y.context.editable ? (C(), I(K, {
                   key: 4,
                   "data-testid": `remove-tile-${y.tileId}`,
-                  onClick: Wt
+                  onClick: Vt
                 }, {
                   default: q(() => [
-                    ae("span", as, te(k(n).t("renderer.delete")), 1)
+                    le("span", ls, te(D(n).t("renderer.delete")), 1)
                   ]),
                   _: 1
-                }, 8, ["data-testid"])) : Y("", !0)
+                }, 8, ["data-testid"])) : j("", !0)
               ]),
               default: q(() => [
-                se(k(_i), {
+                se(D(bi), {
                   class: "kebab-action-menu",
-                  color: k(yt),
+                  color: D(yt),
                   "data-testid": `kebab-action-menu-${y.tileId}`,
-                  size: k(vt)
+                  size: D(vt)
                 }, null, 8, ["color", "data-testid", "size"])
               ]),
               _: 1
-            }, 8, ["data-testid"])) : Y("", !0)
-          ], 8, rs)) : "description" in y.definition.chart ? (C(), W("div", {
+            }, 8, ["data-testid"])) : j("", !0)
+          ], 8, ns)) : "description" in y.definition.chart ? (C(), W("div", {
             key: 1,
             class: "header-description",
             "data-testid": `tile-description-${y.tileId}`
-          }, te(y.definition.chart.description), 9, ls)) : Y("", !0),
-          l.value ? (C(), M(k(ci), {
+          }, te(y.definition.chart.description), 9, hs)) : j("", !0),
+          l.value ? (C(), I(D(fi), {
             key: 2,
             "chart-data": h.value,
             "data-testid": `csv-export-modal-${y.tileId}`,
-            filename: A.value,
-            onToggleModal: it
-          }, null, 8, ["chart-data", "data-testid", "filename"])) : Y("", !0)
-        ])) : Y("", !0),
-        ae("div", {
+            filename: T.value,
+            onToggleModal: tt
+          }, null, 8, ["chart-data", "data-testid", "filename"])) : j("", !0)
+        ])) : j("", !0),
+        le("div", {
           class: "tile-content",
           "data-testid": `tile-content-${y.tileId}`
         }, [
-          D.value ? (C(), M(Rt(D.value.component), xt({ key: 0 }, D.value.rendererProps, ii(O.value), { onChartData: Vt }), null, 16)) : Y("", !0)
-        ], 8, hs)
-      ], 10, is);
+          M.value ? (C(), I(Rt(M.value.component), xt({ key: 0 }, M.value.rendererProps, si(N.value), { onChartData: Kt }), null, 16)) : j("", !0)
+        ], 8, ds)
+      ], 10, ss);
     };
   }
-}), us = /* @__PURE__ */ ce(ds, [["__scopeId", "data-v-9ff83fdc"]]), cs = (c, e) => {
+}), cs = /* @__PURE__ */ ce(us, [["__scopeId", "data-v-fd9caf10"]]), fs = (c, e) => {
   let t = 0;
   const i = /* @__PURE__ */ new Map();
   e.forEach((r) => {
@@ -1315,7 +1315,7 @@ const Wi = () => {
   for (let r = 0; r < t; r++)
     i.get(r) ? s.push("auto") : s.push(`${c}px`);
   return s;
-}, fs = /* @__PURE__ */ j({
+}, gs = /* @__PURE__ */ X({
   __name: "GridLayout",
   props: {
     tileHeight: {
@@ -1329,8 +1329,8 @@ const Wi = () => {
     }
   },
   setup(c) {
-    Ye((n) => ({
-      "2a38e79e": k(Nt),
+    Ke((n) => ({
+      "2a38e79e": D(Nt),
       "4cc71de6": r.value
     }));
     const e = c, t = G(null), i = G(0), s = new ResizeObserver((n) => {
@@ -1338,12 +1338,12 @@ const Wi = () => {
         !Array.isArray(n) || !n.length || (i.value = n[0].contentRect.width);
       });
     });
-    Qe(() => {
+    Xe(() => {
       t.value && s.observe(t.value);
-    }), Ve(() => {
+    }), We(() => {
       t.value && s.unobserve(t.value);
     });
-    const r = N(() => cs(e.tileHeight, e.tiles).join(" ")), o = N(() => e.tiles.map((n, h) => ({
+    const r = S(() => fs(e.tileHeight, e.tiles).join(" ")), o = S(() => e.tiles.map((n, h) => ({
       key: `tile-${h}`,
       tile: n,
       style: {
@@ -1360,20 +1360,20 @@ const Wi = () => {
     }, [
       (C(!0), W(Tt, null, zt(o.value, (l) => (C(), W("div", {
         key: l.key,
-        class: je(["grid-cell", {
+        class: Ye(["grid-cell", {
           "empty-cell": !l.tile
         }]),
-        style: lt(l.style)
+        style: at(l.style)
       }, [
         Pe(n.$slots, "tile", {
-          style: lt(l.style),
+          style: at(l.style),
           tile: l.tile
         }, void 0, !0)
       ], 6))), 128))
     ], 512));
   }
-}), gs = /* @__PURE__ */ ce(fs, [["__scopeId", "data-v-354b7177"]]);
-function ms(c, e, t, i, s) {
+}), ms = /* @__PURE__ */ ce(gs, [["__scopeId", "data-v-354b7177"]]);
+function ps(c, 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(c, o));
   return r.prototype = e.prototype, r;
 }
@@ -2180,7 +2180,7 @@ class re {
   }
 }
 re._idSeq = 0;
-const K = {
+const Y = {
   alwaysShowResizeHandle: "mobile",
   animate: !0,
   auto: !0,
@@ -2282,7 +2282,7 @@ class Be {
   }
 }
 Be.prefix = "ui-resizable-";
-class et {
+class Je {
   constructor() {
     this._eventRegister = {};
   }
@@ -2310,7 +2310,7 @@ class et {
       return this._eventRegister[e](t);
   }
 }
-class xe extends et {
+class xe extends Je {
   // 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 = () => {
@@ -2460,8 +2460,8 @@ class xe extends et {
   }
 }
 xe._originStyleProp = ["width", "height", "position", "left", "top", "opacity", "zIndex"];
-const ps = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
-class Ce extends et {
+const ys = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
+class Ce extends Je {
   constructor(e, t = {}) {
     var r;
     super(), this.el = e, this.option = t, this.dragTransform = {
@@ -2498,7 +2498,7 @@ class Ce extends et {
   /** @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(ps) || 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), ie && (e.currentTarget.addEventListener("touchmove", Le), e.currentTarget.addEventListener("touchend", Ie)), 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(ys) || 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), ie && (e.currentTarget.addEventListener("touchmove", Le), e.currentTarget.addEventListener("touchend", Ie)), e.preventDefault(), document.activeElement && document.activeElement.blur(), w.mouseHandled = !0), !0;
   }
   /** @internal method to call actual drag event */
   _callDrag(e) {
@@ -2611,7 +2611,7 @@ class Ce extends et {
   }
 }
 Ce.originStyleProp = ["width", "height", "transform", "transform-origin", "transition", "pointerEvents", "position", "left", "top", "minWidth", "willChange"];
-class ys extends et {
+class vs extends Je {
   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();
   }
@@ -2677,9 +2677,9 @@ class ys extends et {
     };
   }
 }
-class tt {
+class et {
   static init(e) {
-    return e.ddElement || (e.ddElement = new tt(e)), e.ddElement;
+    return e.ddElement || (e.ddElement = new et(e)), e.ddElement;
   }
   constructor(e) {
     this.el = e;
@@ -2703,13 +2703,13 @@ class tt {
     return this.ddResizable && (this.ddResizable.destroy(), delete this.ddResizable), this;
   }
   setupDroppable(e) {
-    return this.ddDroppable ? this.ddDroppable.updateOption(e) : this.ddDroppable = new ys(this.el, e), this;
+    return this.ddDroppable ? this.ddDroppable.updateOption(e) : this.ddDroppable = new vs(this.el, e), this;
   }
   cleanDroppable() {
     return this.ddDroppable && (this.ddDroppable.destroy(), delete this.ddDroppable), this;
   }
 }
-class vs {
+class _s {
   resizable(e, t, i, s) {
     return this._getDDElements(e, t).forEach((r) => {
       if (t === "disable" || t === "enable")
@@ -2788,7 +2788,7 @@ class vs {
   /** @internal returns a list of DD elements, creating them on the fly by default unless option is to destroy or disable */
   _getDDElements(e, t) {
     const i = e.gridstack || t !== "destroy" && t !== "disable", s = u.getElements(e);
-    return s.length ? s.map((o) => o.ddElement || (i ? tt.init(o) : null)).filter((o) => o) : [];
+    return s.length ? s.map((o) => o.ddElement || (i ? et.init(o) : null)).filter((o) => o) : [];
   }
 }
 /*!
@@ -2798,7 +2798,7 @@ class vs {
  * Copyright (c) 2021-2024  Alain Dumesny
  * see root license https://github.com/gridstack/gridstack.js/tree/master/LICENSE
  */
-const U = new vs();
+const U = new _s();
 class b {
   /**
    * initializing the HTML element, or selector string, into a grid will return the grid. Calling it again will
@@ -2863,7 +2863,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 = u.createDiv([this.opts.placeholderClass, K.itemClass, this.opts.itemClass]);
+      this._placeholder = u.createDiv([this.opts.placeholderClass, Y.itemClass, this.opts.itemClass]);
       const e = u.createDiv(["placeholder-content"], this._placeholder);
       this.opts.placeholderText && (e.textContent = this.opts.placeholderText);
     }
@@ -2890,23 +2890,23 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     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));
     const n = {
-      ...u.cloneDeep(K),
-      column: u.toNumber(e.getAttribute("gs-column")) || K.column,
-      minRow: i || u.toNumber(e.getAttribute("gs-min-row")) || K.minRow,
-      maxRow: i || u.toNumber(e.getAttribute("gs-max-row")) || K.maxRow,
-      staticGrid: u.toBool(e.getAttribute("gs-static")) || K.staticGrid,
+      ...u.cloneDeep(Y),
+      column: u.toNumber(e.getAttribute("gs-column")) || Y.column,
+      minRow: i || u.toNumber(e.getAttribute("gs-min-row")) || Y.minRow,
+      maxRow: i || u.toNumber(e.getAttribute("gs-max-row")) || Y.maxRow,
+      staticGrid: u.toBool(e.getAttribute("gs-static")) || Y.staticGrid,
       sizeToContent: u.toBool(e.getAttribute("gs-size-to-content")) || void 0,
       draggable: {
-        handle: (t.handleClass ? "." + t.handleClass : t.handle ? t.handle : "") || K.draggable.handle
+        handle: (t.handleClass ? "." + t.handleClass : t.handle ? t.handle : "") || Y.draggable.handle
       },
       removableOptions: {
-        accept: t.itemClass || K.removableOptions.accept,
-        decline: K.removableOptions.decline
+        accept: t.itemClass || Y.removableOptions.accept,
+        decline: Y.removableOptions.decline
       }
     };
     e.getAttribute("gs-animate") && (n.animate = u.toBool(e.getAttribute("gs-animate"))), t = u.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 h = this.el.closest("." + K.itemClass), l = h == null ? void 0 : h.gridstackNode;
-    l && (l.subGrid = this, this.parentGridNode = l, this.el.classList.add("grid-stack-nested"), l.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 !== K.cellHeightUnit && (t.cellHeight = t.cellHeight + t.cellHeightUnit, delete t.cellHeightUnit), this.cellHeight(t.cellHeight, !1)), t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = ie), this._styleSheetClass = "gs-id-" + re._idSeq++, this.el.classList.add(this._styleSheetClass), this._setStaticClass();
+    const h = this.el.closest("." + Y.itemClass), l = h == null ? void 0 : h.gridstackNode;
+    l && (l.subGrid = this, this.parentGridNode = l, this.el.classList.add("grid-stack-nested"), l.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 !== Y.cellHeightUnit && (t.cellHeight = t.cellHeight + t.cellHeightUnit, delete t.cellHeightUnit), this.cellHeight(t.cellHeight, !1)), t.alwaysShowResizeHandle === "mobile" && (t.alwaysShowResizeHandle = ie), this._styleSheetClass = "gs-id-" + re._idSeq++, this.el.classList.add(this._styleSheetClass), this._setStaticClass();
     const d = t.engineClass || b.engineClass || re;
     if (this.engine = new d({
       column: this.getColumn(),
@@ -2999,8 +2999,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     t.column === "auto" && (h = !0, t.column = Math.max(r.w || 1, (i == null ? void 0 : i.w) || 1), delete t.columnOpts);
     let l = r.el.querySelector(".grid-stack-item-content"), d, a;
     if (s && (this._removeDD(r.el), a = { ...r, x: 0, y: 0 }, u.removeInternalForSave(a), delete a.subGridOpts, r.content && (a.content = r.content, delete r.content), b.addRemoveCB ? d = b.addRemoveCB(this.el, a, !0, !1) : (d = u.createDiv(["grid-stack-item"]), d.appendChild(l), l = u.createDiv(["grid-stack-item-content"], r.el)), this.prepareDragDrop(r.el)), i) {
-      const p = h ? t.column : r.w, R = r.h + i.h, A = r.el.style;
-      A.transition = "none", this.update(r.el, { w: p, h: R }), setTimeout(() => A.transition = null);
+      const p = h ? t.column : r.w, R = r.h + i.h, O = r.el.style;
+      O.transition = "none", this.update(r.el, { w: p, h: R }), setTimeout(() => O.transition = null);
     }
     const f = r.subGrid = b.addGrid(l, t);
     return i != null && i._moving && (f._isTemp = !0), h && (f._autoColumn = !0), s && f.makeWidget(d, a), i && (i._moving ? window.setTimeout(() => u.simulateMouseEvent(i._event, "mouseenter", f.el), 0) : f.makeWidget(r.el, r)), this.resizeToContentCheck(!1, r), f;
@@ -3041,7 +3041,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       const r = u.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, u.removeInternalAndSame(r, K), r.children = s, r;
+      return delete r._alwaysShowResizeHandle, o !== void 0 ? r.alwaysShowResizeHandle = o : delete r.alwaysShowResizeHandle, u.removeInternalAndSame(r, Y), r.children = s, r;
     }
     return s;
   }
@@ -3592,7 +3592,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(K.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(Y.itemClass, this.opts.itemClass);
     const s = u.shouldSizeToContent(i);
     return s ? e.classList.add("size-to-content") : e.classList.remove("size-to-content"), s && this.resizeToContentCheck(!1, i), u.lazyLoad(i) || this.prepareDragDrop(i.el), this;
   }
@@ -3978,13 +3978,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 && u.updateScrollPosition(e, i.position, p);
-      const R = i.position.left + (i.position.left > s._lastUiPosition.left ? -d : l), A = i.position.top + (i.position.top > s._lastUiPosition.top ? -f : a);
-      n.x = Math.round(R / r), n.y = Math.round(A / o);
+      const R = i.position.left + (i.position.left > s._lastUiPosition.left ? -d : l), O = i.position.top + (i.position.top > s._lastUiPosition.top ? -f : a);
+      n.x = Math.round(R / r), n.y = Math.round(O / o);
       const T = this._extraDragRow;
       if (this.engine.collide(s, n)) {
-        const H = this.getRow();
-        let E = Math.max(0, n.y + s.h - H);
-        this.opts.maxRow && H + E > this.opts.maxRow && (E = Math.max(0, this.opts.maxRow - H)), this._extraDragRow = E;
+        const P = this.getRow();
+        let E = Math.max(0, n.y + s.h - P);
+        this.opts.maxRow && P + E > this.opts.maxRow && (E = Math.max(0, this.opts.maxRow - P)), this._extraDragRow = E;
       } else
         this._extraDragRow = 0;
       if (this._extraDragRow !== T && this._updateContainerHeight(), s.x === n.x && s.y === n.y)
@@ -4023,7 +4023,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   // legacy method removed
   commit() {
-    return ms(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
+    return ps(this, this.batchUpdate(!1), "commit", "batchUpdate", "5.2"), this;
   }
 }
 b.renderCB = (c, e) => {
@@ -4033,7 +4033,7 @@ b.resizeToContentParent = ".grid-stack-item-content";
 b.Utils = u;
 b.Engine = re;
 b.GDRev = "11.5.1";
-const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { class: "grid-stack-item-content" }, ws = /* @__PURE__ */ j({
+const bs = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], ws = { class: "grid-stack-item-content" }, Es = /* @__PURE__ */ X({
   __name: "DraggableGridLayout",
   props: {
     tiles: {},
@@ -4064,7 +4064,7 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
         o.value.delete(`${(p = v.el) == null ? void 0 : p.getAttribute("data-id")}`);
       }), s("update-tiles", Array.from(o.value.values()));
     };
-    Qe(() => {
+    Xe(() => {
       r.value && (n = b.init({
         margin: 10,
         column: Nt,
@@ -4072,7 +4072,7 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
         resizable: { handles: "se, sw" },
         handle: ".tile-header"
       }, r.value), n.on("change", d), n.on("added", d), n.on("removed", a));
-    }), Ve(() => {
+    }), We(() => {
       n && n.destroy(!1);
     });
     const f = (m) => {
@@ -4081,7 +4081,7 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
         g && n.removeWidget(g);
       }
     };
-    return Ke(() => 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)
@@ -4111,46 +4111,46 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
         "gs-x": v.layout.position.col,
         "gs-y": v.layout.position.row
       }, [
-        ae("div", bs, [
+        le("div", ws, [
           Pe(m.$slots, "tile", { tile: v }, void 0, !0)
         ])
-      ], 8, _s))), 128))
+      ], 8, bs))), 128))
     ], 512));
   }
-}), Es = /* @__PURE__ */ ce(ws, [["__scopeId", "data-v-a68d6821"]]), xs = { class: "kong-ui-public-dashboard-renderer" }, Cs = {
+}), xs = /* @__PURE__ */ ce(Es, [["__scopeId", "data-v-a68d6821"]]), Cs = { class: "kong-ui-public-dashboard-renderer" }, Rs = {
   key: 0,
   class: "tile-container slottable-tile"
-}, Rs = /* @__PURE__ */ j({
+}, Ts = /* @__PURE__ */ X({
   __name: "DashboardRenderer",
-  props: /* @__PURE__ */ ht({
+  props: /* @__PURE__ */ lt({
     context: {}
   }, {
     modelValue: { required: !0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ ht(["edit-tile", "tile-time-range-zoom"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ lt(["edit-tile", "tile-time-range-zoom"], ["update:modelValue"]),
   setup(c, { expose: e, emit: t }) {
-    const i = c, s = t, r = si(c, "modelValue"), { i18n: o } = ve.useI18n(), n = G(0), h = G(null), l = _e(ue);
+    const i = c, s = t, r = ri(c, "modelValue"), { i18n: o } = ve.useI18n(), n = G(0), h = G(null), l = _e(ue);
     l || (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")), ve.useRequestQueue();
-    const d = kt(), a = N(() => i.context.timeSpec ? i.context.timeSpec : {
+    const d = kt(), a = S(() => i.context.timeSpec ? i.context.timeSpec : {
       type: "relative",
       time_range: d.defaultQueryTimeForOrg
-    }), f = N(() => !!i.context.timeSpec || !d.loading), m = (x, O) => {
-      const D = x.layout.position.row - O.layout.position.row;
-      return D !== 0 ? D : x.layout.position.col - O.layout.position.col;
-    }, g = N(() => r.value.tiles.map((x) => {
-      var D;
-      let O = x.definition;
-      if ("description" in O.chart) {
-        const P = (D = O.chart.description) == null ? void 0 : D.replace(Hi, () => {
-          const de = `renderer.trendRange.${a.value.type === "absolute" ? "custom" : a.value.time_range}`;
-          return o.te(de) ? o.t(de) : "";
+    }), f = S(() => !!i.context.timeSpec || !d.loading), m = (x, A) => {
+      const N = x.layout.position.row - A.layout.position.row;
+      return N !== 0 ? N : x.layout.position.col - A.layout.position.col;
+    }, g = S(() => r.value.tiles.map((x) => {
+      var N;
+      let A = x.definition;
+      if ("description" in A.chart) {
+        const M = (N = A.chart.description) == null ? void 0 : N.replace(Li, () => {
+          const oe = `renderer.trendRange.${a.value.type === "absolute" ? "custom" : a.value.time_range}`;
+          return o.te(oe) ? o.t(oe) : "";
         });
-        O = {
-          ...O,
+        A = {
+          ...A,
           chart: {
-            ...O.chart,
-            description: P
+            ...A.chart,
+            description: M
           }
         };
       }
@@ -4160,37 +4160,37 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
         x
       ), {
         layout: x.layout,
-        meta: O,
+        meta: A,
         type: x.type,
         // Add a unique key to each tile internally.
         id: x.id ?? crypto.randomUUID()
       };
-    })), v = N(() => {
-      var de, be, ke;
-      let { tz: x, refreshInterval: O, editable: D } = i.context;
-      const P = [...i.context.filters ?? [], ...r.value.preset_filters ?? []];
-      x || (x = new Intl.DateTimeFormat().resolvedOptions().timeZone), O === void 0 && (O = Li), D === void 0 && (D = !1);
-      const ee = !!((ke = (be = (de = ri()) == null ? void 0 : de.vnode) == null ? void 0 : be.props) != null && ke.onTileTimeRangeZoom);
+    })), v = S(() => {
+      var oe, ke, be;
+      let { tz: x, refreshInterval: A, editable: N } = i.context;
+      const M = [...i.context.filters ?? [], ...r.value.preset_filters ?? []];
+      x || (x = new Intl.DateTimeFormat().resolvedOptions().timeZone), A === void 0 && (A = Ii), N === void 0 && (N = !1);
+      const V = !!((be = (ke = (oe = ni()) == null ? void 0 : oe.vnode) == null ? void 0 : ke.props) != null && be.onTileTimeRangeZoom);
       return {
-        filters: P,
+        filters: M,
         tz: x,
         timeSpec: a.value,
-        refreshInterval: O,
-        editable: D,
-        zoomable: ee
+        refreshInterval: A,
+        editable: N,
+        zoomable: V
       };
     }), p = (x) => {
       s("edit-tile", x);
-    }, R = (x) => x.type === "slottable", A = (x) => {
-      const O = R(x.meta.chart) ? { ...x.meta.chart } : {
+    }, R = (x) => x.type === "slottable", O = (x) => {
+      const A = R(x.meta.chart) ? { ...x.meta.chart } : {
         ...x.meta.chart,
         chart_title: x.meta.chart.chart_title ? `Copy of ${x.meta.chart.chart_title}` : ""
-      }, D = {
+      }, N = {
         id: crypto.randomUUID(),
         type: "chart",
         definition: {
           ...x.meta,
-          chart: O
+          chart: A
         },
         layout: {
           position: {
@@ -4200,24 +4200,24 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
           size: x.layout.size
         }
       };
-      r.value.tiles.push(D);
+      r.value.tiles.push(N);
     }, T = (x) => {
       h.value && h.value.removeWidget(x.id);
-    }, H = () => {
+    }, P = () => {
       n.value++;
     }, E = (x) => {
-      const O = x.map((D) => ({
-        id: D.id,
-        type: D.type,
-        layout: D.layout,
-        definition: D.meta
+      const A = x.map((N) => ({
+        id: N.id,
+        type: N.type,
+        layout: N.layout,
+        definition: N.meta
       }));
-      r.value.tiles = O.sort(m);
+      r.value.tiles = A.sort(m);
     };
-    return e({ refresh: H }), (x, O) => {
-      const D = he("KAlert");
-      return C(), W("div", xs, [
-        k(l) ? (C(), M(Rt(x.context.editable ? Es : gs), {
+    return e({ refresh: P }), (x, A) => {
+      const N = de("KAlert");
+      return C(), W("div", Cs, [
+        D(l) ? (C(), I(Rt(x.context.editable ? xs : ms), {
           key: 1,
           ref_key: "gridLayoutRef",
           ref: h,
@@ -4225,46 +4225,46 @@ const _s = ["data-id", "data-testid", "gs-h", "gs-w", "gs-x", "gs-y"], bs = { cl
           tiles: g.value,
           onUpdateTiles: E
         }, {
-          tile: q(({ tile: P }) => [
-            P.meta.chart.type === "slottable" ? (C(), W("div", Cs, [
-              Pe(x.$slots, P.meta.chart.id, {}, void 0, !0)
-            ])) : (C(), M(us, {
+          tile: q(({ tile: M }) => [
+            M.meta.chart.type === "slottable" ? (C(), W("div", Rs, [
+              Pe(x.$slots, M.meta.chart.id, {}, void 0, !0)
+            ])) : (C(), I(cs, {
               key: 1,
               class: "tile-container",
               context: v.value,
-              definition: P.meta,
-              height: P.layout.size.rows * (r.value.tile_height || k($e)) + parseInt(k($t), 10),
+              definition: M.meta,
+              height: M.layout.size.rows * (r.value.tile_height || D($e)) + parseInt(D($t), 10),
               "query-ready": f.value,
               "refresh-counter": n.value,
-              "tile-id": P.id,
-              onDuplicateTile: (ee) => A(P),
-              onEditTile: (ee) => p(P),
-              onRemoveTile: (ee) => T(P),
-              onTileTimeRangeZoom: O[0] || (O[0] = (ee) => s("tile-time-range-zoom", ee))
+              "tile-id": M.id,
+              onDuplicateTile: (V) => O(M),
+              onEditTile: (V) => p(M),
+              onRemoveTile: (V) => T(M),
+              onTileTimeRangeZoom: A[0] || (A[0] = (V) => s("tile-time-range-zoom", V))
             }, null, 8, ["context", "definition", "height", "query-ready", "refresh-counter", "tile-id", "onDuplicateTile", "onEditTile", "onRemoveTile"]))
           ]),
           _: 3
-        }, 40, ["tile-height", "tiles"])) : (C(), M(D, {
+        }, 40, ["tile-height", "tiles"])) : (C(), I(N, {
           key: 0,
           appearance: "danger"
         }, {
           default: q(() => [
-            Ee(te(k(o).t("renderer.noQueryBridge")), 1)
+            Ee(te(D(o).t("renderer.noQueryBridge")), 1)
           ]),
           _: 1
         }))
       ]);
     };
   }
-}), Is = /* @__PURE__ */ ce(Rs, [["__scopeId", "data-v-c16badc2"]]);
+}), Ms = /* @__PURE__ */ ce(Ts, [["__scopeId", "data-v-c16badc2"]]);
 export {
-  Ai as CP_ID_TOKEN,
+  Hi as CP_ID_TOKEN,
   Nt as DASHBOARD_COLS,
   $e as DEFAULT_TILE_HEIGHT,
-  Li as DEFAULT_TILE_REFRESH_INTERVAL_MS,
-  Is as DashboardRenderer,
+  Ii as DEFAULT_TILE_REFRESH_INTERVAL_MS,
+  Ms as DashboardRenderer,
   ut as ENTITY_ID_TOKEN,
-  gs as GridLayout,
+  ms as GridLayout,
   ue as INJECT_QUERY_PROVIDER,
-  Hi as TIMEFRAME_TOKEN
+  Li as TIMEFRAME_TOKEN
 };