@kong-ui-public/analytics-metric-provider 5.1.4 → 5.1.5

package/dist/vitals-metric-provider.es.js

@@ -1,10 +1,10 @@
-import { ref as pe, watchEffect as Fe, computed as g, getCurrentInstance as He, reactive as Be, onMounted as $e, onUnmounted as Pe, watch as Ke, isReadonly as Ze, toRefs as Ue, defineComponent as k, inject as xe, toRef as Ge, provide as je, renderSlot as ke, resolveComponent as qe, openBlock as p, createElementBlock as y, createElementVNode as I, normalizeClass as G, unref as w, createCommentVNode as T, createBlock as N, resolveDynamicComponent as z, withCtx as A, createTextVNode as Xe, toDisplayString as R, createVNode as X, normalizeStyle as V, Fragment as Se, renderList as Ye, mergeProps as Qe, pushScopeId as L, popScopeId as M, normalizeProps as We, guardReactiveProps as Je } from "vue";
+import { ref as pe, watchEffect as Fe, computed as g, getCurrentInstance as He, reactive as Be, onMounted as $e, onUnmounted as Pe, watch as Ke, isReadonly as Ze, toRefs as Ue, defineComponent as k, inject as xe, toRef as Ge, provide as je, renderSlot as ke, resolveComponent as qe, openBlock as p, createElementBlock as y, createElementVNode as I, normalizeClass as G, unref as w, createCommentVNode as T, createBlock as N, resolveDynamicComponent as z, withCtx as A, createTextVNode as Ye, toDisplayString as R, createVNode as Y, normalizeStyle as V, Fragment as Se, renderList as Xe, mergeProps as Qe, pushScopeId as L, popScopeId as M, normalizeProps as We, guardReactiveProps as Je } from "vue";
 import { TimePeriods as re, TimeframeKeys as te, queryableExploreDimensions as er, DeltaQueryTime as rr, UnaryQueryTime as tr } from "@kong-ui-public/analytics-utilities";
 import { createI18n as ir, i18nTComponent as nr } from "@kong-ui-public/i18n";
 import { useAnalyticsConfigStore as ar, SEVEN_DAYS_MS as or } from "@kong-ui-public/analytics-config-store";
