@kong-ui-public/dashboard-renderer 0.13.1 → 0.13.2

package/dist/dashboard-renderer.es.js

@@ -1,4 +1,4 @@
-import { ref as m, watchEffect as Ge, defineComponent as C, inject as re, onUnmounted as xe, computed as g, resolveComponent as U, unref as f, openBlock as y, createBlock as I, withCtx as k, createTextVNode as Ie, toDisplayString as F, renderSlot as ne, createCommentVNode as B, useCssVars as M, createElementVNode as K, createVNode as E, createElementBlock as A, normalizeProps as Te, guardReactiveProps as Me, withModifiers as He, watch as Ye, resolveDynamicComponent as Ae, normalizeStyle as X, pushScopeId as Ze, popScopeId as We, createSlots as Je, mergeProps as Qe, onMounted as Xe, Fragment as et, renderList as tt, normalizeClass as rt } from "vue";
+import { ref as g, watchEffect as Ge, defineComponent as E, inject as re, onUnmounted as xe, computed as v, resolveComponent as U, unref as m, openBlock as h, createBlock as T, withCtx as S, createTextVNode as Ie, toDisplayString as F, renderSlot as ne, createCommentVNode as B, useCssVars as M, createElementVNode as K, createVNode as q, createElementBlock as C, normalizeProps as Te, guardReactiveProps as Me, withModifiers as He, watch as Ye, resolveDynamicComponent as Ae, normalizeStyle as X, pushScopeId as Ze, popScopeId as We, createSlots as Je, mergeProps as Qe, onMounted as Xe, Fragment as et, renderList as tt, normalizeClass as rt } from "vue";
 import { ChartMetricDisplay as nt, ChartTypesSimple as it, SimpleChart as at, ChartTypes as ee, AnalyticsChart as Ce, TopNTable as ot } from "@kong-ui-public/analytics-chart";
 import st from "swrv";
 import ue from "axios";
@@ -8,7 +8,7 @@ import { Timeframe as ut, GranularityKeys as pe, TimePeriods as pt } from "@kong
 import "@kong/kongponents";
 import "vue-router";
 const Y = 170, Ne = "analytics-query-provider", de = "{entity-id}", dt = "{cp-id}";
-var x = /* @__PURE__ */ ((e) => (e.HorizontalBar = "horizontal_bar", e.VerticalBar = "vertical_bar", e.Gauge = "gauge", e.TimeseriesLine = "timeseries_line", e.GoldenSignals = "golden_signals", e.TopN = "top_n", e.Slottable = "slottable", e))(x || {});
+var I = /* @__PURE__ */ ((e) => (e.HorizontalBar = "horizontal_bar", e.VerticalBar = "vertical_bar", e.Gauge = "gauge", e.TimeseriesLine = "timeseries_line", e.GoldenSignals = "golden_signals", e.TopN = "top_n", e.Slottable = "slottable", e))(I || {});
 const Z = {
   type: "string"
 }, W = {
@@ -144,7 +144,7 @@ const Z = {
     }
   },
   required: ["type"]
