@kong-ui-public/dashboard-renderer 0.30.1 → 0.30.2

package/dist/dashboard-renderer.es.js

@@ -1,14 +1,14 @@
-import { ref as A, watchEffect as de, inject as K, defineComponent as E, onUnmounted as oe, computed as v, watch as pe, resolveComponent as N, unref as l, openBlock as p, createBlock as g, withCtx as _, createTextVNode as M, toDisplayString as O, renderSlot as Q, createCommentVNode as w, useCssVars as $, createElementVNode as L, createVNode as F, mergeProps as ae, createSlots as ie, createElementBlock as D, normalizeProps as ye, guardReactiveProps as he, resolveDynamicComponent as me, onMounted as fe, Fragment as ge, renderList as ve, normalizeClass as be, normalizeStyle as te } from "vue";
+import { ref as A, watchEffect as de, inject as j, defineComponent as T, onUnmounted as ne, computed as v, watch as pe, resolveComponent as L, unref as u, openBlock as d, createBlock as g, withCtx as b, createTextVNode as V, toDisplayString as w, renderSlot as H, createCommentVNode as k, useCssVars as B, createElementVNode as P, createVNode as O, mergeProps as oe, createSlots as ae, createElementBlock as D, normalizeProps as ye, guardReactiveProps as he, resolveDynamicComponent as me, onMounted as fe, Fragment as ge, renderList as ve, normalizeClass as be, normalizeStyle as ee } from "vue";
 import { SimpleChart as _e, AnalyticsChart as qe, TopNTable as Ce, CsvExportModal as Se, ChartMetricDisplay as Ee } from "@kong-ui-public/analytics-chart";
 import xe from "swrv";
 import "axios";
 import { createI18n as Te, i18nTComponent as Ae } from "@kong-ui-public/i18n";
-import { stripUnknownFilters as De, Timeframe as Ie, TimePeriods as Re, granularityValues as ke, exploreFilterTypesV2 as we, exploreAggregations as Oe, queryableExploreDimensions as Fe, filterableExploreDimensions as Pe, basicExploreAggregations as Le, queryableBasicExploreDimensions as Ne, filterableBasicExploreDimensions as $e, aiExploreAggregations as je, queryableAiExploreDimensions as Ke, filterableAiExploreDimensions as ze, relativeTimeRangeValuesV4 as Ve } from "@kong-ui-public/analytics-utilities";
-import { MetricsProvider as Me, MetricsConsumer as Be } from "@kong-ui-public/analytics-metric-provider";
+import { stripUnknownFilters as De, Timeframe as Ie, TimePeriods as Re, granularityValues as ke, exploreFilterTypesV2 as we, exploreAggregations as Oe, queryableExploreDimensions as Fe, filterableExploreDimensions as Pe, basicExploreAggregations as Le, queryableBasicExploreDimensions as Ne, filterableBasicExploreDimensions as $e, aiExploreAggregations as je, queryableAiExploreDimensions as ze, filterableAiExploreDimensions as Ke, relativeTimeRangeValuesV4 as Ve } from "@kong-ui-public/analytics-utilities";
+import { MetricsProvider as Be, MetricsConsumer as Me } from "@kong-ui-public/analytics-metric-provider";
 import { EntityLink as Ue } from "@kong-ui-public/entities-shared";
 import { MoreIcon as Ge } from "@kong/icons";
 import { useAnalyticsConfigStore as He } from "@kong-ui-public/analytics-config-store";
-var se = /* @__PURE__ */ ((e) => (e.VALIDATING = "VALIDATING", e.VALIDATING_HAS_DATA = "VALIDATING_HAS_DATA", e.PENDING = "PENDING", e.SUCCESS = "SUCCESS", e.SUCCESS_HAS_DATA = "SUCCESS_HAS_DATA", e.ERROR = "ERROR", e.STALE_IF_ERROR = "STALE_IF_ERROR", e))(se || {});
+var ie = /* @__PURE__ */ ((e) => (e.VALIDATING = "VALIDATING", e.VALIDATING_HAS_DATA = "VALIDATING_HAS_DATA", e.PENDING = "PENDING", e.SUCCESS = "SUCCESS", e.SUCCESS_HAS_DATA = "SUCCESS_HAS_DATA", e.ERROR = "ERROR", e.STALE_IF_ERROR = "STALE_IF_ERROR", e))(ie || {});
 const Qe = (e) => {
   var r, t, n, i, o;
   return e ? !!// TODO: revisit: currently only the first check ever matters?
@@ -48,7 +48,7 @@ function Je(e = A({}), r, t, n = Qe) {
     e.value === void 0 && r && (i.value = "ERROR");
   }), {
     state: i,
-    swrvState: se
+    swrvState: ie
   };
 }
 const Ze = {
@@ -78,17 +78,17 @@ function tt() {
     // Translation component <i18n-t>
   };
 }
-const B = 170, z = "analytics-query-provider", re = "{entity-id}", rt = "{cp-id}", nt = "{timeframe}", ot = 30 * 1e3;
+const M = 170, z = "analytics-query-provider", te = "{entity-id}", rt = "{cp-id}", nt = "{timeframe}", ot = 30 * 1e3;
 function at() {
-  const e = K(z);
+  const e = j(z);
   return {
     evaluateFeatureFlag: (t, n) => e ? e.evaluateFeatureFlagFn(t, n) : n
   };
 }