-const sr = {
+const lr = {
   notAvailable: "N/A"
-}, ur = {
+}, sr = {
   short: {
     traffic: "Requests",
     errorRate: "Error Rate",
@@ -15,7 +15,7 @@ const sr = {
     errorRate: "Average Error Rate",
     latency: "P99 Latency"
   }
-}, lr = {
+}, ur = {
   custom: "vs previous {numDays, plural, =1 {day} other {# days}}",
   "15m": "vs previous 15 minutes",
   "1h": "vs previous hour",
@@ -31,9 +31,9 @@ const sr = {
   previous_month: "vs previous time period",
   previous_quarter: "vs previous quarter"
 }, dr = {
-  general: sr,
-  metricCard: ur,
-  trendRange: lr
+  general: lr,
+  metricCard: sr,
+  trendRange: ur
 };
 function cr() {
   const e = ir("en-us", dr);
@@ -87,18 +87,18 @@ function yr(e = pe({}), r, t, a = gr) {
     swrvState: ze
   };
 }
-const B = Symbol("default"), ue = "status_code_grouped", _e = (e, r, t, a, n) => {
+const B = Symbol("default"), se = "status_code_grouped", _e = (e, r, t, a, n) => {
   e[r][t] || (e[r][t] = {}), e[r][t][a] = n;
 };
 function mr(e, r) {
   var f;
-  const t = ((f = e.meta.metric_names) == null ? void 0 : f[0]) || "", a = e.meta.start_ms, n = Object.keys(e.meta.display || {}), i = !!n.find((c) => c === ue), u = n.find((c) => c !== ue);
+  const t = ((f = e.meta.metric_names) == null ? void 0 : f[0]) || "", a = e.meta.start_ms, n = Object.keys(e.meta.display || {}), i = !!n.find((c) => c === se), s = n.find((c) => c !== se);
   return n.length > 2 || n.length > 1 && !i ? (console.error("Don't know how to work with provided dimensions:", n), {
     previous: { [B]: { [B]: 0 } },
     current: { [B]: { [B]: 0 } }
   }) : e.data.reduce((c, o) => {
-    const s = o.event[t], l = u ? o.event[u] : B, d = i ? o.event[ue] : B;
-    return new Date(o.timestamp).getTime() === a && r ? _e(c, "previous", l, d, s) : _e(c, "current", l, d, s), c;
+    const l = o.event[t], u = s ? o.event[s] : B, d = i ? o.event[se] : B;
+    return new Date(o.timestamp).getTime() === a && r ? _e(c, "previous", u, d, l) : _e(c, "current", u, d, l), c;
   }, {
     previous: {},
     current: {}
@@ -107,11 +107,11 @@ function mr(e, r) {
 function hr(e) {
   e.queryReady === void 0 && (e.queryReady = g(() => !0));
   const { i18n: r } = K.useI18n(), t = g(() => {
-    var l, d;
+    var u, d;
     return {
       metrics: e.metrics,
       dimensions: [
-        ...(l = e.dimensions) != null && l.length ? [...e.dimensions] : [],
+        ...(u = e.dimensions) != null && u.length ? [...e.dimensions] : [],
         ...e.withTrend.value ? ["time"] : []
       ],
       granularity: e.withTrend.value ? "trend" : void 0,
@@ -122,9 +122,9 @@ function hr(e) {
     var d, v, b, m;
     if (!((d = e.queryReady) != null && d.value) || e.featureFlags && !e.featureFlags.every((h) => h))
       return null;
-    const l = (v = e.filter) != null && v.value ? JSON.stringify(e.filter.value) : "";
-    return `metric-fetcher-${e.timeframe.value.cacheKey()}-${(b = e.dimensions) == null ? void 0 : b.join("-")}-${(m = e.metrics) == null ? void 0 : m.join("-")}-${l}`;
-  }), { response: n, error: i, isValidating: u } = K.useRequest(
+    const u = (v = e.filter) != null && v.value ? JSON.stringify(e.filter.value) : "";
+    return `metric-fetcher-${e.timeframe.value.cacheKey()}-${(b = e.dimensions) == null ? void 0 : b.join("-")}-${(m = e.metrics) == null ? void 0 : m.join("-")}-${u}`;
+  }), { response: n, error: i, isValidating: s } = K.useRequest(
     () => a.value,
     () => e.queryFn(t.value, e.abortController ?? new AbortController()),
     {
@@ -132,13 +132,13 @@ function hr(e) {
       revalidateOnFocus: !1,
       errorRetryCount: fr
     }
-  ), { state: f, swrvState: c } = yr(n, i, u), o = g(() => {
-    var l, d, v, b, m, h, x;
-    return !((d = (l = n.value) == null ? void 0 : l.data) != null && d.length) || !((b = (v = n.value) == null ? void 0 : v.meta) != null && b.display) || !((x = (h = (m = n.value) == null ? void 0 : m.meta) == null ? void 0 : h.metric_names) != null && x.length) ? { current: {}, previous: {} } : mr(n.value, e.withTrend.value);
-  }), s = g(() => {
-    var l, d, v;
+  ), { state: f, swrvState: c } = yr(n, i, s), o = g(() => {
+    var u, d, v, b, m, h, x;
+    return !((d = (u = n.value) == null ? void 0 : u.data) != null && d.length) || !((b = (v = n.value) == null ? void 0 : v.meta) != null && b.display) || !((x = (h = (m = n.value) == null ? void 0 : m.meta) == null ? void 0 : h.metric_names) != null && x.length) ? { current: {}, previous: {} } : mr(n.value, e.withTrend.value);
+  }), l = g(() => {
+    var u, d, v;
     if (e.timeframe.value.key === "custom") {
-      if (!((d = (l = n.value) == null ? void 0 : l.meta) != null && d.start_ms))
+      if (!((d = (u = n.value) == null ? void 0 : u.meta) != null && d.start_ms))
         return "";
       const { start_ms: b, end_ms: m } = n.value.meta;
       let h = (m - b) / (1e3 * 60 * 60 * 24);
@@ -151,12 +151,12 @@ function hr(e) {
     hasError: g(() => c.ERROR === f.value),
     raw: n,
     mapped: o,
-    trendRange: s
+    trendRange: l
   };
 }
-const j = (e, r, t = B, a) => (a ?? [B]).reduce((i, u) => {
+const j = (e, r, t = B, a) => (a ?? [B]).reduce((i, s) => {
   const f = e[r][t];
-  return f ? i + (f[u] || 0) : i;
+  return f ? i + (f[s] || 0) : i;
 }, 0);
 function Cr(e) {
   const {
@@ -165,42 +165,42 @@ function Cr(e) {
     description: a,
     record: n,
     hasError: i,
-    increaseIsBad: u,
+    increaseIsBad: s,
     formatValueFn: f,
     trendRange: c
   } = e;
   return g(() => {
-    let o = 0, s = 0;
+    let o = 0, l = 0;
     if (n != null && n.value)
       try {
-        o = j(n.value, "current", e.lookupKey, e.sumGroupedValues), s = j(n.value, "previous", e.lookupKey, e.sumGroupedValues);
-      } catch (l) {
+        o = j(n.value, "current", e.lookupKey, e.sumGroupedValues), l = j(n.value, "previous", e.lookupKey, e.sumGroupedValues);
+      } catch (u) {
         console.error(
           "Metric card data doesn't have the expected structure:",
-          l
+          u
         );
       }
     return {
       cardType: r,
       hasError: i.value,
       currentValue: o,
-      previousValue: s,
+      previousValue: l,
       title: t.value,
       description: a,
-      increaseIsBad: !!u,
+      increaseIsBad: !!s,
       // Coerce undefined to false
       formatValueFn: f,
       trendRange: c == null ? void 0 : c.value
     };
   });
 }
-var le = /* @__PURE__ */ new WeakMap(), Re = 0;
+var ue = /* @__PURE__ */ new WeakMap(), Re = 0;
 function br(e) {
   if (!e.length)
     return "";
   for (var r = "arg", t = 0; t < e.length; ++t) {
     var a = void 0;
-    e[t] === null || typeof e[t] != "object" && typeof e[t] != "function" ? typeof e[t] == "string" ? a = '"' + e[t] + '"' : a = String(e[t]) : le.has(e[t]) ? a = le.get(e[t]) : (a = Re, le.set(e[t], Re++)), r += "@" + a;
+    e[t] === null || typeof e[t] != "object" && typeof e[t] != "function" ? typeof e[t] == "string" ? a = '"' + e[t] + '"' : a = String(e[t]) : ue.has(e[t]) ? a = ue.get(e[t]) : (a = Re, ue.set(e[t], Re++)), r += "@" + a;
   }
   return r;
 }
@@ -225,17 +225,17 @@ var ve = (
       var t = this.serializeKey(r);
       return this.items.get(t);
     }, e.prototype.set = function(r, t, a) {
-      var n = this.serializeKey(r), i = a || this.ttl, u = Date.now(), f = {
+      var n = this.serializeKey(r), i = a || this.ttl, s = Date.now(), f = {
         data: t,
-        createdAt: u,
-        expiresAt: i ? u + i : 1 / 0
+        createdAt: s,
+        expiresAt: i ? s + i : 1 / 0
       };
       this.dispatchExpire(i, f, n), this.items.set(n, f);
     }, e.prototype.dispatchExpire = function(r, t, a) {
       var n = this;
       r && setTimeout(function() {
-        var i = Date.now(), u = i >= t.expiresAt;
-        u && n.delete(a);
+        var i = Date.now(), s = i >= t.expiresAt;
+        s && n.delete(a);
       }, r);
     }, e.prototype.delete = function(r) {
       this.items.delete(r);
@@ -269,27 +269,27 @@ var O = function() {
   }, O.apply(this, arguments);
 }, Z = function(e, r, t, a) {
   function n(i) {
-    return i instanceof t ? i : new t(function(u) {
-      u(i);
+    return i instanceof t ? i : new t(function(s) {
+      s(i);
     });
   }
-  return new (t || (t = Promise))(function(i, u) {
-    function f(s) {
+  return new (t || (t = Promise))(function(i, s) {
+    function f(l) {
       try {
-        o(a.next(s));
-      } catch (l) {
-        u(l);
+        o(a.next(l));
+      } catch (u) {
+        s(u);
       }
     }
-    function c(s) {
+    function c(l) {
       try {
-        o(a.throw(s));
-      } catch (l) {
-        u(l);
+        o(a.throw(l));
+      } catch (u) {
+        s(u);
       }
     }
-    function o(s) {
-      s.done ? i(s.value) : n(s.value).then(f, c);
+    function o(l) {
+      l.done ? i(l.value) : n(l.value).then(f, c);
     }
     o((a = a.apply(e, r || [])).next());
   });
@@ -298,13 +298,13 @@ var O = function() {
     if (i[0] & 1)
       throw i[1];
     return i[1];
-  }, trys: [], ops: [] }, a, n, i, u;
-  return u = { next: f(0), throw: f(1), return: f(2) }, typeof Symbol == "function" && (u[Symbol.iterator] = function() {
+  }, trys: [], ops: [] }, a, n, i, s;
+  return s = { next: f(0), throw: f(1), return: f(2) }, typeof Symbol == "function" && (s[Symbol.iterator] = function() {
     return this;
-  }), u;
+  }), s;
   function f(o) {
-    return function(s) {
-      return c([o, s]);
+    return function(l) {
+      return c([o, l]);
     };
   }
   function c(o) {
@@ -348,8 +348,8 @@ var O = function() {
             continue;
         }
         o = r.call(e, t);
-      } catch (s) {
-        o = [6, s], n = 0;
+      } catch (l) {
+        o = [6, l], n = 0;
       } finally {
         a = i = 0;
       }
@@ -361,18 +361,18 @@ var O = function() {
   var t = typeof Symbol == "function" && e[Symbol.iterator];
   if (!t)
     return e;
-  var a = t.call(e), n, i = [], u;
+  var a = t.call(e), n, i = [], s;
   try {
     for (; (r === void 0 || r-- > 0) && !(n = a.next()).done; )
       i.push(n.value);
   } catch (f) {
-    u = { error: f };
+    s = { error: f };
   } finally {
     try {
       n && !n.done && (t = a.return) && t.call(a);
     } finally {
-      if (u)
-        throw u.error;
+      if (s)
+        throw s.error;
     }
   }
   return i;
@@ -415,37 +415,37 @@ function Ir(e, r, t) {
 }
 var Te = function(e, r, t, a) {
   return t === void 0 && (t = Ae), a === void 0 && (a = Ve.ttl), Z(void 0, void 0, void 0, function() {
-    var n, i, u, f, c, o, s;
-    return U(this, function(l) {
-      switch (l.label) {
+    var n, i, s, f, c, o, l;
+    return U(this, function(u) {
+      switch (u.label) {
         case 0:
           if (!kr(r))
             return [3, 5];
-          l.label = 1;
+          u.label = 1;
         case 1:
-          return l.trys.push([1, 3, , 4]), [4, r];
+          return u.trys.push([1, 3, , 4]), [4, r];
         case 2:
-          return n = l.sent(), [3, 4];
+          return n = u.sent(), [3, 4];
         case 3:
-          return f = l.sent(), i = f, [3, 4];
+          return f = u.sent(), i = f, [3, 4];
         case 4:
           return [3, 6];
         case 5:
-          n = r, l.label = 6;
+          n = r, u.label = 6;
         case 6:
-          if (u = !1, c = { data: n, error: i, isValidating: u }, typeof n < "u")
+          if (s = !1, c = { data: n, error: i, isValidating: s }, typeof n < "u")
             try {
               t.set(e, c, a);
             } catch (d) {
               console.error("swrv(mutate): failed to set cache", d);
             }
-          return o = ie.get(e), o && o.data.length && (s = o.data.filter(function(d) {
+          return o = ie.get(e), o && o.data.length && (l = o.data.filter(function(d) {
             return d.key === e;
-          }), s.forEach(function(d, v) {
+          }), l.forEach(function(d, v) {
             typeof c.data < "u" && (d.data = c.data), d.error = c.error, d.isValidating = c.isValidating;
-            var b = v === s.length - 1;
-            b || delete s[v];
-          }), s = s.filter(Boolean)), [2, c];
+            var b = v === l.length - 1;
+            b || delete l[v];
+          }), l = l.filter(Boolean)), [2, c];
       }
     });
   });
@@ -453,12 +453,12 @@ var Te = function(e, r, t, a) {
 function xr() {
   for (var e = this, r = [], t = 0; t < arguments.length; t++)
     r[t] = arguments[t];
-  var a, n, i = O({}, Ve), u = !1, f = !1, c = He(), o = (c == null ? void 0 : c.proxy) || c;
+  var a, n, i = O({}, Ve), s = !1, f = !1, c = He(), o = (c == null ? void 0 : c.proxy) || c;
   if (!o)
     return console.error("Could not get current instance, check to make sure that `useSwrv` is declared in the top level of the setup function."), null;
-  var s = (o == null ? void 0 : o.$isServer) || !1;
+  var l = (o == null ? void 0 : o.$isServer) || !1;
   r.length >= 1 && (a = r[0]), r.length >= 2 && (n = r[1]), r.length > 2 && (i = O(O({}, i), r[2]));
-  var l = s ? i.serverTTL : i.ttl, d = typeof a == "function" ? a : pe(a);
+  var u = l ? i.serverTTL : i.ttl, d = typeof a == "function" ? a : pe(a);
   typeof n > "u" && (n = i.fetcher);
   var v = null;
   v || (v = Be({
@@ -469,11 +469,11 @@ function xr() {
   }));
   var b = function(S, C) {
     return Z(e, void 0, void 0, function() {
-      var H, E, $, Y, ne, me, ae, he = this;
+      var H, E, $, X, ne, me, ae, he = this;
       return U(this, function(oe) {
         switch (oe.label) {
           case 0:
-            return H = v.data === void 0, E = d.value, E ? ($ = i.cache.get(E), Y = $ && $.data, v.isValidating = !0, Y && (v.data = Y.data, v.error = Y.error), ne = S || n, !ne || !i.isDocumentVisible() && !H || (C == null ? void 0 : C.forceRevalidate) !== void 0 && !(C != null && C.forceRevalidate) ? (v.isValidating = !1, [
+            return H = v.data === void 0, E = d.value, E ? ($ = i.cache.get(E), X = $ && $.data, v.isValidating = !0, X && (v.data = X.data, v.error = X.error), ne = S || n, !ne || !i.isDocumentVisible() && !H || (C == null ? void 0 : C.forceRevalidate) !== void 0 && !(C != null && C.forceRevalidate) ? (v.isValidating = !1, [
               2
               /*return*/
             ]) : $ && (me = !!(Date.now() - $.createdAt >= i.dedupingInterval || C != null && C.forceRevalidate), !me) ? (v.isValidating = !1, [
@@ -481,31 +481,31 @@ function xr() {
               /*return*/
             ]) : (ae = function() {
               return Z(he, void 0, void 0, function() {
-                var P, Ce, se, be;
+                var P, Ce, le, be;
                 return U(this, function(W) {
                   switch (W.label) {
                     case 0:
-                      return P = ce.get(E), P ? [3, 2] : (Ce = Array.isArray(E) ? E : [E], se = ne.apply(void 0, Nr([], Tr(Ce), !1)), ce.set(E, se, i.dedupingInterval), [4, Te(E, se, i.cache, l)]);
+                      return P = ce.get(E), P ? [3, 2] : (Ce = Array.isArray(E) ? E : [E], le = ne.apply(void 0, Nr([], Tr(Ce), !1)), ce.set(E, le, i.dedupingInterval), [4, Te(E, le, i.cache, u)]);
                     case 1:
                       return W.sent(), [3, 4];
                     case 2:
-                      return [4, Te(E, P.data, i.cache, l)];
+                      return [4, Te(E, P.data, i.cache, u)];
                     case 3:
                       W.sent(), W.label = 4;
                     case 4:
-                      return v.isValidating = !1, ce.delete(E), v.error !== void 0 && (be = !u && i.shouldRetryOnError && (C ? C.shouldRetryOnError : !0), be && Ir(b, C ? C.errorRetryCount : 1, i)), [
+                      return v.isValidating = !1, ce.delete(E), v.error !== void 0 && (be = !s && i.shouldRetryOnError && (C ? C.shouldRetryOnError : !0), be && Ir(b, C ? C.errorRetryCount : 1, i)), [
                         2
                         /*return*/
                       ];
                   }
                 });
               });
-            }, Y && i.revalidateDebounce ? (setTimeout(function() {
+            }, X && i.revalidateDebounce ? (setTimeout(function() {
               return Z(he, void 0, void 0, function() {
                 return U(this, function(P) {
                   switch (P.label) {
                     case 0:
-                      return u ? [3, 2] : [4, ae()];
+                      return s ? [3, 2] : [4, ae()];
                     case 1:
                       P.sent(), P.label = 2;
                     case 2:
@@ -551,7 +551,7 @@ function xr() {
             case 2:
               h && clearTimeout(h), C.label = 3;
             case 3:
-              return i.refreshInterval && !u && (h = setTimeout(S, i.refreshInterval)), [
+              return i.refreshInterval && !s && (h = setTimeout(S, i.refreshInterval)), [
                 2
                 /*return*/
               ];
@@ -561,7 +561,7 @@ function xr() {
     };
     i.refreshInterval && (h = setTimeout(S, i.refreshInterval)), i.revalidateOnFocus && (document.addEventListener("visibilitychange", m, !1), window.addEventListener("focus", m, !1));
   }), Pe(function() {
-    u = !0, h && clearTimeout(h), i.revalidateOnFocus && (document.removeEventListener("visibilitychange", m, !1), window.removeEventListener("focus", m, !1));
+    s = !0, h && clearTimeout(h), i.revalidateOnFocus && (document.removeEventListener("visibilitychange", m, !1), window.removeEventListener("focus", m, !1));
     var S = ie.get(d.value);
     S && (S.data = S.data.filter(function(C) {
       return C !== v;
@@ -569,7 +569,7 @@ function xr() {
   });
   try {
     Ke(d, function(S) {
-      Ze(d) || (d.value = S), v.key = S, v.isValidating = !!S, Er(d.value, v, l), !s && !f && d.value && b(), f = !1;
+      Ze(d) || (d.value = S), v.key = S, v.isValidating = !!S, Er(d.value, v, u), !l && !f && d.value && b(), f = !1;
     }, {
       immediate: !0
     });
@@ -588,7 +588,7 @@ function qr(e, r, t) {
     data: a,
     error: n,
     isValidating: i,
-    mutate: u
+    mutate: s
   } = xr(e, r, {
     revalidateDebounce: 500,
     revalidateOnFocus: !1,
@@ -600,7 +600,7 @@ function qr(e, r, t) {
     response: a,
     error: n,
     isValidating: i,
-    revalidate: u
+    revalidate: s
   };
 }
 const K = {
@@ -615,17 +615,17 @@ const K = {
     additionalFilter: a,
     queryReady: n,
     timeframe: i,
-    tz: u,
+    tz: s,
     hasTrendAccess: f,
     refreshInterval: c,
     abortController: o,
-    queryFn: s
+    queryFn: l
   } = e;
   if (t && !r)
     throw new Error("Must provide a dimension if filtering by a value");
-  const l = !!(r && t), d = !!(r && !t), v = g(() => {
+  const u = !!(r && t), d = !!(r && !t), v = g(() => {
     const S = [];
-    return l && S.push({
+    return u && S.push({
       dimension: r,
       type: "in",
       values: [t]
@@ -637,17 +637,17 @@ const K = {
     // Traffic and error rate cards should only try to query for the dimension if it's going to be used.
     // It isn't used for single entity queries.
     dimensions: [
-      ...r && !l ? [r] : [],
+      ...r && !u ? [r] : [],
       "status_code_grouped"
     ],
     filter: v,
     queryReady: n,
     timeframe: i,
-    tz: u,
+    tz: s,
     // Traffic and error rate cards can't query trend if multiple entities are expected.
     withTrend: g(() => f.value && !d),
     refreshInterval: c,
-    queryFn: s,
+    queryFn: l,
     abortController: o
   }, m = {
     metrics: [
@@ -655,15 +655,15 @@ const K = {
     ],
     // To keep single-entity queries consistent, don't bother querying the dimension for latency
     // in the single-entity case, even though it's possible.
-    ...r && !l ? { dimensions: [r] } : {},
+    ...r && !u ? { dimensions: [r] } : {},
     filter: v,
     queryReady: n,
     timeframe: i,
-    tz: u,
+    tz: s,
     // Don't query latency trends in the multi-entity case: it's possible, but wasteful.
     withTrend: g(() => f.value && !d),
     refreshInterval: c,
-    queryFn: s,
+    queryFn: l,
     abortController: o
   }, h = K.useMetricFetcher(b), x = K.useMetricFetcher(m);
   return {
@@ -693,7 +693,7 @@ const K = {
     const t = xe(vr);
     let a;
     t ? a = t.queryFn : (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/analytics-metric-provider/README.md#requirements"), a = () => Promise.reject(new Error("Query bridge required")));
-    const i = ar().getConfig(), u = g(() => i.value !== null && r.queryReady), f = g(() => {
+    const i = ar().getConfig(), s = g(() => i.value !== null && r.queryReady), f = g(() => {
       var v, b;
       const d = (b = (v = i.value) == null ? void 0 : v.analytics) == null ? void 0 : b.retention_ms;
       return !!d && d > or;
@@ -705,13 +705,13 @@ const K = {
         throw new Error("Metrics provider failed to resolve fallback timeframe.");
       return d;
     }), {
-      trafficData: s,
-      latencyData: l
+      trafficData: l,
+      latencyData: u
     } = zr({
       dimension: r.dimension,
       dimensionFilterValue: r.filterValue,
       additionalFilter: Ge(r, "additionalFilter"),
-      queryReady: u,
+      queryReady: s,
       timeframe: o,
       tz: c,
       hasTrendAccess: f,
@@ -721,8 +721,8 @@ const K = {
     });
     return je(Le, {
       data: {
-        traffic: s,
-        latency: l
+        traffic: l,
+        latency: u
       },
       description: r.description,
       containerTitle: r.containerTitle,
@@ -740,26 +740,26 @@ function Ar(e) {
 var Me = { exports: {} };
 (function(e) {
   (function() {
-    function r(o, s) {
-      if (s.separator === !1 || o < 1e3)
+    function r(o, l) {
+      if (l.separator === !1 || o < 1e3)
         return o.toString();
-      var l = typeof s.separator == "string" ? s.separator : ",", d = [], v = Math.round(o).toString().split("");
+      var u = typeof l.separator == "string" ? l.separator : ",", d = [], v = Math.round(o).toString().split("");
       return v.reverse().forEach(function(b, m) {
-        m && m % 3 === 0 && d.push(l), d.push(b);
+        m && m % 3 === 0 && d.push(u), d.push(b);
       }), d.reverse().join("");
     }
-    function t(o, s, l) {
-      var d = o / s, v = l.round ? "round" : "floor";
-      return l.decimal === !1 ? (o = Math[v](d), o.toString()) : (l.precision ? o = d : o = d < 10 ? Math[v](d * 10) / 10 : Math[v](d), o = o.toString(), typeof l.decimal == "string" && (o = o.replace(".", l.decimal)), o);
+    function t(o, l, u) {
+      var d = o / l, v = u.round ? "round" : "floor";
+      return u.decimal === !1 ? (o = Math[v](d), o.toString()) : (u.precision ? o = d : o = d < 10 ? Math[v](d * 10) / 10 : Math[v](d), o = o.toString(), typeof u.decimal == "string" && (o = o.replace(".", u.decimal)), o);
     }
-    var a = 1e3, n = 1e4, i = 1e6, u = 1e9, f = 1e12;
-    function c(o, s) {
-      var l;
-      s = s || {};
+    var a = 1e3, n = 1e4, i = 1e6, s = 1e9, f = 1e12;
+    function c(o, l) {
+      var u;
+      l = l || {};
       var d = o < 0;
-      d && (o = Math.abs(o)), s.precision && (o = parseFloat(o.toPrecision(s.precision)));
-      var v = s.min10k ? n : a;
-      return o < v || s.precision && s.precision > Math.log10(o) ? l = r(t(o, 1, s), s) : o < i ? l = t(o, a, s) + "k" : o < u ? l = t(o, i, s) + "m" : o < f ? l = r(t(o, u, s), s) + "b" : l = r(t(o, f, s), s) + "t", d && (l = "-" + l), s.capital && (l = l.toUpperCase()), s.prefix && (l = s.prefix + l), s.suffix && (l = l + s.suffix), l;
+      d && (o = Math.abs(o)), l.precision && (o = parseFloat(o.toPrecision(l.precision)));
+      var v = l.min10k ? n : a;
+      return o < v || l.precision && l.precision > Math.log10(o) ? u = r(t(o, 1, l), l) : o < i ? u = t(o, a, l) + "k" : o < s ? u = t(o, i, l) + "m" : o < f ? u = r(t(o, s, l), l) + "b" : u = r(t(o, f, l), l) + "t", d && (u = "-" + u), l.capital && (u = u.toUpperCase()), l.prefix && (u = l.prefix + u), l.suffix && (u = u + l.suffix), u;
     }
     c.addCommas = r, e.exports = c;
   })();
@@ -772,7 +772,7 @@ const _ = "24px", D = (e, r) => {
   for (const [a, n] of r)
     t[a] = n;
   return t;
-}, Mr = (e) => (L("data-v-4a507ffb"), e = e(), M(), e), Dr = ["aria-hidden"], Or = {
+}, Mr = (e) => (L("data-v-005a4b79"), e = e(), M(), e), Dr = ["aria-hidden"], Or = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, Fr = /* @__PURE__ */ Mr(() => /* @__PURE__ */ I("path", {
@@ -871,7 +871,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), Br = /* @__PURE__ */ D(Hr, [["__scopeId", "data-v-4a507ffb"]]), $r = (e) => (L("data-v-b85466d4"), e = e(), M(), e), Pr = ["aria-hidden"], Kr = {
+}), Br = /* @__PURE__ */ D(Hr, [["__scopeId", "data-v-005a4b79"]]), $r = (e) => (L("data-v-21b356a3"), e = e(), M(), e), Pr = ["aria-hidden"], Kr = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, Zr = /* @__PURE__ */ $r(() => /* @__PURE__ */ I("path", {
@@ -970,7 +970,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), Gr = /* @__PURE__ */ D(Ur, [["__scopeId", "data-v-b85466d4"]]), jr = (e) => (L("data-v-ef124a21"), e = e(), M(), e), Xr = ["aria-hidden"], Yr = {
+}), Gr = /* @__PURE__ */ D(Ur, [["__scopeId", "data-v-21b356a3"]]), jr = (e) => (L("data-v-ca54d0fc"), e = e(), M(), e), Yr = ["aria-hidden"], Xr = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, Qr = /* @__PURE__ */ jr(() => /* @__PURE__ */ I("path", {
@@ -1062,14 +1062,14 @@ const _ = "24px", D = (e, r) => {
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (p(), y("title", Yr, R(e.title), 1)) : T("", !0),
+          e.title ? (p(), y("title", Xr, R(e.title), 1)) : T("", !0),
           Qr
-        ], 8, Xr))
+        ], 8, Yr))
       ]),
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), De = /* @__PURE__ */ D(Wr, [["__scopeId", "data-v-ef124a21"]]), Jr = (e) => (L("data-v-db841c99"), e = e(), M(), e), et = ["aria-hidden"], rt = {
+}), De = /* @__PURE__ */ D(Wr, [["__scopeId", "data-v-ca54d0fc"]]), Jr = (e) => (L("data-v-3cadd6e0"), e = e(), M(), e), et = ["aria-hidden"], rt = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, tt = /* @__PURE__ */ Jr(() => /* @__PURE__ */ I("path", {
@@ -1168,13 +1168,13 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), nt = /* @__PURE__ */ D(it, [["__scopeId", "data-v-db841c99"]]), at = (e) => (L("data-v-38334840"), e = e(), M(), e), ot = ["aria-hidden"], st = {
+}), nt = /* @__PURE__ */ D(it, [["__scopeId", "data-v-3cadd6e0"]]), at = (e) => (L("data-v-ad741ea1"), e = e(), M(), e), ot = ["aria-hidden"], lt = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
-}, ut = /* @__PURE__ */ at(() => /* @__PURE__ */ I("path", {
+}, st = /* @__PURE__ */ at(() => /* @__PURE__ */ I("path", {
   d: "M15.25 5C14.9 5 14.6042 4.87917 14.3625 4.6375C14.1208 4.39583 14 4.1 14 3.75C14 3.4 14.1208 3.10417 14.3625 2.8625C14.6042 2.62083 14.9 2.5 15.25 2.5C15.6 2.5 15.8958 2.62083 16.1375 2.8625C16.3792 3.10417 16.5 3.4 16.5 3.75C16.5 4.1 16.3792 4.39583 16.1375 4.6375C15.8958 4.87917 15.6 5 15.25 5ZM15.25 21.5C14.9 21.5 14.6042 21.3792 14.3625 21.1375C14.1208 20.8958 14 20.6 14 20.25C14 19.9 14.1208 19.6042 14.3625 19.3625C14.6042 19.1208 14.9 19 15.25 19C15.6 19 15.8958 19.1208 16.1375 19.3625C16.3792 19.6042 16.5 19.9 16.5 20.25C16.5 20.6 16.3792 20.8958 16.1375 21.1375C15.8958 21.3792 15.6 21.5 15.25 21.5ZM19.25 8.5C18.9 8.5 18.6042 8.37917 18.3625 8.1375C18.1208 7.89583 18 7.6 18 7.25C18 6.9 18.1208 6.60417 18.3625 6.3625C18.6042 6.12083 18.9 6 19.25 6C19.6 6 19.8958 6.12083 20.1375 6.3625C20.3792 6.60417 20.5 6.9 20.5 7.25C20.5 7.6 20.3792 7.89583 20.1375 8.1375C19.8958 8.37917 19.6 8.5 19.25 8.5ZM19.25 18C18.9 18 18.6042 17.8792 18.3625 17.6375C18.1208 17.3958 18 17.1 18 16.75C18 16.4 18.1208 16.1042 18.3625 15.8625C18.6042 15.6208 18.9 15.5 19.25 15.5C19.6 15.5 19.8958 15.6208 20.1375 15.8625C20.3792 16.1042 20.5 16.4 20.5 16.75C20.5 17.1 20.3792 17.3958 20.1375 17.6375C19.8958 17.8792 19.6 18 19.25 18ZM20.75 13.25C20.4 13.25 20.1042 13.1292 19.8625 12.8875C19.6208 12.6458 19.5 12.35 19.5 12C19.5 11.65 19.6208 11.3542 19.8625 11.1125C20.1042 10.8708 20.4 10.75 20.75 10.75C21.1 10.75 21.3958 10.8708 21.6375 11.1125C21.8792 11.3542 22 11.65 22 12C22 12.35 21.8792 12.6458 21.6375 12.8875C21.3958 13.1292 21.1 13.25 20.75 13.25ZM12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2V4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20V22ZM12 14C11.45 14 10.9792 13.8042 10.5875 13.4125C10.1958 13.0208 10 12.55 10 12C10 11.9167 10.0042 11.8292 10.0125 11.7375C10.0208 11.6458 10.0417 11.5583 10.075 11.475L8 9.4L9.4 8L11.475 10.075C11.5417 10.0583 11.7167 10.0333 12 10C12.55 10 13.0208 10.1958 13.4125 10.5875C13.8042 10.9792 14 11.45 14 12C14 12.55 13.8042 13.0208 13.4125 13.4125C13.0208 13.8042 12.55 14 12 14Z",
   fill: "currentColor"
-}, null, -1)), lt = /* @__PURE__ */ k({
+}, null, -1)), ut = /* @__PURE__ */ k({
   __name: "ResponseIcon",
   props: {
     /** The accessibility text provided to screen readers */
@@ -1260,14 +1260,14 @@ const _ = "24px", D = (e, r) => {
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (p(), y("title", st, R(e.title), 1)) : T("", !0),
-          ut
+          e.title ? (p(), y("title", lt, R(e.title), 1)) : T("", !0),
+          st
         ], 8, ot))
       ]),
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), dt = /* @__PURE__ */ D(lt, [["__scopeId", "data-v-38334840"]]), ct = (e) => (L("data-v-3a4a2ac9"), e = e(), M(), e), ft = ["aria-hidden"], pt = {
+}), dt = /* @__PURE__ */ D(ut, [["__scopeId", "data-v-ad741ea1"]]), ct = (e) => (L("data-v-72597234"), e = e(), M(), e), ft = ["aria-hidden"], pt = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, vt = /* @__PURE__ */ ct(() => /* @__PURE__ */ I("path", {
@@ -1366,7 +1366,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), yt = /* @__PURE__ */ D(gt, [["__scopeId", "data-v-3a4a2ac9"]]), mt = (e) => (L("data-v-a1f815c9"), e = e(), M(), e), ht = ["aria-hidden"], Ct = {
+}), yt = /* @__PURE__ */ D(gt, [["__scopeId", "data-v-72597234"]]), mt = (e) => (L("data-v-06c8e6ba"), e = e(), M(), e), ht = ["aria-hidden"], Ct = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, bt = /* @__PURE__ */ mt(() => /* @__PURE__ */ I("path", {
@@ -1465,7 +1465,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), wt = /* @__PURE__ */ D(St, [["__scopeId", "data-v-a1f815c9"]]), _t = (e) => (L("data-v-83ea4abf"), e = e(), M(), e), Rt = ["aria-hidden"], Tt = {
+}), wt = /* @__PURE__ */ D(St, [["__scopeId", "data-v-06c8e6ba"]]), _t = (e) => (L("data-v-b493c18d"), e = e(), M(), e), Rt = ["aria-hidden"], Tt = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, Nt = /* @__PURE__ */ _t(() => /* @__PURE__ */ I("path", {
@@ -1564,7 +1564,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), It = /* @__PURE__ */ D(Et, [["__scopeId", "data-v-83ea4abf"]]), xt = (e) => (L("data-v-cfdb88e2"), e = e(), M(), e), kt = ["aria-hidden"], qt = {
+}), It = /* @__PURE__ */ D(Et, [["__scopeId", "data-v-b493c18d"]]), xt = (e) => (L("data-v-a3d7bf8b"), e = e(), M(), e), kt = ["aria-hidden"], qt = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, zt = /* @__PURE__ */ xt(() => /* @__PURE__ */ I("path", {
@@ -1663,7 +1663,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), Vt = /* @__PURE__ */ D(At, [["__scopeId", "data-v-cfdb88e2"]]), Lt = (e) => (L("data-v-0d61bc5b"), e = e(), M(), e), Mt = ["aria-hidden"], Dt = {
+}), Vt = /* @__PURE__ */ D(At, [["__scopeId", "data-v-a3d7bf8b"]]), Lt = (e) => (L("data-v-42ff3f58"), e = e(), M(), e), Mt = ["aria-hidden"], Dt = {
   key: 0,
   "data-testid": "kui-icon-svg-title"
 }, Ot = /* @__PURE__ */ Lt(() => /* @__PURE__ */ I("path", {
@@ -1762,7 +1762,7 @@ const _ = "24px", D = (e, r) => {
       _: 1
     }, 8, ["aria-hidden", "style"]));
   }
-}), Oe = /* @__PURE__ */ D(Ft, [["__scopeId", "data-v-0d61bc5b"]]), ge = 2, Ne = ge + 2, Ht = (e, r, t = !1) => {
+}), Oe = /* @__PURE__ */ D(Ft, [["__scopeId", "data-v-42ff3f58"]]), ge = 2, Ne = ge + 2, Ht = (e, r, t = !1) => {
   let a = !r || Number(e.toFixed(Ne)) === 0 ? 0 : Number(e.toFixed(Ne)) > 0 ? 1 : -1;
   return t && (a *= -1), a;
 }, Bt = (e, r, t) => r ? `${Math.abs(e * 100).toFixed(ge)}%` : t, $t = (e, r) => r === 0 ? 0 : e / r - 1, Pt = (e, r = !1) => (r && (e *= -1), e > 0 ? wt : e < 0 ? yt : De), Kt = "#ad000e", fe = "#6c7489", Ee = "#52596e", Zt = "#007d60", J = "16px", Ut = "20px";
@@ -1770,10 +1770,10 @@ var F = /* @__PURE__ */ ((e) => (e.GENERIC_COUNT = "GenericCount", e.TRAFFIC = "
 const Gt = { class: "metricscard" }, jt = {
   key: 0,
   class: "metricscard-description"
-}, Xt = {
+}, Yt = {
   key: 0,
   class: "metricscard-error"
-}, Yt = {
+}, Xt = {
   key: 2,
   class: "metricscard-trend"
 }, Qt = { "data-testid": "metric-trend-change" }, Wt = {
@@ -1863,9 +1863,9 @@ const Gt = { class: "metricscard" }, jt = {
         grey: `var(--kong-ui-metric-card-trend-neutral, ${Ee})`
       };
       return c > 0 ? o.green : c < 0 ? o.red : o.grey;
-    }, n = (c) => c > 0 ? "positive" : c < 0 ? "negative" : "neutral", i = [q.Medium, q.Large, q.LargeCompact].includes(t.cardSize), u = g(() => t.cardSize === q.LargeCompact), f = [q.Small, q.LargeCompact].includes(t.cardSize);
+    }, n = (c) => c > 0 ? "positive" : c < 0 ? "negative" : "neutral", i = [q.Medium, q.Large, q.LargeCompact].includes(t.cardSize), s = g(() => t.cardSize === q.LargeCompact), f = [q.Small, q.LargeCompact].includes(t.cardSize);
     return (c, o) => {
-      const s = qe("KTooltip");
+      const l = qe("KTooltip");
       return p(), y("div", Gt, [
         I("div", {
           class: G(["metricscard-title", e.cardSize])
@@ -1878,18 +1878,18 @@ const Gt = { class: "metricscard" }, jt = {
           }, null, 8, ["color", "size"])),
           (p(), N(z(e.titleTag), null, {
             default: A(() => [
-              Xe(R(e.title), 1)
+              Ye(R(e.title), 1)
             ]),
             _: 1
           })),
-          e.tooltip ? (p(), N(s, {
+          e.tooltip ? (p(), N(l, {
             key: 1,
             class: "metricscard-tooltip",
             placement: "right",
             text: e.tooltip
           }, {
             default: A(() => [
-              X(w(nt), {
+              Y(w(nt), {
                 color: w(fe),
                 size: w(J)
               }, null, 8, ["color", "size"])
@@ -1897,14 +1897,14 @@ const Gt = { class: "metricscard" }, jt = {
             _: 1
           }, 8, ["text"])) : T("", !0)
         ], 2),
-        e.description && w(i) && !u.value ? (p(), y("div", jt, [
+        e.description && w(i) && !s.value ? (p(), y("div", jt, [
           I("span", null, R(e.description), 1)
         ])) : T("", !0),
         I("div", {
-          class: G(["metricscard-valuetrend", { "is-compact": u.value }])
+          class: G(["metricscard-valuetrend", { "is-compact": s.value }])
         }, [
-          e.hasError ? (p(), y("div", Xt, [
-            X(w(Oe), {
+          e.hasError ? (p(), y("div", Yt, [
+            Y(w(Oe), {
               color: w(fe),
               size: w(Ut)
             }, null, 8, ["color", "size"]),
@@ -1914,7 +1914,7 @@ const Gt = { class: "metricscard" }, jt = {
             class: G(["metricscard-value", e.cardSize]),
             "data-testid": "metric-value"
           }, R(e.metricValue), 3)),
-          w(i) ? (p(), y("div", Yt, [
+          w(i) ? (p(), y("div", Xt, [
             I("div", {
               class: G(["metricscard-trend-change", n(e.changePolarity)]),
               "data-testid": "metric-trend-parent"
@@ -1945,8 +1945,8 @@ const Gt = { class: "metricscard" }, jt = {
 function ii(e, r) {
   const t = qe("KSkeletonBox");
   return p(), y("div", ti, [
-    X(t, { width: "100" }),
-    X(t, { width: "75" })
+    Y(t, { width: "100" }),
+    Y(t, { width: "75" })
   ]);
 }
 const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c40"]]), ai = {
@@ -1955,13 +1955,13 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
 }, oi = {
   key: 1,
   class: "error-display"
-}, si = {
+}, li = {
   key: 0,
   class: "error-display-message"
-}, ui = {
+}, si = {
   key: 2,
   class: "cards-wrapper"
-}, li = /* @__PURE__ */ k({
+}, ui = /* @__PURE__ */ k({
   __name: "MetricCardContainer",
   props: {
     fallbackDisplayText: {
@@ -2000,12 +2000,12 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
   },
   setup(e) {
     const r = e, t = g(() => r.cards.every((n) => (n == null ? void 0 : n.hasError) === !0)), a = (n) => {
-      const i = $t(n.currentValue, n.previousValue) || 0, u = Ht(i, r.hasTrendAccess, n.increaseIsBad);
+      const i = $t(n.currentValue, n.previousValue) || 0, s = Ht(i, r.hasTrendAccess, n.increaseIsBad);
       return {
         metricValue: n.formatValueFn ? n.formatValueFn(n.currentValue) : Lr(n.currentValue, { capital: !0, round: !0 }) || "0",
         metricChange: n.formatChangeFn ? n.formatChangeFn(i) : Bt(i, r.hasTrendAccess, r.fallbackDisplayText),
-        changePolarity: u,
-        trendIcon: Pt(u, n.increaseIsBad),
+        changePolarity: s,
+        trendIcon: Pt(s, n.increaseIsBad),
         cardSize: r.cardSize,
         hasContainerTitle: !!r.containerTitle
       };
@@ -2015,29 +2015,29 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
     }, [
       r.containerTitle ? (p(), y("div", ai, R(r.containerTitle), 1)) : T("", !0),
       t.value ? (p(), y("div", oi, [
-        X(w(Oe), { class: "error-display-icon" }),
-        e.errorMessage ? (p(), y("div", si, R(e.errorMessage), 1)) : T("", !0)
-      ])) : (p(), y("div", ui, [
-        (p(!0), y(Se, null, Ye(e.cards, (u, f) => (p(), y(Se, null, [
+        Y(w(Oe), { class: "error-display-icon" }),
+        e.errorMessage ? (p(), y("div", li, R(e.errorMessage), 1)) : T("", !0)
+      ])) : (p(), y("div", si, [
+        (p(!0), y(Se, null, Xe(e.cards, (s, f) => (p(), y(Se, null, [
           e.loading ? (p(), N(ni, {
             key: `skeleton-${f}`,
             class: G(e.cardSize === w(q).Small ? "loading-tabs-small" : "loading-tabs-large")
-          }, null, 8, ["class"])) : (p(), N(ei, Qe({ key: f }, a(u), {
+          }, null, 8, ["class"])) : (p(), N(ei, Qe({ key: f }, a(s), {
             "card-size": e.cardSize,
-            "card-type": u.cardType,
-            description: u.description,
+            "card-type": s.cardType,
+            description: s.description,
             "error-message": e.errorMessage,
-            "has-error": u.hasError,
-            title: u.title,
-            "title-tag": u.titleTag,
-            tooltip: u.tooltip,
-            "trend-range": u.trendRange
+            "has-error": s.hasError,
+            title: s.title,
+            "title-tag": s.titleTag,
+            tooltip: s.tooltip,
+            "trend-range": s.trendRange
           }), null, 16, ["card-size", "card-type", "description", "error-message", "has-error", "title", "title-tag", "tooltip", "trend-range"]))
         ], 64))), 256))
       ]))
     ], 2));
   }
-}), di = /* @__PURE__ */ ye(li, [["__scopeId", "data-v-0483795d"]]), mi = /* @__PURE__ */ k({
+}), di = /* @__PURE__ */ ye(ui, [["__scopeId", "data-v-0483795d"]]), mi = /* @__PURE__ */ k({
   __name: "MetricsConsumer",
   props: {
     lookupKey: { default: void 0 },
@@ -2048,7 +2048,7 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
     const r = e, t = xe(Le);
     if (!t)
       throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");
-    const { traffic: a, latency: n } = t.data, { i18n: i } = K.useI18n(), u = K.useMetricCardBuilder({
+    const { traffic: a, latency: n } = t.data, { i18n: i } = K.useI18n(), s = K.useMetricCardBuilder({
       cardType: F.TRAFFIC,
       title: g(() => t.longCardTitles ? i.t("metricCard.long.traffic") : i.t("metricCard.short.traffic")),
       description: t.description,
@@ -2070,7 +2070,7 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
         increaseIsBad: !0,
         trendRange: a.trendRange.value
       };
-    }), o = (m) => `${m}ms`, s = K.useMetricCardBuilder({
+    }), o = (m) => `${m}ms`, l = K.useMetricCardBuilder({
       cardType: F.LATENCY,
       title: g(() => t.longCardTitles ? i.t("metricCard.long.latency") : i.t("metricCard.short.latency")),
       description: t.description,
@@ -2080,8 +2080,8 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
       increaseIsBad: !0,
       formatValueFn: o,
       trendRange: n.trendRange
-    }), l = g(() => r.cardToDisplay === "TRAFFIC" ? [u.value] : r.cardToDisplay === "ERROR_RATE" ? [c.value] : r.cardToDisplay === "LATENCY" ? [s.value] : [u.value, c.value, s.value]), d = g(() => r.cardToDisplay === "TRAFFIC" || r.cardToDisplay === "ERROR_RATE" ? a.isLoading.value : r.cardToDisplay === "LATENCY" ? n.isLoading.value : a.isLoading.value || n.isLoading.value), v = g(() => ({
-      cards: l.value,
+    }), u = g(() => r.cardToDisplay === "TRAFFIC" ? [s.value] : r.cardToDisplay === "ERROR_RATE" ? [c.value] : r.cardToDisplay === "LATENCY" ? [l.value] : [s.value, c.value, l.value]), d = g(() => r.cardToDisplay === "TRAFFIC" || r.cardToDisplay === "ERROR_RATE" ? a.isLoading.value : r.cardToDisplay === "LATENCY" ? n.isLoading.value : a.isLoading.value || n.isLoading.value), v = g(() => ({
+      cards: u.value,
       containerTitle: t.containerTitle,
       loading: d.value,
       hasTrendAccess: t.hasTrendAccess.value,
@@ -2091,14 +2091,14 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
       hideTitle: !0
     })), b = g(() => ({
       loading: v.value.loading,
-      trafficCard: u.value,
+      trafficCard: s.value,
       errorRateCard: c.value,
-      latencyCard: s.value,
+      latencyCard: l.value,
       errorRateFormatted: f(c.value.currentValue),
-      latencyFormatted: o(s.value.currentValue)
+      latencyFormatted: o(l.value.currentValue)
     }));
     return (m, h) => ke(m.$slots, "default", { cardValues: b.value }, () => [
-      X(w(di), We(Je(v.value)), null, 16)
+      Y(w(di), We(Je(v.value)), null, 16)
     ]);
   }
 }), ee = (e) => new Date(e), hi = (e, r) => {
@@ -2109,30 +2109,30 @@ const ni = /* @__PURE__ */ ye(ri, [["render", ii], ["__scopeId", "data-v-f7eb9c4
   });
 }, Ie = (e) => e.reduce((r, t) => (r[t] = { name: t }, r), {}), ci = (e, r) => {
   var b, m;
-  const t = re.get(te.ONE_DAY), a = e.granularity === "trend" ? new rr(t) : new tr(t), n = a.endMs(), i = a.startMs(), u = a.granularityMs(), f = e.granularity === "trend" ? 2 : 1;
+  const t = re.get(te.ONE_DAY), a = e.granularity === "trend" ? new rr(t) : new tr(t), n = a.endMs(), i = a.startMs(), s = a.granularityMs(), f = e.granularity === "trend" ? 2 : 1;
   if ((e.dimensions ?? []).length > 2)
     throw new Error(`Explore only supports 0-2 dimensions; got: ${JSON.stringify(e.dimensions)}`);
-  const c = (e.dimensions ?? []).find((h) => h !== "time"), o = (r == null ? void 0 : r.dimensionNames) ?? [], s = Math.max(o.length, 1), l = e.metrics || [], d = [];
+  const c = (e.dimensions ?? []).find((h) => h !== "time"), o = (r == null ? void 0 : r.dimensionNames) ?? [], l = Math.max(o.length, 1), u = e.metrics || [], d = [];
   for (let h = 0; h < f; h++)
-    for (let x = 0; x < s; x++) {
+    for (let x = 0; x < l; x++) {
       const S = c ? { [c]: o[x] } : {};
       (b = e.dimensions) != null && b.includes("status_code_grouped") ? Q.forEach((C) => {
-        const H = l.reduce((E, $) => (E[$] = (f - h) * 1e3 + 100 * x + 1, E), { ...S, status_code_grouped: C });
+        const H = u.reduce((E, $) => (E[$] = (f - h) * 1e3 + 100 * x + 1, E), { ...S, status_code_grouped: C });
         d.push({
           version: "v1",
-          timestamp: h === 0 ? ee(i).toISOString() : ee(i + u).toISOString(),
+          timestamp: h === 0 ? ee(i).toISOString() : ee(i + s).toISOString(),
           event: H
         });
       }) : d.push({
         version: "v1",
-        timestamp: h === 0 ? ee(i).toISOString() : ee(i + u).toISOString(),
-        event: l.reduce((C, H) => (C[H] = (f - h) * 1e3 + 100 * x + 1, C), { ...S })
+        timestamp: h === 0 ? ee(i).toISOString() : ee(i + s).toISOString(),
+        event: u.reduce((C, H) => (C[H] = (f - h) * 1e3 + 100 * x + 1, C), { ...S })
       });
     }
   const v = {
     start_ms: i,
     end_ms: n,
-    granularity_ms: u,
+    granularity_ms: s,
     display: c ? {
       [c]: Ie(o),
       ...(m = e.dimensions) != null && m.includes("status_code_grouped") ? { status_code_grouped: Ie(Q) } : {}