-}, _t = {
+}, bt = {
   type: "object",
   description: "A filter that specifies which data to include in the query",
   properties: {
@@ -185,7 +185,7 @@ const Z = {
     "type",
     "values"
   ]
-}, bt = {
+}, _t = {
   type: "object",
   properties: {
     tz: {
@@ -305,7 +305,7 @@ const Z = {
     filters: {
       type: "array",
       description: "A list of filters to apply to the query.",
-      items: _t
+      items: bt
     },
     granularity_ms: {
       type: "number",
@@ -315,7 +315,7 @@ const Z = {
     time_range: {
       description: "The time range to query.",
       oneOf: [
-        bt,
+        _t,
         wt
       ],
       default: {
@@ -414,8 +414,8 @@ const Tt = (e) => {
   return e ? !!// TODO: revisit: currently only the first check ever matters?
   ((t = Object.keys(e)) != null && t.length || (r = e.data) != null && r.length || (n = (i = e.data) == null ? void 0 : i.data) != null && n.length || !((o = e.data) != null && o.data) && typeof e.data == "object" && Object.keys(e == null ? void 0 : e.data).length) : !1;
 };
-function At(e = m({}), t, r, i = Tt) {
-  const n = m(
+function At(e = g({}), t, r, i = Tt) {
+  const n = g(
     "PENDING"
     /* PENDING */
   );
@@ -469,7 +469,7 @@ function Nt() {
 }
 const De = {
   useI18n: Nt
-}, J = /* @__PURE__ */ C({
+}, J = /* @__PURE__ */ E({
   __name: "QueryDataProvider",
   props: {
     context: {},
@@ -478,11 +478,11 @@ const De = {
   },
   emits: ["queryComplete"],
   setup(e, { emit: t }) {
-    const r = e, i = t, { i18n: n } = De.useI18n(), o = re(Ne), a = () => r.queryReady && o ? JSON.stringify([r.query, r.context]) : null, l = new AbortController();
+    const r = e, i = t, { i18n: n } = De.useI18n(), o = re(Ne), a = () => r.queryReady && o ? JSON.stringify([r.query, r.context]) : null, s = new AbortController();
     xe(() => {
-      l.abort();
+      s.abort();
     });
-    const { data: s, error: c, isValidating: v } = st(a, async () => {
+    const { data: l, error: f, isValidating: p } = st(a, async () => {
       var N, j, O, $;
       try {
         const u = [];
@@ -495,7 +495,7 @@ const De = {
           },
           filters: u
         };
-        return o == null ? void 0 : o.queryFn(H, l);
+        return o == null ? void 0 : o.queryFn(H, s);
       } catch (u) {
         d.value = ((j = (N = u == null ? void 0 : u.response) == null ? void 0 : N.data) == null ? void 0 : j.message) === "Range not allowed for this tier" ? n.t("queryDataProvider.timeRangeExceeded") : (($ = (O = u == null ? void 0 : u.response) == null ? void 0 : O.data) == null ? void 0 : $.message) || (u == null ? void 0 : u.message);
       } finally {
@@ -504,30 +504,30 @@ const De = {
     }, {
       refreshInterval: 0,
       revalidateOnFocus: !1
-    }), { state: p, swrvState: h } = At(s, c, v), d = m(null), q = g(() => p.value === h.ERROR || !!d.value), b = g(() => !r.queryReady || p.value === h.PENDING);
+    }), { state: c, swrvState: y } = At(l, f, p), d = g(null), w = v(() => c.value === y.ERROR || !!d.value), b = v(() => !r.queryReady || c.value === y.PENDING);
     return (N, j) => {
       const O = U("KSkeleton"), $ = U("KEmptyState");
-      return b.value || !f(s) && !q.value ? (y(), I(O, {
+      return b.value || !m(l) && !w.value ? (h(), T(O, {
         key: 0,
         class: "chart-skeleton",
         type: "table"
-      })) : q.value ? (y(), I($, {
+      })) : w.value ? (h(), T($, {
         key: 1,
         "action-button-visible": !1,
         "data-testid": "chart-empty-state",
         "icon-variant": "error"
       }, {
-        default: k(() => [
+        default: S(() => [
           Ie(F(d.value), 1)
         ]),
         _: 1
-      })) : f(s) ? ne(N.$slots, "default", {
+      })) : m(l) ? ne(N.$slots, "default", {
         key: 2,
-        data: f(s)
+        data: m(l)
       }) : B("", !0);
     };
   }
-}), Ot = { class: "analytics-chart" }, Rt = /* @__PURE__ */ C({
+}), Ot = { class: "analytics-chart" }, Rt = /* @__PURE__ */ E({
   __name: "SimpleChartRenderer",
   props: {
     query: {},
@@ -541,19 +541,19 @@ const De = {
       "8c62ff26": `${n.height}px`
     }));
     const t = e, r = {
-      [x.Gauge]: it.GAUGE
-    }, i = g(() => ({
+      [I.Gauge]: it.GAUGE
+    }, i = v(() => ({
       ...t.chartOptions,
       type: r[t.chartOptions.type]
     }));
-    return (n, o) => (y(), I(J, {
+    return (n, o) => (h(), T(J, {
       context: n.context,
       query: n.query,
       "query-ready": n.queryReady
     }, {
-      default: k(({ data: a }) => [
+      default: S(({ data: a }) => [
         K("div", Ot, [
-          E(f(at), {
+          q(m(at), {
             "chart-data": a,
             "chart-options": i.value,
             "synthetics-data-key": n.chartOptions.syntheticsDataKey
@@ -568,7 +568,7 @@ const De = {
   for (const [i, n] of t)
     r[i] = n;
   return r;
-}, Lt = /* @__PURE__ */ D(Rt, [["__scopeId", "data-v-f0f6ed41"]]), Dt = { class: "analytics-chart" }, jt = /* @__PURE__ */ C({
+}, Lt = /* @__PURE__ */ D(Rt, [["__scopeId", "data-v-f0f6ed41"]]), Dt = { class: "analytics-chart" }, jt = /* @__PURE__ */ E({
   __name: "BarChartRenderer",
   props: {
     query: {},
@@ -582,21 +582,21 @@ const De = {
       "1eed717c": `${n.height}px`
     }));
     const t = e, r = {
-      [x.HorizontalBar]: ee.HORIZONTAL_BAR,
-      [x.VerticalBar]: ee.VERTICAL_BAR
-    }, i = g(() => ({
+      [I.HorizontalBar]: ee.HORIZONTAL_BAR,
+      [I.VerticalBar]: ee.VERTICAL_BAR
+    }, i = v(() => ({
       type: r[t.chartOptions.type],
       stacked: t.chartOptions.stacked,
       chartDatasetColors: t.chartOptions.chartDatasetColors
     }));
-    return (n, o) => (y(), I(J, {
+    return (n, o) => (h(), T(J, {
       context: n.context,
       query: n.query,
       "query-ready": n.queryReady
     }, {
-      default: k(({ data: a }) => [
+      default: S(({ data: a }) => [
         K("div", Dt, [
-          E(f(Ce), {
+          q(m(Ce), {
             "allow-csv-export": n.chartOptions.allowCsvExport,
             "chart-data": a,
             "chart-options": i.value,
@@ -611,7 +611,7 @@ const De = {
       _: 1
     }, 8, ["context", "query", "query-ready"]));
   }
-}), ye = /* @__PURE__ */ D(jt, [["__scopeId", "data-v-36598a1b"]]), $t = { class: "analytics-chart" }, zt = /* @__PURE__ */ C({
+}), ye = /* @__PURE__ */ D(jt, [["__scopeId", "data-v-36598a1b"]]), $t = { class: "analytics-chart" }, zt = /* @__PURE__ */ E({
   __name: "TimeseriesChartRenderer",
   props: {
     query: {},
@@ -625,9 +625,9 @@ const De = {
       "24c2946a": `${n.height}px`
     }));
     const t = e, r = {
-      [x.TimeseriesLine]: ee.TIMESERIES_LINE
+      [I.TimeseriesLine]: ee.TIMESERIES_LINE
       // TODO: Timeseries bar
-    }, i = g(() => {
+    }, i = v(() => {
       const n = t.chartOptions.stacked ?? !1;
       return {
         type: r[t.chartOptions.type],
@@ -636,14 +636,14 @@ const De = {
         chartDatasetColors: t.chartOptions.chartDatasetColors
       };
     });
-    return (n, o) => (y(), I(J, {
+    return (n, o) => (h(), T(J, {
       context: n.context,
       query: n.query,
       "query-ready": n.queryReady
     }, {
-      default: k(({ data: a }) => [
+      default: S(({ data: a }) => [
         K("div", $t, [
-          E(f(Ce), {
+          q(m(Ce), {
             "allow-csv-export": n.chartOptions.allowCsvExport,
             "chart-data": a,
             "chart-options": i.value,
@@ -657,7 +657,7 @@ const De = {
       _: 1
     }, 8, ["context", "query", "query-ready"]));
   }
-}), Pt = /* @__PURE__ */ D(zt, [["__scopeId", "data-v-93ab34da"]]), Ut = { class: "metric-card-tile-wrapper" }, Ft = /* @__PURE__ */ C({
+}), Pt = /* @__PURE__ */ D(zt, [["__scopeId", "data-v-93ab34da"]]), Ut = { class: "metric-card-tile-wrapper" }, Ft = /* @__PURE__ */ E({
   __name: "GoldenSignalsRenderer",
   props: {
     query: {},
@@ -667,7 +667,7 @@ const De = {
     height: {}
   },
   setup(e) {
-    const t = e, r = g(() => {
+    const t = e, r = v(() => {
       const n = t.context.timeSpec;
       if (n.type === "absolute")
         return new ut({
@@ -686,7 +686,7 @@ const De = {
       if (!o)
         throw new Error("Unknown time range");
       return o;
-    }), i = g(() => ({
+    }), i = v(() => ({
       overrideTimeframe: r.value,
       tz: t.context.tz,
       additionalFilter: t.context.filters,
@@ -695,10 +695,10 @@ const De = {
       hasTrendAccess: !0,
       refreshInterval: 0
     }));
-    return (n, o) => (y(), A("div", Ut, [
-      E(f(lt), Te(Me(i.value)), {
-        default: k(() => [
-          E(f(ct), { class: "metric-consumer" })
+    return (n, o) => (h(), C("div", Ut, [
+      q(m(lt), Te(Me(i.value)), {
+        default: S(() => [
+          q(m(ct), { class: "metric-consumer" })
         ]),
         _: 1
       }, 16)
@@ -867,8 +867,8 @@ function $e() {
       return !1;
     const n = /* @__PURE__ */ new Set([...r, ...i]);
     for (const o of n) {
-      const a = r.filter((s) => s === o).length, l = i.filter((s) => s === o).length;
-      if (a !== l)
+      const a = r.filter((l) => l === o).length, s = i.filter((l) => l === o).length;
+      if (a !== s)
         return !1;
     }
     return !0;
@@ -912,79 +912,79 @@ function tr(e, t, r, i = {
   r || (r = "100");
   const { axiosInstance: n } = ie({
     headers: e.requestHeaders
-  }), { i18n: { t: o } } = ae(), { debounce: a } = Bt(), l = a(async (u) => {
+  }), { i18n: { t: o } } = ae(), { debounce: a } = Bt(), s = a(async (u) => {
     await $(u);
-  }, 200), s = m(!1), c = m(""), v = m(""), p = m([]), h = m([]), d = m(void 0), q = f(t);
-  let b = `${e.apiBaseUrl}${q}`;
+  }, 200), l = g(!1), f = g(""), p = g(""), c = g([]), y = g([]), d = g(void 0), w = m(t);
+  let b = `${e.apiBaseUrl}${w}`;
   e.app === "konnect" ? b = b.replace(/{controlPlaneId}/gi, (e == null ? void 0 : e.controlPlaneId) || "") : e.app === "kongManager" && (b = b.replace(/\/{workspace}/gi, e != null && e.workspace ? `/${e.workspace}` : ""));
   const { isValidUuid: N } = $e(), j = async () => {
     try {
-      s.value = !0;
+      l.value = !0;
       const { data: u } = await n.get(`${b}?size=${r}`);
-      u != null && u.next || (d.value = i.fetchedItemsKey in u ? u[i.fetchedItemsKey] : []), h.value = i.fetchedItemsKey in u ? u[i.fetchedItemsKey] : [], p.value = h.value;
+      u != null && u.next || (d.value = i.fetchedItemsKey in u ? u[i.fetchedItemsKey] : []), y.value = i.fetchedItemsKey in u ? u[i.fetchedItemsKey] : [], c.value = y.value;
     } catch {
-      p.value = [], c.value = o("debouncedFilter.errors.fetch");
+      c.value = [], f.value = o("debouncedFilter.errors.fetch");
     } finally {
-      s.value = !1;
+      l.value = !1;
     }
-  }, O = m(""), $ = async (u) => {
+  }, O = g(""), $ = async (u) => {
     var H, le, ce;
     if (O.value !== u)
       if (O.value = u || "", d.value === void 0)
         try {
-          if (s.value = !0, c.value = "", v.value = "", e.app === "konnect") {
-            let S = b + "";
-            u && (S += `/${u}`);
-            const { data: T } = await n.get(`${S}?size=${r}`);
-            i.fetchedItemsKey in T ? p.value = T[i.fetchedItemsKey] : T != null && T.id ? p.value = [T] : p.value = [];
+          if (l.value = !0, f.value = "", p.value = "", e.app === "konnect") {
+            let x = b + "";
+            u && (x += `/${u}`);
+            const { data: A } = await n.get(`${x}?size=${r}`);
+            i.fetchedItemsKey in A ? c.value = A[i.fetchedItemsKey] : A != null && A.id ? c.value = [A] : c.value = [];
           } else if (u) {
-            const S = [];
-            N(u) && i.searchKeys.includes("id") ? S.push((async () => {
-              const { data: w } = await n.get(`${b}/${u}`);
-              return [w[i.fetchedItemsKey] ?? w];
-            })()) : S.push(
-              ...i.searchKeys.filter((w) => w !== "id").map(async (w) => {
-                const { data: R } = await n.get(`${b}?${w}=${u}`);
+            const x = [];
+            N(u) && i.searchKeys.includes("id") ? x.push((async () => {
+              const { data: k } = await n.get(`${b}/${u}`);
+              return [k[i.fetchedItemsKey] ?? k];
+            })()) : x.push(
+              ...i.searchKeys.filter((k) => k !== "id").map(async (k) => {
+                const { data: R } = await n.get(`${b}?${k}=${u}`);
                 return R[i.fetchedItemsKey];
               })
             );
-            const T = await Promise.all(S), V = /* @__PURE__ */ new Set();
-            p.value = [], (H = T == null ? void 0 : T.forEach) == null || H.call(T, (w) => {
+            const A = await Promise.all(x), V = /* @__PURE__ */ new Set();
+            c.value = [], (H = A == null ? void 0 : A.forEach) == null || H.call(A, (k) => {
               var R;
-              (R = w == null ? void 0 : w.forEach) == null || R.call(w, (Q) => {
-                V.has(Q.id) || (V.add(Q.id), p.value.push(Q));
+              (R = k == null ? void 0 : k.forEach) == null || R.call(k, (Q) => {
+                V.has(Q.id) || (V.add(Q.id), c.value.push(Q));
               });
             });
           } else
-            p.value = h.value;
-        } catch (S) {
-          ((le = S == null ? void 0 : S.response) == null ? void 0 : le.status) === 404 ? v.value = o("debouncedFilter.errors.invalid") : (p.value = [], c.value = o("debouncedFilter.errors.fetch"));
+            c.value = y.value;
+        } catch (x) {
+          ((le = x == null ? void 0 : x.response) == null ? void 0 : le.status) === 404 ? p.value = o("debouncedFilter.errors.invalid") : (c.value = [], f.value = o("debouncedFilter.errors.fetch"));
         } finally {
-          s.value = !1;
+          l.value = !1;
         }
       else
-        s.value = !0, v.value = "", u ? (p.value = (ce = d.value) == null ? void 0 : ce.filter((S) => {
-          var T;
+        l.value = !0, p.value = "", u ? (c.value = (ce = d.value) == null ? void 0 : ce.filter((x) => {
+          var A;
           let V = !1;
-          for (const w of i.searchKeys) {
-            const R = typeof S[w] == "string" ? (T = S[w]) == null ? void 0 : T.toLowerCase() : S[w];
+          for (const k of i.searchKeys) {
+            const R = typeof x[k] == "string" ? (A = x[k]) == null ? void 0 : A.toLowerCase() : x[k];
             R != null && R.includes(u.toLowerCase()) && (V = !0);
           }
           return V;
-        }), (!p.value || !p.value.length) && (v.value = o("debouncedFilter.errors.invalid"))) : p.value = d.value, s.value = !1;
+        }), (!c.value || !c.value.length) && (p.value = o("debouncedFilter.errors.invalid"))) : c.value = d.value, l.value = !1;
   };
   return {
-    loading: s,
-    error: c,
-    validationError: v,
-    results: p,
+    loading: l,
+    error: f,
+    validationError: p,
+    results: c,
     allRecords: d,
     loadItems: j,
-    debouncedQueryChange: l
+    debouncedQueryChange: s
   };
 }
 function rr(e, t) {
-  const r = f(t), i = g(
+  const r = m(t), i = v(
     () => e.apiBaseUrl.startsWith("/") ? new URL(`${window.location.origin}${r}`) : new URL(r)
   );
   return i.value.search = "", (n) => `${i.value.href}/${n}`;
@@ -1003,8 +1003,8 @@ function nr() {
           return t.response.data.detail;
         if ((n = t.response.data.details) != null && n.length)
           return t.response.data.details.map((a) => {
-            let l = e("errors.unexpected");
-            return a.messages && typeof a.messages == "object" && a.messages.length && (l = a.messages.join(", ")), a.field ? `${a.field} - ${l}` : l;
+            let s = e("errors.unexpected");
+            return a.messages && typeof a.messages == "object" && a.messages.length && (s = a.messages.join(", ")), a.field ? `${a.field} - ${s}` : s;
           }).join("; ");
         if (t.response.data.message) {
           const { message: a } = t.response.data;
@@ -1031,66 +1031,72 @@ function ir(e) {
   }
 }
 function ze(e, t) {
-  const r = m(f(e)), i = m(f(t)), n = g(
+  const r = g(m(e)), i = g(m(t)), n = v(
     () => !!(r.value.app === "konnect" || r.value.isExactMatch)
-  ), o = g(
+  ), o = v(
     () => i.value.startsWith("/") ? new URL(`${window.location.origin}${i.value}`) : new URL(i.value)
   );
   return (a) => {
-    const { page: l, pageSize: s, offset: c, sortColumnKey: v, sortColumnOrder: p, query: h } = a;
+    const { page: s, pageSize: l, offset: f, sortColumnKey: p, sortColumnOrder: c, query: y } = a;
     try {
       let d = new URL(o.value.href);
-      return n.value && h ? (d.search = "", d = r.value.isExactMatch ? new URL(`${d.href}/${h}/`) : new URL(`${d.href}?filter[name][contains]=${h}`)) : (n.value || new URLSearchParams(h).forEach((q, b) => {
-        d.searchParams.append(b, q);
-      }), v && d.searchParams.append("sort_by", v), p === "desc" && d.searchParams.append("sort_desc", "1"), d.searchParams.append("size", String(s))), c && l !== 1 && d.searchParams.append("offset", String(c)), d.href;
+      return n.value && y ? (d.search = "", d = r.value.isExactMatch ? new URL(`${d.href}/${y}/`) : new URL(`${d.href}?filter[name][contains]=${y}`)) : (n.value || new URLSearchParams(y).forEach((w, b) => {
+        d.searchParams.append(b, w);
+      }), p && d.searchParams.append("sort_by", p), c === "desc" && d.searchParams.append("sort_desc", "1"), d.searchParams.append("size", String(l))), f && s !== 1 && d.searchParams.append("offset", String(f)), d.href;
     } catch (d) {
       return console.error("RouteList(fetcher)", d), i.value;
     }
   };
 }
 function ar(e, t, r = "data") {
-  const i = f(t), { axiosInstance: n } = ie({
-    headers: e.requestHeaders
-  }), o = ze(e, i), a = m({
+  var i;
+  const n = m(t), { axiosInstance: o } = ie({
+    ...e.axiosRequestConfig,
+    headers: { ...(i = e.axiosRequestConfig) == null ? void 0 : i.headers, ...e.requestHeaders }
+  }), a = ze(e, n), s = g({
     status: P.Idle
   });
   return { fetcher: async (l) => {
+    var f;
     try {
-      a.value = { status: P.Loading };
-      let s = o(l);
-      s.includes("filter[name]") && (s = `${s}&page[size]=${l.pageSize}&page[number]=${l.page}`);
-      const { data: c } = await n.get(s), v = r && r.replace(/[^\w-_]/gi, "");
-      let p;
-      c[v] && Array.isArray(c[v]) ? p = c[v] : Array.isArray(c) ? p = c : p = Object.keys(c).length ? [c] : [];
-      const h = {
-        data: p,
-        total: p.length,
-        ...c.offset ? {
+      s.value = { status: P.Loading };
+      let p = a(l);
+      p.includes("filter[name]") && (p = `${p}&page[size]=${l.pageSize}&page[number]=${l.page}`);
+      const c = await o.get(p);
+      if (c.status >= 400)
+        throw c;
+      const y = c.data, d = r && r.replace(/[^\w-_]/gi, "");
+      let w;
+      y[d] && Array.isArray(y[d]) ? w = y[d] : Array.isArray(y) ? w = y : w = Object.keys(y).length ? [y] : [];
+      const b = {
+        data: w,
+        total: w.length,
+        ...y.offset ? {
           pagination: {
-            offset: c.offset
+            offset: y.offset
           }
         } : null
       };
-      return a.value = {
+      return s.value = {
         status: P.Idle,
-        response: h
-      }, h;
-    } catch (s) {
+        response: b
+      }, b;
+    } catch (p) {
       const c = {
         data: [],
         total: 0
       };
-      return l.query && s.response.status === 404 ? (a.value = {
+      return l.query && (((f = p.response) == null ? void 0 : f.status) === 404 || p.status === 404) ? (s.value = {
         status: P.NoResults,
         response: c,
-        error: s
-      }, c) : (a.value = {
+        error: p.response ? p : { response: p }
+      }, c) : (s.value = {
         status: P.Error,
         response: c,
-        error: s
+        error: p.response ? p : { response: p }
       }, c);
     }
-  }, fetcherState: a };
+  }, fetcherState: s };
 }
 function or() {
   const e = (r, i = "_") => r ? r.split(i).map((n) => n.toLowerCase() === "id" ? n.toUpperCase() : n.charAt(0).toUpperCase() + n.substring(1)).join(" ") : "", t = /(?:^|[\s-:'"])\w/g;
@@ -1135,11 +1141,11 @@ const Pe = /^[v^~<>=]*?(\d+)(?:\.([x*]|\d+)(?:\.([x*]|\d+)(?:\.([x*]|\d+))?(?:-(
   "<=": [-1, 0],
   "<": [-1],
   "!=": [-1, 1]
-}, _e = Object.keys(Ue), ur = (e) => {
+}, be = Object.keys(Ue), ur = (e) => {
   if (typeof e != "string")
     throw new TypeError(`Invalid operator type, expected string but got ${typeof e}`);
-  if (_e.indexOf(e) === -1)
-    throw new Error(`Invalid operator, expected one of ${_e.join("|")}`);
+  if (be.indexOf(e) === -1)
+    throw new Error(`Invalid operator, expected one of ${be.join("|")}`);
 }, pr = (e) => typeof e == "string" && /^[v\d]/.test(e) && Pe.test(e);
 function dr(e) {
   const { gatewayInfo: t, supportedRange: r } = e;
@@ -1151,18 +1157,18 @@ function dr(e) {
   const o = r[i];
   if (!o)
     return !1;
-  const [a, l] = o;
-  return !(a && ve(n, a, "<") || l && ve(n, l, ">"));
+  const [a, s] = o;
+  return !(a && ve(n, a, "<") || s && ve(n, s, ">"));
 }
 function yr(e) {
-  const t = m(0), r = m(0), i = m(!1);
+  const t = g(0), r = g(0), i = g(!1);
   return Ye(e, (n) => {
     n && !i.value && (t.value = n.offsetWidth, r.value = n.scrollWidth, i.value = !0);
   }), {
-    isTruncated: g(() => t.value < r.value)
+    isTruncated: v(() => t.value < r.value)
   };
 }
-const be = {
+const _e = {
   useAxios: ie,
   useDebouncedFilter: tr,
   useDeleteUrlBuilder: rr,
@@ -1191,14 +1197,14 @@ function gr(e) {
 function vr(e) {
   return Array.isArray(e) ? e : Fe(e) ? [] : [e];
 }
-function _r(e, t) {
+function br(e, t) {
   var r, i, n, o;
   if (t)
     for (o = Object.keys(t), r = 0, i = o.length; r < i; r += 1)
       n = o[r], e[n] = t[n];
   return e;
 }
-function br(e, t) {
+function _r(e, t) {
   var r = "", i;
   for (i = 0; i < t; i += 1)
     r += e;
@@ -1207,7 +1213,7 @@ function br(e, t) {
 function wr(e) {
   return e === 0 && Number.NEGATIVE_INFINITY === 1 / e;
 }
-var kr = Fe, Sr = gr, xr = vr, Ir = br, Tr = wr, Ar = _r, oe = {
+var kr = Fe, Sr = gr, xr = vr, Ir = _r, Tr = wr, Ar = br, oe = {
   isNothing: kr,
   isObject: Sr,
   toArray: xr,
@@ -1582,17 +1588,17 @@ function cn(e) {
   return e === null ? !1 : Ve.exec(e) !== null || Be.exec(e) !== null;
 }
 function un(e) {
-  var t, r, i, n, o, a, l, s = 0, c = null, v, p, h;
+  var t, r, i, n, o, a, s, l = 0, f = null, p, c, y;
   if (t = Ve.exec(e), t === null && (t = Be.exec(e)), t === null)
     throw new Error("Date resolve error");
   if (r = +t[1], i = +t[2] - 1, n = +t[3], !t[4])
     return new Date(Date.UTC(r, i, n));
-  if (o = +t[4], a = +t[5], l = +t[6], t[7]) {
-    for (s = t[7].slice(0, 3); s.length < 3; )
-      s += "0";
-    s = +s;
+  if (o = +t[4], a = +t[5], s = +t[6], t[7]) {
+    for (l = t[7].slice(0, 3); l.length < 3; )
+      l += "0";
+    l = +l;
   }
-  return t[9] && (v = +t[10], p = +(t[11] || 0), c = (v * 60 + p) * 6e4, t[9] === "-" && (c = -c)), h = new Date(Date.UTC(r, i, n, o, a, l, s)), c && h.setTime(h.getTime() - c), h;
+  return t[9] && (p = +t[10], c = +(t[11] || 0), f = (p * 60 + c) * 6e4, t[9] === "-" && (f = -f)), y = new Date(Date.UTC(r, i, n, o, a, s, l)), f && y.setTime(y.getTime() - f), y;
 }
 function pn(e) {
   return e.toISOString();
@@ -1625,10 +1631,10 @@ function hn(e) {
   return i % 8 === 0;
 }
 function mn(e) {
-  var t, r, i = e.replace(/[\r\n=]/g, ""), n = i.length, o = se, a = 0, l = [];
+  var t, r, i = e.replace(/[\r\n=]/g, ""), n = i.length, o = se, a = 0, s = [];
   for (t = 0; t < n; t++)
-    t % 4 === 0 && t && (l.push(a >> 16 & 255), l.push(a >> 8 & 255), l.push(a & 255)), a = a << 6 | o.indexOf(i.charAt(t));
-  return r = n % 4 * 6, r === 0 ? (l.push(a >> 16 & 255), l.push(a >> 8 & 255), l.push(a & 255)) : r === 18 ? (l.push(a >> 10 & 255), l.push(a >> 2 & 255)) : r === 12 && l.push(a >> 4 & 255), new Uint8Array(l);
+    t % 4 === 0 && t && (s.push(a >> 16 & 255), s.push(a >> 8 & 255), s.push(a & 255)), a = a << 6 | o.indexOf(i.charAt(t));
+  return r = n % 4 * 6, r === 0 ? (s.push(a >> 16 & 255), s.push(a >> 8 & 255), s.push(a & 255)) : r === 18 ? (s.push(a >> 10 & 255), s.push(a >> 2 & 255)) : r === 12 && s.push(a >> 4 & 255), new Uint8Array(s);
 }
 function gn(e) {
   var t = "", r = 0, i, n, o = e.length, a = se;
@@ -1639,22 +1645,22 @@ function gn(e) {
 function vn(e) {
   return Object.prototype.toString.call(e) === "[object Uint8Array]";
 }
-var _n = new _("tag:yaml.org,2002:binary", {
+var bn = new _("tag:yaml.org,2002:binary", {
   kind: "scalar",
   resolve: hn,
   construct: mn,
   predicate: vn,
   represent: gn
-}), bn = Object.prototype.hasOwnProperty, wn = Object.prototype.toString;
+}), _n = Object.prototype.hasOwnProperty, wn = Object.prototype.toString;
 function kn(e) {
   if (e === null)
     return !0;
-  var t = [], r, i, n, o, a, l = e;
-  for (r = 0, i = l.length; r < i; r += 1) {
-    if (n = l[r], a = !1, wn.call(n) !== "[object Object]")
+  var t = [], r, i, n, o, a, s = e;
+  for (r = 0, i = s.length; r < i; r += 1) {
+    if (n = s[r], a = !1, wn.call(n) !== "[object Object]")
       return !1;
     for (o in n)
-      if (bn.call(n, o))
+      if (_n.call(n, o))
         if (!a)
           a = !0;
         else
@@ -1723,7 +1729,7 @@ ln.extend({
     fn
   ],
   explicit: [
-    _n,
+    bn,
     xn,
     Cn,
     On
@@ -1747,7 +1753,7 @@ const Se = "24px", Dn = (e, t) => {
 }, Pn = /* @__PURE__ */ jn(() => /* @__PURE__ */ K("path", {
   d: "M5 22C4.45 22 3.97917 21.8042 3.5875 21.4125C3.19583 21.0208 3 20.55 3 20V6H5V20H16V22H5ZM9 18C8.45 18 7.97917 17.8042 7.5875 17.4125C7.19583 17.0208 7 16.55 7 16V4C7 3.45 7.19583 2.97917 7.5875 2.5875C7.97917 2.19583 8.45 2 9 2H18C18.55 2 19.0208 2.19583 19.4125 2.5875C19.8042 2.97917 20 3.45 20 4V16C20 16.55 19.8042 17.0208 19.4125 17.4125C19.0208 17.8042 18.55 18 18 18H9ZM9 16H18V4H9V16Z",
   fill: "currentColor"
-}, null, -1)), Un = /* @__PURE__ */ C({
+}, null, -1)), Un = /* @__PURE__ */ E({
   __name: "CopyIcon",
   props: {
     /** The accessibility text provided to screen readers */
@@ -1799,7 +1805,7 @@ const Se = "24px", Dn = (e, t) => {
     }
   },
   setup(e) {
-    const t = e, r = g(() => {
+    const t = e, r = v(() => {
       if (typeof t.size == "number" && t.size > 0)
         return `${t.size}px`;
       if (typeof t.size == "string") {
@@ -1808,7 +1814,7 @@ const Se = "24px", Dn = (e, t) => {
           return `${o}px`;
       }
       return Se;
-    }), i = g(() => ({
+    }), i = v(() => ({
       boxSizing: "border-box",
       color: t.color,
       display: t.display,
@@ -1816,14 +1822,14 @@ const Se = "24px", Dn = (e, t) => {
       lineHeight: "0",
       width: r.value
     }));
-    return (n, o) => (y(), I(Ae(e.as), {
+    return (n, o) => (h(), T(Ae(e.as), {
       "aria-hidden": e.decorative ? "true" : void 0,
       class: "kui-icon copy-icon",
       "data-testid": "kui-icon-wrapper-copy-icon",
       style: X(i.value)
     }, {
-      default: k(() => [
-        (y(), A("svg", {
+      default: S(() => [
+        (h(), C("svg", {
           "aria-hidden": e.decorative ? "true" : void 0,
           "data-testid": "kui-icon-svg-copy-icon",
           fill: "none",
@@ -1833,7 +1839,7 @@ const Se = "24px", Dn = (e, t) => {
           width: "100%",
           xmlns: "http://www.w3.org/2000/svg"
         }, [
-          e.title ? (y(), A("title", zn, F(e.title), 1)) : B("", !0),
+          e.title ? (h(), C("title", zn, F(e.title), 1)) : B("", !0),
           Pn
         ], 8, $n))
       ]),
@@ -1846,7 +1852,7 @@ const Se = "24px", Dn = (e, t) => {
 }, Vn = {
   key: 0,
   class: "deleted-entity"
-}, Bn = { key: 1 }, Gn = ["onClick"], Mn = /* @__PURE__ */ C({
+}, Bn = { key: 1 }, Gn = ["onClick"], Mn = /* @__PURE__ */ E({
   __name: "EntityLink",
   props: {
     entityLinkData: {
@@ -1870,26 +1876,26 @@ const Se = "24px", Dn = (e, t) => {
     }
   },
   setup(e) {
-    const t = e, r = m(), { isTruncated: i } = be.useTruncationDetector(r), { i18n: { t: n } } = be.useI18n(), o = n("global.actions.copyId"), a = m(o), l = g(() => t.entityLinkData.deleted ?? !1), s = g(() => t.entityLinkData.id.toString().includes(":") ? t.entityLinkData.id.toString().split(":")[1] : t.entityLinkData.id), c = g(() => `${s.value.toString().slice(0, 5)} (deleted)`), v = async (p) => {
-      await p(s.value || "") && (a.value = n("global.actions.copyToClipboard"), setTimeout(() => {
+    const t = e, r = g(), { isTruncated: i } = _e.useTruncationDetector(r), { i18n: { t: n } } = _e.useI18n(), o = n("global.actions.copyId"), a = g(o), s = v(() => t.entityLinkData.deleted ?? !1), l = v(() => t.entityLinkData.id.toString().includes(":") ? t.entityLinkData.id.toString().split(":")[1] : t.entityLinkData.id), f = v(() => `${l.value.toString().slice(0, 5)} (deleted)`), p = async (c) => {
+      await c(l.value || "") && (a.value = n("global.actions.copyToClipboard"), setTimeout(() => {
         a.value = o;
       }, 1800));
     };
-    return (p, h) => {
-      const d = U("KTooltip"), q = U("KExternalLink"), b = U("KClipboardProvider");
-      return y(), A("div", Kn, [
-        l.value ? (y(), A("div", Vn, F(c.value), 1)) : s.value ? s.value ? (y(), I(q, {
+    return (c, y) => {
+      const d = U("KTooltip"), w = U("KExternalLink"), b = U("KClipboardProvider");
+      return h(), C("div", Kn, [
+        s.value ? (h(), C("div", Vn, F(f.value), 1)) : l.value ? l.value ? (h(), T(w, {
           key: 2,
           class: "entity-link",
           "hide-icon": !e.newWindow,
           href: e.externalLink,
           target: e.newWindow ? "_blank" : "_self"
         }, {
-          default: k(() => [
-            E(d, {
-              text: f(i) && e.entityLinkData.label || ""
+          default: S(() => [
+            q(d, {
+              text: m(i) && e.entityLinkData.label || ""
             }, {
-              default: k(() => [
+              default: S(() => [
                 K("span", {
                   ref_key: "textContent",
                   ref: r,
@@ -1900,26 +1906,26 @@ const Se = "24px", Dn = (e, t) => {
             }, 8, ["text"])
           ]),
           _: 1
-        }, 8, ["hide-icon", "href", "target"])) : B("", !0) : (y(), A("div", Bn, F(" – "))),
-        s.value && e.allowCopy ? (y(), I(d, {
+        }, 8, ["hide-icon", "href", "target"])) : B("", !0) : (h(), C("div", Bn, F(" – "))),
+        l.value && e.allowCopy ? (h(), T(d, {
           key: a.value,
           class: "copy-uuid-tooltip",
           "max-width": "160",
           placement: "bottomEnd",
           text: a.value
         }, {
-          default: k(() => [
-            E(b, null, {
-              default: k(({ copyToClipboard: N }) => [
+          default: S(() => [
+            q(b, null, {
+              default: S(({ copyToClipboard: N }) => [
                 K("span", {
                   class: "entity-link-copy-id",
-                  onClick: He((j) => v(N), ["stop"])
+                  onClick: He((j) => p(N), ["stop"])
                 }, [
-                  E(f(Fn), {
+                  q(m(Fn), {
                     class: "copy-icon",
-                    color: f(hr),
+                    color: m(hr),
                     "data-testid": "copy-id",
-                    size: f(mr)
+                    size: m(mr)
                   }, null, 8, ["color", "size"])
                 ], 8, Gn)
               ]),
@@ -1931,7 +1937,7 @@ const Se = "24px", Dn = (e, t) => {
       ]);
     };
   }
-}), Hn = /* @__PURE__ */ fr(Mn, [["__scopeId", "data-v-ff8e5179"]]), Yn = /* @__PURE__ */ C({
+}), Hn = /* @__PURE__ */ fr(Mn, [["__scopeId", "data-v-ff8e5179"]]), Yn = /* @__PURE__ */ E({
   __name: "TopNTableRenderer",
   props: {
     query: {},
@@ -1951,13 +1957,13 @@ const Se = "24px", Dn = (e, t) => {
           return t.chartOptions.entityLink.replace(de, i.id);
       return "";
     };
-    return (i, n) => (y(), I(J, {
+    return (i, n) => (h(), T(J, {
       context: i.context,
       query: i.query,
       "query-ready": i.queryReady
     }, {
-      default: k(({ data: o }) => [
-        E(f(ot), {
+      default: S(({ data: o }) => [
+        q(m(ot), {
           data: o,
           description: i.chartOptions.description,
           "synthetics-data-key": i.chartOptions.syntheticsDataKey,
@@ -1965,8 +1971,8 @@ const Se = "24px", Dn = (e, t) => {
         }, Je({ _: 2 }, [
           t.chartOptions.entityLink ? {
             name: "name",
-            fn: k(({ record: a }) => [
-              E(f(Hn), {
+            fn: S(({ record: a }) => [
+              q(m(Hn), {
                 "entity-link-data": {
                   id: a.id,
                   label: a.name,
@@ -1982,7 +1988,7 @@ const Se = "24px", Dn = (e, t) => {
       _: 1
     }, 8, ["context", "query", "query-ready"]));
   }
-}), Zn = { class: "tile-boundary" }, Wn = /* @__PURE__ */ C({
+}), Zn = { class: "tile-boundary" }, Wn = /* @__PURE__ */ E({
   __name: "DashboardTile",
   props: {
     definition: {},
@@ -1994,14 +2000,14 @@ const Se = "24px", Dn = (e, t) => {
       a16bb866: `${o.height}px`
     }));
     const t = parseInt(je, 10), r = e, i = {
-      [x.TimeseriesLine]: Pt,
-      [x.HorizontalBar]: ye,
-      [x.VerticalBar]: ye,
-      [x.Gauge]: Lt,
-      [x.GoldenSignals]: Kt,
-      [x.TopN]: Yn,
-      [x.Slottable]: void 0
-    }, n = g(() => {
+      [I.TimeseriesLine]: Pt,
+      [I.HorizontalBar]: ye,
+      [I.VerticalBar]: ye,
+      [I.Gauge]: Lt,
+      [I.GoldenSignals]: Kt,
+      [I.TopN]: Yn,
+      [I.Slottable]: void 0
+    }, n = v(() => {
       const o = i[r.definition.chart.type];
       return o && {
         component: o,
@@ -2015,11 +2021,11 @@ const Se = "24px", Dn = (e, t) => {
         }
       };
     });
-    return (o, a) => (y(), A("div", Zn, [
-      n.value ? (y(), I(Ae(n.value.component), Te(Qe({ key: 0 }, n.value.rendererProps)), null, 16)) : B("", !0)
+    return (o, a) => (h(), C("div", Zn, [
+      n.value ? (h(), T(Ae(n.value.component), Te(Qe({ key: 0 }, n.value.rendererProps)), null, 16)) : B("", !0)
     ]));
   }
-}), Jn = /* @__PURE__ */ D(Wn, [["__scopeId", "data-v-3d6e352f"]]), Qn = /* @__PURE__ */ C({
+}), Jn = /* @__PURE__ */ D(Wn, [["__scopeId", "data-v-3d6e352f"]]), Qn = /* @__PURE__ */ E({
   __name: "GridLayout",
   props: {
     gridSize: {
@@ -2042,7 +2048,7 @@ const Se = "24px", Dn = (e, t) => {
       "14978e90": e.gridSize.rows,
       "70cb8937": `${e.tileHeight}px`
     }));
-    const t = e, r = m(null), i = m(0), n = new ResizeObserver((a) => {
+    const t = e, r = g(null), i = g(0), n = new ResizeObserver((a) => {
       i.value = a[0].contentRect.width;
     });
     Xe(() => {
@@ -2050,8 +2056,8 @@ const Se = "24px", Dn = (e, t) => {
     }), xe(() => {
       r.value && n.unobserve(r.value);
     });
-    const o = g(() => t.tiles.map((a, l) => ({
-      key: `tile-${l}`,
+    const o = v(() => t.tiles.map((a, s) => ({
+      key: `tile-${s}`,
       tile: a,
       style: {
         "grid-column-start": a.layout.position.col + 1,
@@ -2060,21 +2066,21 @@ const Se = "24px", Dn = (e, t) => {
         "grid-row-end": a.layout.position.row + 1 + a.layout.size.rows
       }
     })));
-    return (a, l) => (y(), A("div", {
+    return (a, s) => (h(), C("div", {
       ref_key: "gridContainer",
       ref: r,
       class: "kong-ui-public-grid-layout"
     }, [
-      (y(!0), A(et, null, tt(o.value, (s) => (y(), A("div", {
-        key: s.key,
+      (h(!0), C(et, null, tt(o.value, (l) => (h(), C("div", {
+        key: l.key,
         class: rt(["grid-cell", {
-          "empty-cell": !s.tile
+          "empty-cell": !l.tile
         }]),
-        style: X(s.style)
+        style: X(l.style)
       }, [
         ne(a.$slots, "tile", {
-          style: X(s.style),
-          tile: s.tile
+          style: X(l.style),
+          tile: l.tile
         }, void 0, !0)
       ], 6))), 128))
     ], 512));
@@ -2082,7 +2088,7 @@ const Se = "24px", Dn = (e, t) => {
 }), Xn = /* @__PURE__ */ D(Qn, [["__scopeId", "data-v-371c2765"]]), ei = { class: "kong-ui-public-dashboard-renderer" }, ti = {
   key: 0,
   class: "tile-container"
-}, ri = /* @__PURE__ */ C({
+}, ri = /* @__PURE__ */ E({
   __name: "DashboardRenderer",
   props: {
     context: {},
@@ -2091,42 +2097,42 @@ const Se = "24px", Dn = (e, t) => {
   setup(e) {
     const t = e, { i18n: r } = De.useI18n(), i = re(Ne);
     i || (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"));
-    const n = g(() => t.config.tiles.map((a, l) => ({
+    const n = v(() => t.config.tiles.map((a, s) => ({
       layout: a.layout,
       meta: a.definition,
       // Add a unique key to each tile internally.
-      id: l
-    }))), o = g(() => t.context.tz ? t.context : {
+      id: s
+    }))), o = v(() => t.context.tz ? t.context : {
       ...t.context,
       tz: new Intl.DateTimeFormat().resolvedOptions().timeZone
     });
-    return (a, l) => {
-      const s = U("KAlert");
-      return y(), A("div", ei, [
-        f(i) ? (y(), I(Xn, {
+    return (a, s) => {
+      const l = U("KAlert");
+      return h(), C("div", ei, [
+        m(i) ? (h(), T(Xn, {
           key: 1,
           "grid-size": a.config.gridSize,
           "tile-height": a.config.tileHeight,
           tiles: n.value
         }, {
-          tile: k(({ tile: c }) => [
-            c.meta.chart.type === f(x).Slottable ? (y(), A("div", ti, [
-              ne(a.$slots, c.meta.chart.id, {}, void 0, !0)
-            ])) : (y(), I(Jn, {
+          tile: S(({ tile: f }) => [
+            f.meta.chart.type === m(I).Slottable ? (h(), C("div", ti, [
+              ne(a.$slots, f.meta.chart.id, {}, void 0, !0)
+            ])) : (h(), T(Jn, {
               key: 1,
               class: "tile-container",
               context: o.value,
-              definition: c.meta,
-              height: c.layout.size.rows * (a.config.tileHeight || f(Y)) + parseInt(f(je), 10)
+              definition: f.meta,
+              height: f.layout.size.rows * (a.config.tileHeight || m(Y)) + parseInt(m(je), 10)
             }, null, 8, ["context", "definition", "height"]))
           ]),
           _: 3
-        }, 8, ["grid-size", "tile-height", "tiles"])) : (y(), I(s, {
+        }, 8, ["grid-size", "tile-height", "tiles"])) : (h(), T(l, {
           key: 0,
           appearance: "danger"
         }, {
-          default: k(() => [
-            Ie(F(f(r).t("renderer.noQueryBridge")), 1)
+          default: S(() => [
+            Ie(F(m(r).t("renderer.noQueryBridge")), 1)
           ]),
           _: 1
         }))
@@ -2136,7 +2142,7 @@ const Se = "24px", Dn = (e, t) => {
 }), yi = /* @__PURE__ */ D(ri, [["__scopeId", "data-v-1af70010"]]);
 export {
   dt as CP_ID_TOKEN,
-  x as ChartTypes,
+  I as ChartTypes,
   Y as DEFAULT_TILE_HEIGHT,
   yi as DashboardRenderer,
   de as ENTITY_ID_TOKEN,