-const I = {
+const F = {
   useI18n: tt,
   useEvaluateFeatureFlag: at
-}, J = /* @__PURE__ */ E({
+}, Q = /* @__PURE__ */ T({
   __name: "QueryDataProvider",
   props: {
     context: {},
@@ -98,67 +98,67 @@ const I = {
   },
   emits: ["chart-data", "queryComplete"],
   setup(e, { emit: r }) {
-    const t = e, n = r, { i18n: i } = I.useI18n(), o = K(z), c = () => t.queryReady && o ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, a = new AbortController();
-    oe(() => {
+    const t = e, n = r, { i18n: i } = F.useI18n(), o = j(z), c = () => t.queryReady && o ? JSON.stringify([t.query, t.context, t.refreshCounter]) : null, a = new AbortController();
+    ne(() => {
       a.abort();
     });
-    const u = (d, b, h) => {
-      const m = [];
-      return b && m.push(...b), m.push(...De(d, h)), m;
-    }, { data: f, error: x, isValidating: q } = xe(c, async () => {
-      var d, b, h, m;
+    const l = (p, f, q) => {
+      const S = [];
+      return f && S.push(...f), S.push(...De(p, q)), S;
+    }, { data: h, error: I, isValidating: E } = xe(c, async () => {
+      var p, f, q, S;
       try {
         let {
           datasource: s,
-          ...S
+          ...x
         } = t.query;
         s || (s = "basic");
-        const k = u(s, t.query.filters, t.context.filters), G = {
+        const $ = l(s, t.query.filters, t.context.filters), G = {
           datasource: s,
           query: {
-            ...S,
+            ...x,
             time_range: {
               ...t.context.timeSpec,
               tz: t.context.tz
             },
-            filters: k
+            filters: $
           }
         };
         return o == null ? void 0 : o.queryFn(G, a);
       } catch (s) {
-        T.value = ((b = (d = s == null ? void 0 : s.response) == null ? void 0 : d.data) == null ? void 0 : b.message) === "Range not allowed for this tier" ? i.t("queryDataProvider.timeRangeExceeded") : ((m = (h = s == null ? void 0 : s.response) == null ? void 0 : h.data) == null ? void 0 : m.message) || (s == null ? void 0 : s.message);
+        R.value = ((f = (p = s == null ? void 0 : s.response) == null ? void 0 : p.data) == null ? void 0 : f.message) === "Range not allowed for this tier" ? i.t("queryDataProvider.timeRangeExceeded") : ((S = (q = s == null ? void 0 : s.response) == null ? void 0 : q.data) == null ? void 0 : S.message) || (s == null ? void 0 : s.message);
       } finally {
         n("queryComplete");
       }
     }, {
       refreshInterval: t.context.refreshInterval,
       revalidateOnFocus: !1
-    }), { state: y, swrvState: C } = Je(f, x, q), T = A(null), R = v(() => y.value === C.ERROR || !!T.value), P = v(() => !t.queryReady || [C.PENDING, C.VALIDATING, C.VALIDATING_HAS_DATA].includes(y.value));
-    return pe(f, (d) => {
-      d && n("chart-data", d);
-    }), (d, b) => {
-      const h = N("KSkeleton"), m = N("KEmptyState");
-      return P.value || !l(f) && !R.value ? (p(), g(h, {
+    }), { state: y, swrvState: C } = Je(h, I, E), R = A(null), m = v(() => y.value === C.ERROR || !!R.value), _ = v(() => !t.queryReady || [C.PENDING, C.VALIDATING, C.VALIDATING_HAS_DATA].includes(y.value));
+    return pe(h, (p) => {
+      p && n("chart-data", p);
+    }), (p, f) => {
+      const q = L("KSkeleton"), S = L("KEmptyState");
+      return _.value || !u(h) && !m.value ? (d(), g(q, {
         key: 0,
         class: "chart-skeleton",
         type: "table"
-      })) : R.value ? (p(), g(m, {
+      })) : m.value ? (d(), g(S, {
         key: 1,
         "action-button-visible": !1,
         "data-testid": "chart-empty-state",
         "icon-variant": "error"
       }, {
-        default: _(() => [
-          M(O(T.value), 1)
+        default: b(() => [
+          V(w(R.value), 1)
         ]),
         _: 1
-      })) : l(f) ? Q(d.$slots, "default", {
+      })) : u(h) ? H(p.$slots, "default", {
         key: 2,
-        data: l(f)
-      }) : w("", !0);
+        data: u(h)
+      }) : k("", !0);
     };
   }
-}), it = { class: "analytics-chart" }, st = /* @__PURE__ */ E({
+}), it = { class: "analytics-chart" }, st = /* @__PURE__ */ T({
   __name: "SimpleChartRenderer",
   props: {
     query: {},
@@ -169,19 +169,19 @@ const I = {
     refreshCounter: {}
   },
   setup(e) {
-    $((t) => ({
+    B((t) => ({
       bc149350: `${t.height}px`
     }));
     const r = e;
-    return (t, n) => (p(), g(J, {
+    return (t, n) => (d(), g(Q, {
       context: t.context,
       query: t.query,
       "query-ready": t.queryReady,
       "refresh-counter": t.refreshCounter
     }, {
-      default: _(({ data: i }) => [
-        L("div", it, [
-          F(l(_e), {
+      default: b(({ data: i }) => [
+        P("div", it, [
+          O(u(_e), {
             "chart-data": i,
             "chart-options": r.chartOptions,
             "synthetics-data-key": t.chartOptions.syntheticsDataKey
@@ -191,12 +191,12 @@ const I = {
       _: 1
     }, 8, ["context", "query", "query-ready", "refresh-counter"]));
   }
-}), j = (e, r) => {
+}), N = (e, r) => {
   const t = e.__vccOpts || e;
   for (const [n, i] of r)
     t[n] = i;
   return t;
-}, ct = /* @__PURE__ */ j(st, [["__scopeId", "data-v-e770c4a0"]]), lt = { class: "analytics-chart" }, ut = /* @__PURE__ */ E({
+}, ct = /* @__PURE__ */ N(st, [["__scopeId", "data-v-e770c4a0"]]), lt = { class: "analytics-chart" }, ut = /* @__PURE__ */ T({
   __name: "BaseAnalyticsChartRenderer",
   props: {
     query: {},
@@ -209,14 +209,11 @@ const I = {
   },
   emits: ["edit-tile", "chart-data"],
   setup(e, { emit: r }) {
-    $((y) => ({
-      b0a3e4ca: `${y.height}px`
-    }));
-    const t = e, n = r, i = K(z), { i18n: o } = I.useI18n(), { evaluateFeatureFlag: c } = I.useEvaluateFeatureFlag(), a = c("ma-3043-analytics-chart-kebab-menu", !1), u = v(() => ({
+    const t = e, n = r, i = j(z), { i18n: o } = F.useI18n(), { evaluateFeatureFlag: c } = F.useEvaluateFeatureFlag(), a = c("ma-3043-analytics-chart-kebab-menu", !1), l = v(() => ({
       type: t.chartOptions.type,
       stacked: t.chartOptions.stacked ?? !1,
       chartDatasetColors: t.chartOptions.chartDatasetColors
-    })), f = v(() => {
+    })), h = v(() => {
       if (i && i.exploreBaseUrl) {
         const y = {
           filters: [...t.context.filters, ...t.query.filters ?? []],
@@ -227,39 +224,39 @@ const I = {
         return `${i.exploreBaseUrl()}?q=${JSON.stringify(y)}&d=${C}&c=${t.chartOptions.type}`;
       }
       return "";
-    }), x = () => {
+    }), I = () => {
       n("edit-tile");
-    }, q = (y) => {
+    }, E = (y) => {
       n("chart-data", y);
     };
     return (y, C) => {
-      const T = N("KDropdownItem");
-      return p(), g(J, {
+      const R = L("KDropdownItem");
+      return d(), g(Q, {
         context: y.context,
         query: y.query,
         "query-ready": y.queryReady,
         "refresh-counter": y.refreshCounter,
-        onChartData: q
+        onChartData: E
       }, {
-        default: _(({ data: R }) => [
-          L("div", lt, [
-            F(l(qe), ae({
+        default: b(({ data: m }) => [
+          P("div", lt, [
+            O(u(qe), oe({
               "allow-csv-export": y.chartOptions.allowCsvExport,
-              "chart-data": R,
-              "chart-options": u.value,
-              "chart-title": !l(a) && y.chartOptions.chartTitle || "",
-              "go-to-explore": f.value,
+              "chart-data": m,
+              "chart-options": l.value,
+              "chart-title": !u(a) && y.chartOptions.chartTitle || "",
+              "go-to-explore": h.value,
               "legend-position": "bottom",
               "show-menu": y.context.editable,
               "synthetics-data-key": y.chartOptions.syntheticsDataKey,
               "tooltip-title": ""
-            }, y.extraProps), ie({ _: 2 }, [
+            }, y.extraProps), ae({ _: 2 }, [
               y.context.editable ? {
                 name: "menu-items",
-                fn: _(() => [
-                  F(T, { onClick: x }, {
-                    default: _(() => [
-                      M(O(l(o).t("renderer.edit")), 1)
+                fn: b(() => [
+                  O(R, { onClick: I }, {
+                    default: b(() => [
+                      V(w(u(o).t("renderer.edit")), 1)
                     ]),
                     _: 1
                   })
@@ -273,7 +270,7 @@ const I = {
       }, 8, ["context", "query", "query-ready", "refresh-counter"]);
     };
   }
-}), ce = /* @__PURE__ */ j(ut, [["__scopeId", "data-v-40cb614f"]]), ne = /* @__PURE__ */ E({
+}), se = /* @__PURE__ */ N(ut, [["__scopeId", "data-v-024dd4c4"]]), re = /* @__PURE__ */ T({
   __name: "BarChartRenderer",
   props: {
     query: {},
@@ -284,7 +281,7 @@ const I = {
     refreshCounter: {}
   },
   setup(e) {
-    return (r, t) => (p(), g(ce, {
+    return (r, t) => (d(), g(se, {
       "chart-options": r.chartOptions,
       context: r.context,
       "extra-props": { showAnnotations: !1 },
@@ -294,7 +291,7 @@ const I = {
       "refresh-counter": r.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), dt = /* @__PURE__ */ E({
+}), dt = /* @__PURE__ */ T({
   __name: "TimeseriesChartRenderer",
   props: {
     query: {},
@@ -305,7 +302,7 @@ const I = {
     refreshCounter: {}
   },
   setup(e) {
-    return (r, t) => (p(), g(ce, {
+    return (r, t) => (d(), g(se, {
       "chart-options": r.chartOptions,
       context: r.context,
       height: r.height,
@@ -314,7 +311,7 @@ const I = {
       "refresh-counter": r.refreshCounter
     }, null, 8, ["chart-options", "context", "height", "query", "query-ready", "refresh-counter"]));
   }
-}), pt = { class: "metric-card-tile-wrapper" }, yt = /* @__PURE__ */ E({
+}), pt = { class: "metric-card-tile-wrapper" }, yt = /* @__PURE__ */ T({
   __name: "GoldenSignalsRenderer",
   props: {
     query: {},
@@ -325,12 +322,12 @@ const I = {
     refreshCounter: {}
   },
   setup(e) {
-    $((c) => ({
-      "3e99e905": l(n) ? "90%" : "100%",
-      "345e89d8": l(n) ? "auto" : "100%",
-      "7fa58fd9": l(n) ? "100%" : "none"
+    B((c) => ({
+      "3e99e905": u(n) ? "90%" : "100%",
+      "345e89d8": u(n) ? "auto" : "100%",
+      "7fa58fd9": u(n) ? "100%" : "none"
     }));
-    const r = e, { evaluateFeatureFlag: t } = I.useEvaluateFeatureFlag(), n = t("ma-3043-analytics-chart-kebab-menu", !1), i = v(() => {
+    const r = e, { evaluateFeatureFlag: t } = F.useEvaluateFeatureFlag(), n = t("ma-3043-analytics-chart-kebab-menu", !1), i = v(() => {
       const c = r.context.timeSpec;
       if (c.type === "absolute")
         return new Ie({
@@ -350,12 +347,12 @@ const I = {
         throw new Error("Unknown time range");
       return a;
     }), o = v(() => {
-      var a, u;
+      var a, l;
       const c = (a = r.query) == null ? void 0 : a.datasource;
       if (c && c !== "advanced" && c !== "basic")
         throw new Error(`Invalid datasource value: ${c}`);
       return {
-        datasource: (u = r.query) == null ? void 0 : u.datasource,
+        datasource: (l = r.query) == null ? void 0 : l.datasource,
         overrideTimeframe: i.value,
         tz: r.context.tz,
         additionalFilter: r.context.filters,
@@ -369,16 +366,16 @@ const I = {
         refreshCounter: r.refreshCounter
       };
     });
-    return (c, a) => (p(), D("div", pt, [
-      F(l(Me), ye(he(o.value)), {
-        default: _(() => [
-          F(l(Be))
+    return (c, a) => (d(), D("div", pt, [
+      O(u(Be), ye(he(o.value)), {
+        default: b(() => [
+          O(u(Me))
         ]),
         _: 1
       }, 16)
     ]));
   }
-}), ht = /* @__PURE__ */ j(yt, [["__scopeId", "data-v-84c4c1c8"]]), mt = "#6c7489", ft = "20px", gt = "6px", H = "20px", vt = /* @__PURE__ */ E({
+}), ht = /* @__PURE__ */ N(yt, [["__scopeId", "data-v-84c4c1c8"]]), mt = "#6c7489", ft = "20px", ce = "20px", gt = /* @__PURE__ */ T({
   __name: "TopNTableRenderer",
   props: {
     query: {},
@@ -389,39 +386,39 @@ const I = {
     refreshCounter: {}
   },
   setup(e) {
-    const r = e, { evaluateFeatureFlag: t } = I.useEvaluateFeatureFlag(), n = t("ma-3043-analytics-chart-kebab-menu", !1), i = (o) => {
+    const r = e, { evaluateFeatureFlag: t } = F.useEvaluateFeatureFlag(), n = t("ma-3043-analytics-chart-kebab-menu", !1), i = (o) => {
       var c;
       if ((c = r.chartOptions) != null && c.entityLink)
         if (o.id.includes(":")) {
-          const [a, u] = o.id.split(":");
-          return r.chartOptions.entityLink.replace(rt, a).replace(re, u);
+          const [a, l] = o.id.split(":");
+          return r.chartOptions.entityLink.replace(rt, a).replace(te, l);
         } else
-          return r.chartOptions.entityLink.replace(re, o.id);
+          return r.chartOptions.entityLink.replace(te, o.id);
       return "";
     };
-    return (o, c) => (p(), g(J, {
+    return (o, c) => (d(), g(Q, {
       context: o.context,
       query: o.query,
       "query-ready": o.queryReady,
       "refresh-counter": o.refreshCounter
     }, {
-      default: _(({ data: a }) => [
-        F(l(Ce), {
+      default: b(({ data: a }) => [
+        O(u(Ce), {
           data: a,
-          description: !l(n) && o.chartOptions.description || "",
+          description: !u(n) && o.chartOptions.description || "",
           "synthetics-data-key": o.chartOptions.syntheticsDataKey,
-          title: !l(n) && o.chartOptions.chartTitle || ""
-        }, ie({ _: 2 }, [
+          title: !u(n) && o.chartOptions.chartTitle || ""
+        }, ae({ _: 2 }, [
           r.chartOptions.entityLink ? {
             name: "name",
-            fn: _(({ record: u }) => [
-              F(l(Ue), {
+            fn: b(({ record: l }) => [
+              O(u(Ue), {
                 "entity-link-data": {
-                  id: u.id,
-                  label: u.name,
-                  deleted: u.deleted
+                  id: l.id,
+                  label: l.name,
+                  deleted: l.deleted
                 },
-                "external-link": i(u)
+                "external-link": i(l)
               }, null, 8, ["entity-link-data", "external-link"])
             ]),
             key: "0"
@@ -431,56 +428,56 @@ const I = {
       _: 1
     }, 8, ["context", "query", "query-ready", "refresh-counter"]));
   }
-}), bt = {
+}), vt = {
   key: 0,
   class: "tile-header"
-}, _t = { class: "title" }, qt = {
+}, bt = { class: "title" }, _t = {
   appearance: "none",
   class: "kebab-action-menu",
   "data-testid": "kebab-action-menu"
-}, Ct = ["href"], St = {
+}, qt = ["href"], Ct = {
   class: "chart-export-trigger",
   "data-testid": "csv-export-button"
-}, Et = {
+}, St = {
   key: 1,
   class: "header-description"
-}, xt = /* @__PURE__ */ E({
+}, Et = { class: "tile-content" }, xt = /* @__PURE__ */ T({
   __name: "DashboardTile",
   props: {
     definition: {},
     context: {},
-    height: { default: B },
+    height: { default: M },
     queryReady: { type: Boolean },
     refreshCounter: {}
   },
   emits: ["edit-tile"],
   setup(e, { emit: r }) {
-    $((s) => ({
-      f269eb76: `${s.height}px`,
-      "1c28e871": q.value ? 1 : 0,
-      "1c525d74": q.value ? "visible" : "hidden"
+    B((s) => ({
+      "643f29b5": `${s.height}px`,
+      "6cfe97e1": E.value ? 1 : 0,
+      "654c3ff8": E.value ? "visible" : "hidden"
     }));
-    const t = parseInt(H, 10), n = e, i = r, o = K(z), { evaluateFeatureFlag: c } = I.useEvaluateFeatureFlag(), { i18n: a } = I.useI18n(), u = c("ma-3043-analytics-chart-kebab-menu", !1), f = A(), x = A(!1), q = A(!1), y = v(() => {
+    const t = parseInt(ce, 10), n = e, i = r, o = j(z), { evaluateFeatureFlag: c } = F.useEvaluateFeatureFlag(), { i18n: a } = F.useI18n(), l = c("ma-3043-analytics-chart-kebab-menu", !1), h = A(), I = A(!1), E = A(!1), y = v(() => {
       if (o && o.exploreBaseUrl) {
         const s = {
           filters: [...n.context.filters, ...n.definition.query.filters ?? []],
           metrics: n.definition.query.metrics ?? [],
           dimensions: n.definition.query.dimensions ?? [],
           time_range: n.definition.query.time_range || n.context.timeSpec
-        }, S = ["advanced", "ai"].includes(n.definition.query.datasource) ? n.definition.query.datasource : "advanced";
-        return `${o.exploreBaseUrl()}?q=${JSON.stringify(s)}&d=${S}&c=${n.definition.chart.type}`;
+        }, x = ["advanced", "ai"].includes(n.definition.query.datasource) ? n.definition.query.datasource : "advanced";
+        return `${o.exploreBaseUrl()}?q=${JSON.stringify(s)}&d=${x}&c=${n.definition.chart.type}`;
       }
       return "";
-    }), C = v(() => a.t("csvExport.defaultFilename")), T = v(() => u && !["golden_signals", "top_n", "gauge"].includes(n.definition.chart.type)), R = {
+    }), C = v(() => a.t("csvExport.defaultFilename")), R = v(() => l && !["golden_signals", "top_n", "gauge"].includes(n.definition.chart.type)), m = {
       timeseries_line: dt,
-      horizontal_bar: ne,
-      vertical_bar: ne,
+      horizontal_bar: re,
+      vertical_bar: re,
       gauge: ct,
       golden_signals: ht,
-      top_n: vt,
+      top_n: gt,
       slottable: void 0
-    }, P = v(() => {
-      const s = R[n.definition.chart.type];
+    }, _ = v(() => {
+      const s = m[n.definition.chart.type];
       return s && {
         component: s,
         rendererProps: {
@@ -492,92 +489,94 @@ const I = {
           refreshCounter: n.refreshCounter
         }
       };
-    }), d = () => {
+    }), p = () => {
       i("edit-tile", n.definition);
-    }, b = (s) => {
-      f.value = s;
-    }, h = (s) => {
-      x.value = s;
-    }, m = () => {
-      h(!0);
+    }, f = (s) => {
+      h.value = s;
+    }, q = (s) => {
+      I.value = s;
+    }, S = () => {
+      q(!0);
     };
-    return (s, S) => {
-      const k = N("KDropdownItem"), G = N("KDropdown");
-      return p(), D("div", {
+    return (s, x) => {
+      const $ = L("KDropdownItem"), G = L("KDropdown");
+      return d(), D("div", {
         class: "tile-boundary",
-        onMouseenter: S[1] || (S[1] = (ee) => q.value = !0),
-        onMouseleave: S[2] || (S[2] = (ee) => q.value = !1)
+        onMouseenter: x[1] || (x[1] = (X) => E.value = !0),
+        onMouseleave: x[2] || (x[2] = (X) => E.value = !1)
       }, [
-        l(u) && s.definition.chart.type !== "slottable" ? (p(), D("div", bt, [
-          L("div", _t, O(s.definition.chart.chartTitle), 1),
-          T.value ? (p(), g(G, {
+        u(l) && s.definition.chart.type !== "slottable" ? (d(), D("div", vt, [
+          P("div", bt, w(s.definition.chart.chartTitle), 1),
+          R.value ? (d(), g(G, {
             key: 0,
             class: "dropdown",
             "data-testid": "chart-action-menu"
           }, {
-            items: _(() => [
-              y.value ? (p(), g(k, {
+            items: b(() => [
+              y.value ? (d(), g($, {
                 key: 0,
                 "data-testid": "chart-jump-to-explore"
               }, {
-                default: _(() => [
-                  L("a", { href: y.value }, O(l(a).t("jumpToExplore")), 9, Ct)
+                default: b(() => [
+                  P("a", { href: y.value }, w(u(a).t("jumpToExplore")), 9, qt)
                 ]),
                 _: 1
-              })) : w("", !0),
-              "allowCsvExport" in s.definition.chart && s.definition.chart.allowCsvExport ? (p(), g(k, {
+              })) : k("", !0),
+              "allowCsvExport" in s.definition.chart && s.definition.chart.allowCsvExport ? (d(), g($, {
                 key: 1,
                 class: "chart-export-button",
                 "data-testid": "chart-csv-export",
-                onClick: S[0] || (S[0] = (ee) => m())
+                onClick: x[0] || (x[0] = (X) => S())
               }, {
-                default: _(() => [
-                  L("span", St, O(l(a).t("csvExport.exportAsCsv")), 1)
+                default: b(() => [
+                  P("span", Ct, w(u(a).t("csvExport.exportAsCsv")), 1)
                 ]),
                 _: 1
-              })) : w("", !0),
-              s.context.editable ? (p(), g(k, {
+              })) : k("", !0),
+              s.context.editable ? (d(), g($, {
                 key: 2,
-                onClick: d
+                onClick: p
               }, {
-                default: _(() => [
-                  M(O(l(a).t("renderer.edit")), 1)
+                default: b(() => [
+                  V(w(u(a).t("renderer.edit")), 1)
                 ]),
                 _: 1
-              })) : w("", !0)
+              })) : k("", !0)
             ]),
-            default: _(() => [
-              L("button", qt, [
-                F(l(Ge), {
-                  color: l(mt),
-                  size: l(ft)
+            default: b(() => [
+              P("button", _t, [
+                O(u(Ge), {
+                  color: u(mt),
+                  size: u(ft)
                 }, null, 8, ["color", "size"])
               ])
             ]),
             _: 1
-          })) : "description" in s.definition.chart ? (p(), D("div", Et, O(s.definition.chart.description), 1)) : w("", !0),
-          x.value ? (p(), g(l(Se), {
+          })) : "description" in s.definition.chart ? (d(), D("div", St, w(s.definition.chart.description), 1)) : k("", !0),
+          I.value ? (d(), g(u(Se), {
             key: 2,
-            "chart-data": f.value,
+            "chart-data": h.value,
             filename: C.value,
-            onToggleModal: h
-          }, null, 8, ["chart-data", "filename"])) : w("", !0)
-        ])) : w("", !0),
-        P.value ? (p(), g(me(P.value.component), ae({ key: 1 }, P.value.rendererProps, { onChartData: b }), null, 16)) : w("", !0)
+            onToggleModal: q
+          }, null, 8, ["chart-data", "filename"])) : k("", !0)
+        ])) : k("", !0),
+        P("div", Et, [
+          _.value ? (d(), g(me(_.value.component), oe({ key: 0 }, _.value.rendererProps, { onChartData: f }), null, 16)) : k("", !0)
+        ])
       ], 32);
     };
   }
-}), Tt = /* @__PURE__ */ j(xt, [["__scopeId", "data-v-3c97797e"]]), At = (e, r, t) => {
+}), Tt = /* @__PURE__ */ N(xt, [["__scopeId", "data-v-28914a36"]]), At = (e, r, t) => {
   const n = /* @__PURE__ */ new Map();
   t.forEach((o) => {
-    const c = o.layout.position.row, a = n.get(c), u = o.layout.size.rows === 1 && !!o.layout.size.fitToContent;
-    a === void 0 ? n.set(c, u) : n.set(c, a && u);
+    const c = o.layout.position.row, a = n.get(c), l = o.layout.size.rows === 1 && !!o.layout.size.fitToContent;
+    a === void 0 ? n.set(c, l) : n.set(c, a && l);
   });
   const i = [];
   for (let o = 0; o < e; o++)
     n.get(o) ? i.push("auto") : i.push(`${r}px`);
   return i;
-}, Dt = /* @__PURE__ */ E({
+}, Dt = /* @__PURE__ */ T({
   __name: "GridLayout",
   props: {
     gridSize: {
@@ -587,7 +586,7 @@ const I = {
     tileHeight: {
       type: Number,
       required: !1,
-      default: () => B
+      default: () => M
     },
     tiles: {
       type: Array,
@@ -595,7 +594,7 @@ const I = {
     }
   },
   setup(e) {
-    $((a) => ({
+    B((a) => ({
       "3bc5e939": e.gridSize.cols,
       "77aa3028": o.value
     }));
@@ -606,14 +605,14 @@ const I = {
     });
     fe(() => {
       t.value && i.observe(t.value);
-    }), oe(() => {
+    }), ne(() => {
       t.value && i.unobserve(t.value);
     });
     const o = v(() => {
-      var u;
-      return At((u = r.gridSize) == null ? void 0 : u.rows, r.tileHeight, r.tiles).join(" ");
-    }), c = v(() => r.tiles.map((a, u) => ({
-      key: `tile-${u}`,
+      var l;
+      return At((l = r.gridSize) == null ? void 0 : l.rows, r.tileHeight, r.tiles).join(" ");
+    }), c = v(() => r.tiles.map((a, l) => ({
+      key: `tile-${l}`,
       tile: a,
       style: {
         "grid-column-start": a.layout.position.col + 1,
@@ -622,29 +621,29 @@ const I = {
         "grid-row-end": a.layout.position.row + 1 + a.layout.size.rows
       }
     })));
-    return (a, u) => (p(), D("div", {
+    return (a, l) => (d(), D("div", {
       ref_key: "gridContainer",
       ref: t,
       class: "kong-ui-public-grid-layout"
     }, [
-      (p(!0), D(ge, null, ve(c.value, (f) => (p(), D("div", {
-        key: f.key,
+      (d(!0), D(ge, null, ve(c.value, (h) => (d(), D("div", {
+        key: h.key,
         class: be(["grid-cell", {
-          "empty-cell": !f.tile
+          "empty-cell": !h.tile
         }]),
-        style: te(f.style)
+        style: ee(h.style)
       }, [
-        Q(a.$slots, "tile", {
-          style: te(f.style),
-          tile: f.tile
+        H(a.$slots, "tile", {
+          style: ee(h.style),
+          tile: h.tile
         }, void 0, !0)
       ], 6))), 128))
     ], 512));
   }
-}), It = /* @__PURE__ */ j(Dt, [["__scopeId", "data-v-f43eb7b8"]]), Rt = { class: "kong-ui-public-dashboard-renderer" }, kt = {
+}), It = /* @__PURE__ */ N(Dt, [["__scopeId", "data-v-f43eb7b8"]]), Rt = { class: "kong-ui-public-dashboard-renderer" }, kt = {
   key: 0,
   class: "tile-container"
-}, wt = /* @__PURE__ */ E({
+}, wt = /* @__PURE__ */ T({
   __name: "DashboardRenderer",
   props: {
     context: {},
@@ -652,87 +651,84 @@ const I = {
   },
   emits: ["edit-tile"],
   setup(e, { expose: r, emit: t }) {
-    $((d) => ({
-      "468bc584": l(f) ? l(gt) : l(H)
-    }));
-    const n = e, i = t, { i18n: o } = I.useI18n(), c = A(0), a = K(z);
+    const n = e, i = t, { i18n: o } = F.useI18n(), c = A(0), a = j(z);
     a || (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 { evaluateFeatureFlag: u } = I.useEvaluateFeatureFlag(), f = u("ma-3043-analytics-chart-kebab-menu", !1), x = He(), q = v(() => n.context.timeSpec ? n.context.timeSpec : {
+    const l = He(), h = v(() => n.context.timeSpec ? n.context.timeSpec : {
       type: "relative",
-      time_range: x.defaultQueryTimeForOrg
-    }), y = v(() => !!n.context.timeSpec || !x.loading), C = v(() => n.config.tiles.map((d, b) => {
-      var m;
-      let h = d.definition;
-      if ("description" in h.chart) {
-        const s = (m = h.chart.description) == null ? void 0 : m.replace(nt, () => {
-          const k = `renderer.trendRange.${q.value.type === "absolute" ? "custom" : q.value.time_range}`;
-          return o.te(k) ? o.t(k) : "";
+      time_range: l.defaultQueryTimeForOrg
+    }), I = v(() => !!n.context.timeSpec || !l.loading), E = v(() => n.config.tiles.map((m, _) => {
+      var f;
+      let p = m.definition;
+      if ("description" in p.chart) {
+        const q = (f = p.chart.description) == null ? void 0 : f.replace(nt, () => {
+          const s = `renderer.trendRange.${h.value.type === "absolute" ? "custom" : h.value.time_range}`;
+          return o.te(s) ? o.t(s) : "";
         });
-        h = {
-          ...h,
+        p = {
+          ...p,
           chart: {
-            ...h.chart,
-            description: s
+            ...p.chart,
+            description: q
           }
         };
       }
       return {
-        layout: d.layout,
-        meta: h,
+        layout: m.layout,
+        meta: p,
         // Add a unique key to each tile internally.
-        id: b
+        id: _
       };
-    })), T = v(() => {
-      let { tz: d, refreshInterval: b, editable: h } = n.context;
-      return d || (d = new Intl.DateTimeFormat().resolvedOptions().timeZone), b === void 0 && (b = ot), h === void 0 && (h = !1), {
+    })), y = v(() => {
+      let { tz: m, refreshInterval: _, editable: p } = n.context;
+      return m || (m = new Intl.DateTimeFormat().resolvedOptions().timeZone), _ === void 0 && (_ = ot), p === void 0 && (p = !1), {
         ...n.context,
-        tz: d,
-        timeSpec: q.value,
-        refreshInterval: b,
-        editable: h
+        tz: m,
+        timeSpec: h.value,
+        refreshInterval: _,
+        editable: p
       };
-    }), R = (d) => {
-      i("edit-tile", d);
+    }), C = (m) => {
+      i("edit-tile", m);
     };
     return r({ refresh: () => {
       c.value++;
-    } }), (d, b) => {
-      const h = N("KAlert");
-      return p(), D("div", Rt, [
-        l(a) ? (p(), g(It, {
+    } }), (m, _) => {
+      const p = L("KAlert");
+      return d(), D("div", Rt, [
+        u(a) ? (d(), g(It, {
           key: 1,
-          "grid-size": d.config.gridSize,
-          "tile-height": d.config.tileHeight,
-          tiles: C.value
+          "grid-size": m.config.gridSize,
+          "tile-height": m.config.tileHeight,
+          tiles: E.value
         }, {
-          tile: _(({ tile: m }) => [
-            m.meta.chart.type === "slottable" ? (p(), D("div", kt, [
-              Q(d.$slots, m.meta.chart.id, {}, void 0, !0)
-            ])) : (p(), g(Tt, {
+          tile: b(({ tile: f }) => [
+            f.meta.chart.type === "slottable" ? (d(), D("div", kt, [
+              H(m.$slots, f.meta.chart.id, {}, void 0, !0)
+            ])) : (d(), g(Tt, {
               key: 1,
               class: "tile-container",
-              context: T.value,
-              definition: m.meta,
-              height: m.layout.size.rows * (d.config.tileHeight || l(B)) + parseInt(l(H), 10),
-              "query-ready": y.value,
+              context: y.value,
+              definition: f.meta,
+              height: f.layout.size.rows * (m.config.tileHeight || u(M)) + parseInt(u(ce), 10),
+              "query-ready": I.value,
               "refresh-counter": c.value,
-              onEditTile: (s) => R(m)
+              onEditTile: (q) => C(f)
             }, null, 8, ["context", "definition", "height", "query-ready", "refresh-counter", "onEditTile"]))
           ]),
           _: 3
-        }, 8, ["grid-size", "tile-height", "tiles"])) : (p(), g(h, {
+        }, 8, ["grid-size", "tile-height", "tiles"])) : (d(), g(p, {
           key: 0,
           appearance: "danger"
         }, {
-          default: _(() => [
-            M(O(l(o).t("renderer.noQueryBridge")), 1)
+          default: b(() => [
+            V(w(u(o).t("renderer.noQueryBridge")), 1)
           ]),
           _: 1
         }))
       ]);
     };
   }
-}), or = /* @__PURE__ */ j(wt, [["__scopeId", "data-v-05d469f6"]]), ar = [
+}), or = /* @__PURE__ */ N(wt, [["__scopeId", "data-v-26130807"]]), ar = [
   "horizontal_bar",
   "vertical_bar",
   "gauge",
@@ -742,7 +738,7 @@ const I = {
   "slottable"
 ], U = {
   type: "string"
-}, V = {
+}, K = {
   type: "string"
 }, le = {
   type: "boolean"
@@ -779,7 +775,7 @@ const I = {
     },
     chartDatasetColors: ue,
     syntheticsDataKey: U,
-    chartTitle: V,
+    chartTitle: K,
     allowCsvExport: le
   },
   required: ["type"],
@@ -796,7 +792,7 @@ const I = {
     },
     chartDatasetColors: ue,
     syntheticsDataKey: U,
-    chartTitle: V,
+    chartTitle: K,
     allowCsvExport: le
   },
   required: ["type"],
@@ -819,14 +815,14 @@ const I = {
       type: "number"
     },
     syntheticsDataKey: U,
-    chartTitle: V
+    chartTitle: K
   },
   required: ["type"],
   additionalProperties: !1
 }, Nt = {
   type: "object",
   properties: {
-    chartTitle: V,
+    chartTitle: K,
     syntheticsDataKey: U,
     type: {
       type: "string",
@@ -844,7 +840,7 @@ const I = {
 }, $t = {
   type: "object",
   properties: {
-    chartTitle: V,
+    chartTitle: K,
     type: {
       type: "string",
       enum: ["golden_signals"]
@@ -885,7 +881,7 @@ const I = {
     "time_range"
   ],
   additionalProperties: !1
-}, Kt = {
+}, zt = {
   type: "object",
   description: "A duration representing an exact start and end time.",
   properties: {
@@ -911,7 +907,7 @@ const I = {
     "end"
   ],
   additionalProperties: !1
-}, Z = {
+}, J = {
   granularity: {
     type: "string",
     description: 'Force time grouping into buckets of this duration. Only has an effect if "time" is in the "dimensions" list.',
@@ -922,7 +918,7 @@ const I = {
     description: "The time range to query.",
     anyOf: [
       jt,
-      Kt
+      zt
     ],
     default: {
       type: "relative",
@@ -935,14 +931,14 @@ const I = {
   meta: {
     type: "object"
   }
-}, W = (e) => ({
+}, Z = (e) => ({
   type: "array",
   description: "List of aggregated metrics to collect across the requested time span.",
   items: {
     type: "string",
     enum: e
   }
-}), Y = (e) => ({
+}), W = (e) => ({
   type: "array",
   description: "List of attributes or entity types to group by.",
   minItems: 0,
@@ -951,7 +947,7 @@ const I = {
     type: "string",
     enum: e
   }
-}), X = (e) => ({
+}), Y = (e) => ({
   type: "array",
   description: "A list of filters to apply to the query.",
   items: {
@@ -980,7 +976,7 @@ const I = {
     ],
     additionalProperties: !1
   }
-}), zt = {
+}), Kt = {
   type: "object",
   description: "A query to launch at the advanced explore API",
   properties: {
@@ -990,10 +986,10 @@ const I = {
         "advanced"
       ]
     },
-    metrics: W(Oe),
-    dimensions: Y(Fe),
-    filters: X(Pe),
-    ...Z
+    metrics: Z(Oe),
+    dimensions: W(Fe),
+    filters: Y(Pe),
+    ...J
   },
   required: ["datasource"],
   additionalProperties: !1
@@ -1007,14 +1003,14 @@ const I = {
         "basic"
       ]
     },
-    metrics: W(Le),
-    dimensions: Y(Ne),
-    filters: X($e),
-    ...Z
+    metrics: Z(Le),
+    dimensions: W(Ne),
+    filters: Y($e),
+    ...J
   },
   required: ["datasource"],
   additionalProperties: !1
-}, Mt = {
+}, Bt = {
   type: "object",
   description: "A query to launch at the AI explore API",
   properties: {
@@ -1024,19 +1020,19 @@ const I = {
         "ai"
       ]
     },
-    metrics: W(je),
-    dimensions: Y(Ke),
-    filters: X(ze),
-    ...Z
+    metrics: Z(je),
+    dimensions: W(ze),
+    filters: Y(Ke),
+    ...J
   },
   required: ["datasource"],
   additionalProperties: !1
-}, Bt = {
-  anyOf: [zt, Vt, Mt]
+}, Mt = {
+  anyOf: [Kt, Vt, Bt]
 }, Ut = {
   type: "object",
   properties: {
-    query: Bt,
+    query: Mt,
     chart: {
       anyOf: [Ft, Lt, Pt, $t, Nt, Ot]
     }
@@ -1097,7 +1093,7 @@ const I = {
     },
     tileHeight: {
       type: "number",
-      description: `Height of each tile in pixels. Default: ${B}`
+      description: `Height of each tile in pixels. Default: ${M}`
     },
     gridSize: {
       type: "object",
@@ -1119,19 +1115,19 @@ const I = {
 };
 export {
   rt as CP_ID_TOKEN,
-  B as DEFAULT_TILE_HEIGHT,
+  M as DEFAULT_TILE_HEIGHT,
   ot as DEFAULT_TILE_REFRESH_INTERVAL_MS,
   or as DashboardRenderer,
-  re as ENTITY_ID_TOKEN,
+  te as ENTITY_ID_TOKEN,
   It as GridLayout,
   z as INJECT_QUERY_PROVIDER,
   nt as TIMEFRAME_TOKEN,
-  Mt as aiQuerySchema,
+  Bt as aiQuerySchema,
   Ft as barChartSchema,
   Vt as basicQuerySchema,
   ir as dashboardConfigSchema,
   ar as dashboardTileTypes,
-  zt as exploreV4QuerySchema,
+  Kt as exploreV4QuerySchema,
   Lt as gaugeChartSchema,
   $t as metricCardSchema,
   Ot as slottableSchema,
@@ -1140,5 +1136,5 @@ export {
   Gt as tileLayoutSchema,
   Pt as timeseriesChartSchema,
   Nt as topNTableSchema,
-  Bt as validDashboardQuery
+  Mt as validDashboardQuery
 };