@kong-ui-public/analytics-metric-provider 11.1.12-pr.2822.d1d376c94.0 → 11.1.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mockExploreResponse.d.ts","sourceRoot":"","sources":["../../src/mockExploreResponse.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAEhE,OAAO,KAAK,EACV,mBAAmB,EAEnB,YAAY,EACZ,eAAe,EAGhB,MAAM,qCAAqC,CAAA;AAK5C,eAAO,MAAM,OAAO,GAAI,MAAM,IAAI,EAAE,QAAQ,MAAM,SAIjD,CAAA;AACD,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,KAAK,CAAA;IAC5C,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,mBAAmB,CAAA;CAChC;AAED,eAAO,MAAM,8BAA8B,GACzC,KAAK,cAAc,CAAC,mBAAmB,EACvC,OAAO,WAAW,SAQnB,CAAA;AAQD,eAAO,MAAM,mBAAmB,GAC9B,MAAM,YAAY,EAClB,OAAO,WAAW,
|
|
1
|
+
{"version":3,"file":"mockExploreResponse.d.ts","sourceRoot":"","sources":["../../src/mockExploreResponse.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAEhE,OAAO,KAAK,EACV,mBAAmB,EAEnB,YAAY,EACZ,eAAe,EAGhB,MAAM,qCAAqC,CAAA;AAK5C,eAAO,MAAM,OAAO,GAAI,MAAM,IAAI,EAAE,QAAQ,MAAM,SAIjD,CAAA;AACD,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,YAAY,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,KAAK,CAAA;IAC5C,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,mBAAmB,CAAA;CAChC;AAED,eAAO,MAAM,8BAA8B,GACzC,KAAK,cAAc,CAAC,mBAAmB,EACvC,OAAO,WAAW,SAQnB,CAAA;AAQD,eAAO,MAAM,mBAAmB,GAC9B,MAAM,YAAY,EAClB,OAAO,WAAW,KA6Gb,eACN,CAAA"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { ref as Y, watchEffect as Ne, computed as g, getCurrentInstance as ke, reactive as Fe, onMounted as xe, onUnmounted as qe, watch as Ue, isReadonly as Pe, toRefs as $e, defineComponent as W, inject as
|
|
1
|
+
import { ref as Y, watchEffect as Ne, computed as g, getCurrentInstance as ke, reactive as Fe, onMounted as xe, onUnmounted as qe, watch as Ue, isReadonly as Pe, toRefs as $e, defineComponent as W, inject as _e, toRef as G, provide as ze, renderSlot as Ce, resolveComponent as Ie, createElementBlock as _, openBlock as T, normalizeClass as z, createElementVNode as q, createCommentVNode as M, createBlock as U, unref as E, resolveDynamicComponent as re, withCtx as me, createTextVNode as De, toDisplayString as b, createVNode as F, Fragment as ye, renderList as Ke, mergeProps as Be, normalizeProps as Xe, guardReactiveProps as Ge } from "vue";
|
|
2
2
|
import { stripUnknownFilters as je, queryableExploreDimensions as He } from "@kong-ui-public/analytics-utilities";
|
|
3
3
|
import { createI18n as Ye, i18nTComponent as Qe } from "@kong-ui-public/i18n";
|
|
4
4
|
import "axios";
|
|
5
5
|
import { useAnalyticsConfigStore as We } from "@kong-ui-public/analytics-config-store";
|
|
6
|
-
import { TrendUpIcon as Je, TrendDownIcon as Ze, IndeterminateSmallIcon as
|
|
6
|
+
import { TrendUpIcon as Je, TrendDownIcon as Ze, IndeterminateSmallIcon as Ae, VitalsIcon as er, CloudUploadIcon as rr, WarningOutlineIcon as tr, ResponseIcon as nr, InfoIcon as ar, WarningIcon as we, EqualIcon as ir } from "@kong/icons";
|
|
7
7
|
const or = {
|
|
8
8
|
notAvailable: "N/A"
|
|
9
9
|
}, sr = {
|
|
@@ -56,7 +56,7 @@ function cr() {
|
|
|
56
56
|
};
|
|
57
57
|
}
|
|
58
58
|
const dr = 2, B = ["1XX", "2XX", "3XX", "4XX", "5XX"], ge = ["4XX", "5XX"], yt = ["1XX", "2XX", "3XX"], fr = 30 * 1e3, vr = "analytics-query-provider";
|
|
59
|
-
var
|
|
59
|
+
var be = /* @__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))(be || {});
|
|
60
60
|
const mr = (e) => {
|
|
61
61
|
var r, t, o, a, n;
|
|
62
62
|
return e ? !!// TODO: revisit: currently only the first check ever matters?
|
|
@@ -96,7 +96,7 @@ function yr(e = Y({}), r, t, o = mr) {
|
|
|
96
96
|
e.value === void 0 && r && (a.value = "ERROR");
|
|
97
97
|
}), {
|
|
98
98
|
state: a,
|
|
99
|
-
swrvState:
|
|
99
|
+
swrvState: be
|
|
100
100
|
};
|
|
101
101
|
}
|
|
102
102
|
const L = Symbol("default"), te = "status_code_grouped", he = (e, r, t, o, a) => {
|
|
@@ -104,7 +104,7 @@ const L = Symbol("default"), te = "status_code_grouped", he = (e, r, t, o, a) =>
|
|
|
104
104
|
};
|
|
105
105
|
function gr(e, r) {
|
|
106
106
|
var d;
|
|
107
|
-
const t = ((d = e.meta.metric_names) == null ? void 0 : d[0]) || "", o = e.meta.
|
|
107
|
+
const t = ((d = e.meta.metric_names) == null ? void 0 : d[0]) || "", o = new Date(e.meta.start).getTime(), a = Object.keys(e.meta.display || {}), n = !!a.find((f) => f === te), l = a.find((f) => f !== te);
|
|
108
108
|
return a.length > 2 || a.length > 1 && !n ? (console.error("Don't know how to work with provided dimensions:", a), {
|
|
109
109
|
previous: { [L]: { [L]: 0 } },
|
|
110
110
|
current: { [L]: { [L]: 0 } }
|
|
@@ -150,8 +150,8 @@ function hr(e) {
|
|
|
150
150
|
errorRetryCount: dr
|
|
151
151
|
}
|
|
152
152
|
), { state: l, swrvState: d } = yr(o, a, n), f = g(() => {
|
|
153
|
-
var s, u, c, v, p,
|
|
154
|
-
return !((u = (s = o.value) == null ? void 0 : s.data) != null && u.length) || !((v = (c = o.value) == null ? void 0 : c.meta) != null && v.display) || !((h = (
|
|
153
|
+
var s, u, c, v, p, S, h;
|
|
154
|
+
return !((u = (s = o.value) == null ? void 0 : s.data) != null && u.length) || !((v = (c = o.value) == null ? void 0 : c.meta) != null && v.display) || !((h = (S = (p = o.value) == null ? void 0 : p.meta) == null ? void 0 : S.metric_names) != null && h.length) ? { current: {}, previous: {} } : gr(o.value, e.withTrend.value);
|
|
155
155
|
}), i = V.useTrendRange(e.withTrend, e.timeRange, g(() => {
|
|
156
156
|
var s;
|
|
157
157
|
return (s = o.value) == null ? void 0 : s.meta;
|
|
@@ -204,7 +204,7 @@ function pr(e) {
|
|
|
204
204
|
};
|
|
205
205
|
});
|
|
206
206
|
}
|
|
207
|
-
function
|
|
207
|
+
function Tr(e, r, t) {
|
|
208
208
|
const { i18n: o } = V.useI18n(), a = 1e3 * 60, n = a * 60, l = n * 24, d = (i, s) => {
|
|
209
209
|
let u = s - i;
|
|
210
210
|
e.value && (u /= 2);
|
|
@@ -212,10 +212,10 @@ function Rr(e, r, t) {
|
|
|
212
212
|
return c >= 1 ? o.t("trendRange.custom_days", { numDays: Math.round(c) }) : v >= 1 ? o.t("trendRange.custom_hours", { numHours: Math.round(v) }) : p >= 1 ? o.t("trendRange.custom_minutes", { numMinutes: Math.round(p) }) : o.t("trendRange.custom_days", { numDays: Math.round(c) });
|
|
213
213
|
}, f = () => {
|
|
214
214
|
var i, s;
|
|
215
|
-
if ((i = t == null ? void 0 : t.value) != null && i.
|
|
215
|
+
if ((i = t == null ? void 0 : t.value) != null && i.start && t.value.end)
|
|
216
216
|
return {
|
|
217
|
-
startMs: t.value.
|
|
218
|
-
endMs: t.value.
|
|
217
|
+
startMs: new Date(t.value.start).getTime(),
|
|
218
|
+
endMs: new Date(t.value.end).getTime()
|
|
219
219
|
};
|
|
220
220
|
if (((s = r == null ? void 0 : r.value) == null ? void 0 : s.type) === "absolute" && r.value.start && r.value.end)
|
|
221
221
|
return {
|
|
@@ -236,7 +236,7 @@ function Rr(e, r, t) {
|
|
|
236
236
|
});
|
|
237
237
|
}
|
|
238
238
|
var ne = /* @__PURE__ */ new WeakMap(), pe = 0;
|
|
239
|
-
function
|
|
239
|
+
function Rr(e) {
|
|
240
240
|
if (!e.length)
|
|
241
241
|
return "";
|
|
242
242
|
for (var r = "arg", t = 0; t < e.length; ++t) {
|
|
@@ -252,7 +252,7 @@ function Er(e) {
|
|
|
252
252
|
} catch {
|
|
253
253
|
e = "";
|
|
254
254
|
}
|
|
255
|
-
return Array.isArray(e) ? e =
|
|
255
|
+
return Array.isArray(e) ? e = Rr(e) : e = String(e || ""), e;
|
|
256
256
|
}
|
|
257
257
|
var se = (
|
|
258
258
|
/** @class */
|
|
@@ -283,10 +283,10 @@ var se = (
|
|
|
283
283
|
}, e;
|
|
284
284
|
}()
|
|
285
285
|
);
|
|
286
|
-
function
|
|
286
|
+
function Sr() {
|
|
287
287
|
return typeof navigator.onLine < "u" ? navigator.onLine : !0;
|
|
288
288
|
}
|
|
289
|
-
function
|
|
289
|
+
function _r() {
|
|
290
290
|
return typeof document < "u" && typeof document.visibilityState < "u" ? document.visibilityState !== "hidden" : !0;
|
|
291
291
|
}
|
|
292
292
|
var Cr = function(e) {
|
|
@@ -295,18 +295,18 @@ var Cr = function(e) {
|
|
|
295
295
|
});
|
|
296
296
|
};
|
|
297
297
|
const ae = {
|
|
298
|
-
isOnline:
|
|
299
|
-
isDocumentVisible:
|
|
298
|
+
isOnline: Sr,
|
|
299
|
+
isDocumentVisible: _r,
|
|
300
300
|
fetcher: Cr
|
|
301
301
|
};
|
|
302
|
-
var
|
|
303
|
-
return
|
|
302
|
+
var w = function() {
|
|
303
|
+
return w = Object.assign || function(e) {
|
|
304
304
|
for (var r, t = 1, o = arguments.length; t < o; t++) {
|
|
305
305
|
r = arguments[t];
|
|
306
306
|
for (var a in r) Object.prototype.hasOwnProperty.call(r, a) && (e[a] = r[a]);
|
|
307
307
|
}
|
|
308
308
|
return e;
|
|
309
|
-
},
|
|
309
|
+
}, w.apply(this, arguments);
|
|
310
310
|
}, P = function(e, r, t, o) {
|
|
311
311
|
function a(n) {
|
|
312
312
|
return n instanceof t ? n : new t(function(l) {
|
|
@@ -408,7 +408,7 @@ var b = function() {
|
|
|
408
408
|
}
|
|
409
409
|
}
|
|
410
410
|
return n;
|
|
411
|
-
},
|
|
411
|
+
}, Dr = function(e, r, t) {
|
|
412
412
|
if (t || arguments.length === 2) for (var o = 0, a = r.length, n; o < a; o++)
|
|
413
413
|
(n || !(o in r)) && (n || (n = Array.prototype.slice.call(r, 0, o)), n[o] = r[o]);
|
|
414
414
|
return e.concat(n || Array.prototype.slice.call(r));
|
|
@@ -427,7 +427,7 @@ var b = function() {
|
|
|
427
427
|
isOnline: ae.isOnline,
|
|
428
428
|
isDocumentVisible: ae.isDocumentVisible
|
|
429
429
|
};
|
|
430
|
-
function
|
|
430
|
+
function Ar(e, r, t) {
|
|
431
431
|
var o = Q.get(e);
|
|
432
432
|
if (o)
|
|
433
433
|
o.data.push(r);
|
|
@@ -436,7 +436,7 @@ function Dr(e, r, t) {
|
|
|
436
436
|
Q.set(e, [r], t > 0 ? t + a : t);
|
|
437
437
|
}
|
|
438
438
|
}
|
|
439
|
-
function
|
|
439
|
+
function wr(e, r, t) {
|
|
440
440
|
if (t.isDocumentVisible() && !(t.errorRetryCount !== void 0 && r > t.errorRetryCount)) {
|
|
441
441
|
var o = Math.min(r || 0, t.errorRetryCount), a = o * t.errorRetryInterval;
|
|
442
442
|
setTimeout(function() {
|
|
@@ -444,7 +444,7 @@ function br(e, r, t) {
|
|
|
444
444
|
}, a);
|
|
445
445
|
}
|
|
446
446
|
}
|
|
447
|
-
var
|
|
447
|
+
var Te = function(e, r, t, o) {
|
|
448
448
|
return t === void 0 && (t = Oe), o === void 0 && (o = Le.ttl), P(void 0, void 0, void 0, function() {
|
|
449
449
|
var a, n, l, d, f, i, s;
|
|
450
450
|
return $(this, function(u) {
|
|
@@ -480,14 +480,14 @@ var Re = function(e, r, t, o) {
|
|
|
480
480
|
});
|
|
481
481
|
});
|
|
482
482
|
};
|
|
483
|
-
function
|
|
483
|
+
function br() {
|
|
484
484
|
for (var e = this, r = [], t = 0; t < arguments.length; t++)
|
|
485
485
|
r[t] = arguments[t];
|
|
486
|
-
var o, a, n =
|
|
486
|
+
var o, a, n = w({}, Le), l = !1, d = !1, f = ke(), i = (f == null ? void 0 : f.proxy) || f;
|
|
487
487
|
if (!i)
|
|
488
488
|
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;
|
|
489
489
|
var s = (i == null ? void 0 : i.$isServer) || !1;
|
|
490
|
-
r.length >= 1 && (o = r[0]), r.length >= 2 && (a = r[1]), r.length > 2 && (n =
|
|
490
|
+
r.length >= 1 && (o = r[0]), r.length >= 2 && (a = r[1]), r.length > 2 && (n = w(w({}, n), r[2]));
|
|
491
491
|
var u = s ? n.serverTTL : n.ttl, c = typeof o == "function" ? o : Y(o);
|
|
492
492
|
typeof a > "u" && (a = n.fetcher);
|
|
493
493
|
var v = null;
|
|
@@ -500,11 +500,11 @@ function wr() {
|
|
|
500
500
|
}));
|
|
501
501
|
var p = function(m, y) {
|
|
502
502
|
return P(e, void 0, void 0, function() {
|
|
503
|
-
var N,
|
|
503
|
+
var N, R, C, D, x, ce, J, de = this;
|
|
504
504
|
return $(this, function(Z) {
|
|
505
505
|
switch (Z.label) {
|
|
506
506
|
case 0:
|
|
507
|
-
return N = v.data === void 0,
|
|
507
|
+
return N = v.data === void 0, R = c.value, R ? (C = n.cache.get(R), D = C && C.data, v.isValidating = !0, v.isLoading = !D, D && (v.data = D.data, v.error = D.error), x = m || a, !x || !n.isDocumentVisible() && !N || (y == null ? void 0 : y.forceRevalidate) !== void 0 && !(y != null && y.forceRevalidate) ? (v.isValidating = !1, v.isLoading = !1, [
|
|
508
508
|
2
|
|
509
509
|
/*return*/
|
|
510
510
|
]) : C && (ce = !!(Date.now() - C.createdAt >= n.dedupingInterval || y != null && y.forceRevalidate), !ce) ? (v.isValidating = !1, v.isLoading = !1, [
|
|
@@ -516,22 +516,22 @@ function wr() {
|
|
|
516
516
|
return $(this, function(X) {
|
|
517
517
|
switch (X.label) {
|
|
518
518
|
case 0:
|
|
519
|
-
return k = ie.get(
|
|
519
|
+
return k = ie.get(R), k ? [3, 2] : (fe = Array.isArray(R) ? R : [R], ee = x.apply(void 0, Dr([], Ir(fe), !1)), ie.set(R, ee, n.dedupingInterval), [4, Te(R, ee, n.cache, u)]);
|
|
520
520
|
case 1:
|
|
521
521
|
return X.sent(), [3, 4];
|
|
522
522
|
case 2:
|
|
523
|
-
return [4,
|
|
523
|
+
return [4, Te(R, k.data, n.cache, u)];
|
|
524
524
|
case 3:
|
|
525
525
|
X.sent(), X.label = 4;
|
|
526
526
|
case 4:
|
|
527
|
-
return v.isValidating = !1, v.isLoading = !1, ie.delete(
|
|
527
|
+
return v.isValidating = !1, v.isLoading = !1, ie.delete(R), v.error !== void 0 && (ve = !l && n.shouldRetryOnError && (y ? y.shouldRetryOnError : !0), ve && wr(p, y ? y.errorRetryCount : 1, n)), [
|
|
528
528
|
2
|
|
529
529
|
/*return*/
|
|
530
530
|
];
|
|
531
531
|
}
|
|
532
532
|
});
|
|
533
533
|
});
|
|
534
|
-
},
|
|
534
|
+
}, D && n.revalidateDebounce ? (setTimeout(function() {
|
|
535
535
|
return P(de, void 0, void 0, function() {
|
|
536
536
|
return $(this, function(k) {
|
|
537
537
|
switch (k.label) {
|
|
@@ -563,7 +563,7 @@ function wr() {
|
|
|
563
563
|
}
|
|
564
564
|
});
|
|
565
565
|
});
|
|
566
|
-
},
|
|
566
|
+
}, S = function() {
|
|
567
567
|
return P(e, void 0, void 0, function() {
|
|
568
568
|
return $(this, function(m) {
|
|
569
569
|
return [2, p(null, { shouldRetryOnError: !1 })];
|
|
@@ -590,9 +590,9 @@ function wr() {
|
|
|
590
590
|
});
|
|
591
591
|
});
|
|
592
592
|
};
|
|
593
|
-
n.refreshInterval && (h = setTimeout(m, n.refreshInterval)), n.revalidateOnFocus && (document.addEventListener("visibilitychange",
|
|
593
|
+
n.refreshInterval && (h = setTimeout(m, n.refreshInterval)), n.revalidateOnFocus && (document.addEventListener("visibilitychange", S, !1), window.addEventListener("focus", S, !1));
|
|
594
594
|
}), qe(function() {
|
|
595
|
-
l = !0, h && clearTimeout(h), n.revalidateOnFocus && (document.removeEventListener("visibilitychange",
|
|
595
|
+
l = !0, h && clearTimeout(h), n.revalidateOnFocus && (document.removeEventListener("visibilitychange", S, !1), window.removeEventListener("focus", S, !1));
|
|
596
596
|
var m = Q.get(c.value);
|
|
597
597
|
m && (m.data = m.data.filter(function(y) {
|
|
598
598
|
return y !== v;
|
|
@@ -600,14 +600,14 @@ function wr() {
|
|
|
600
600
|
});
|
|
601
601
|
try {
|
|
602
602
|
Ue(c, function(m) {
|
|
603
|
-
Pe(c) || (c.value = m), v.key = m, v.isValidating = !!m,
|
|
603
|
+
Pe(c) || (c.value = m), v.key = m, v.isValidating = !!m, Ar(c.value, v, u), !s && !d && c.value && p(), d = !1;
|
|
604
604
|
}, {
|
|
605
605
|
immediate: !0
|
|
606
606
|
});
|
|
607
607
|
} catch {
|
|
608
608
|
}
|
|
609
|
-
var I =
|
|
610
|
-
return p(m,
|
|
609
|
+
var I = w(w({}, $e(v)), { mutate: function(m, y) {
|
|
610
|
+
return p(m, w(w({}, y), { forceRevalidate: !0 }));
|
|
611
611
|
} });
|
|
612
612
|
return I;
|
|
613
613
|
}
|
|
@@ -620,7 +620,7 @@ function Lr(e, r, t) {
|
|
|
620
620
|
error: a,
|
|
621
621
|
isValidating: n,
|
|
622
622
|
mutate: l
|
|
623
|
-
} =
|
|
623
|
+
} = br(e, r, {
|
|
624
624
|
revalidateDebounce: 500,
|
|
625
625
|
revalidateOnFocus: !1,
|
|
626
626
|
dedupingInterval: 100,
|
|
@@ -638,7 +638,7 @@ const V = {
|
|
|
638
638
|
useI18n: cr,
|
|
639
639
|
useMetricCardBuilder: pr,
|
|
640
640
|
useMetricFetcher: hr,
|
|
641
|
-
useTrendRange:
|
|
641
|
+
useTrendRange: Tr,
|
|
642
642
|
useRequest: Lr
|
|
643
643
|
}, Me = Symbol("METRICS_PROVIDER_KEY"), Mr = (e) => {
|
|
644
644
|
const {
|
|
@@ -663,7 +663,7 @@ const V = {
|
|
|
663
663
|
operator: "in",
|
|
664
664
|
value: [o]
|
|
665
665
|
}), a.value && y.push(...je(r.value, a.value)), y;
|
|
666
|
-
}),
|
|
666
|
+
}), S = {
|
|
667
667
|
datasource: r,
|
|
668
668
|
metrics: Y([
|
|
669
669
|
"request_count"
|
|
@@ -700,7 +700,7 @@ const V = {
|
|
|
700
700
|
queryFn: s,
|
|
701
701
|
abortController: i,
|
|
702
702
|
refreshCounter: e.refreshCounter
|
|
703
|
-
}, I = V.useMetricFetcher(
|
|
703
|
+
}, I = V.useMetricFetcher(S), m = V.useMetricFetcher(h);
|
|
704
704
|
return {
|
|
705
705
|
trafficData: I,
|
|
706
706
|
latencyData: m
|
|
@@ -727,7 +727,7 @@ const V = {
|
|
|
727
727
|
const r = e;
|
|
728
728
|
if (r.dimension && He.findIndex((c) => c === r.dimension) === -1)
|
|
729
729
|
throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);
|
|
730
|
-
const t =
|
|
730
|
+
const t = _e(vr);
|
|
731
731
|
let o;
|
|
732
732
|
t ? o = 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"), o = () => Promise.reject(new Error("Query bridge required")));
|
|
733
733
|
const a = We(), n = g(() => !0), l = g(() => !a.loading && r.queryReady), d = g(() => r.datasource ? r.datasource : "basic"), f = g(() => {
|
|
@@ -780,8 +780,8 @@ var Ve = { exports: {} };
|
|
|
780
780
|
if (s.separator === !1 || i < 1e3)
|
|
781
781
|
return i.toString();
|
|
782
782
|
var u = typeof s.separator == "string" ? s.separator : ",", c = [], v = Math.round(i).toString().split("");
|
|
783
|
-
return v.reverse().forEach(function(p,
|
|
784
|
-
|
|
783
|
+
return v.reverse().forEach(function(p, S) {
|
|
784
|
+
S && S % 3 === 0 && c.push(u), c.push(p);
|
|
785
785
|
}), c.reverse().join("");
|
|
786
786
|
}
|
|
787
787
|
function t(i, s, u) {
|
|
@@ -802,11 +802,11 @@ var Ve = { exports: {} };
|
|
|
802
802
|
})(Ve);
|
|
803
803
|
var Nr = Ve.exports;
|
|
804
804
|
const kr = /* @__PURE__ */ Vr(Nr);
|
|
805
|
-
var O = /* @__PURE__ */ ((e) => (e.GENERIC_COUNT = "GenericCount", e.TRAFFIC = "Traffic", e.ERROR_RATE = "ErrorRate", e.LATENCY = "Latency", e))(O || {}),
|
|
806
|
-
const ue = 2,
|
|
807
|
-
let o = !r || Number(e.toFixed(
|
|
805
|
+
var O = /* @__PURE__ */ ((e) => (e.GENERIC_COUNT = "GenericCount", e.TRAFFIC = "Traffic", e.ERROR_RATE = "ErrorRate", e.LATENCY = "Latency", e))(O || {}), A = /* @__PURE__ */ ((e) => (e.Small = "sm", e.Medium = "md", e.Large = "lg", e.ExtraLarge = "xl", e))(A || {});
|
|
806
|
+
const ue = 2, Re = ue + 2, Fr = (e, r, t = !1) => {
|
|
807
|
+
let o = !r || Number(e.toFixed(Re)) === 0 ? 0 : Number(e.toFixed(Re)) > 0 ? 1 : -1;
|
|
808
808
|
return t && (o *= -1), o;
|
|
809
|
-
}, xr = (e, r, t) => r ? `${Math.abs(e * 100).toFixed(ue)}%` : t, qr = (e, r) => r === 0 ? 0 : e / r - 1, Ur = (e, r = !1) => (r && (e *= -1), e > 0 ? Je : e < 0 ? Ze :
|
|
809
|
+
}, xr = (e, r, t) => r ? `${Math.abs(e * 100).toFixed(ue)}%` : t, qr = (e, r) => r === 0 ? 0 : e / r - 1, Ur = (e, r = !1) => (r && (e *= -1), e > 0 ? Je : e < 0 ? Ze : Ae), Pr = "#ad000e", oe = "#6c7489", Ee = "#52596e", $r = "#007d60", j = "16px", zr = "20px", Kr = {
|
|
810
810
|
key: 0,
|
|
811
811
|
class: "metricscard-description"
|
|
812
812
|
}, Br = { class: "metricscard-valuetrend" }, Xr = {
|
|
@@ -860,7 +860,7 @@ const ue = 2, Te = ue + 2, Fr = (e, r, t = !1) => {
|
|
|
860
860
|
},
|
|
861
861
|
trendIcon: {
|
|
862
862
|
type: Object,
|
|
863
|
-
default:
|
|
863
|
+
default: Ae
|
|
864
864
|
},
|
|
865
865
|
trendRange: {
|
|
866
866
|
type: String,
|
|
@@ -877,7 +877,7 @@ const ue = 2, Te = ue + 2, Fr = (e, r, t = !1) => {
|
|
|
877
877
|
cardSize: {
|
|
878
878
|
type: String,
|
|
879
879
|
required: !1,
|
|
880
|
-
default: () =>
|
|
880
|
+
default: () => A.Large
|
|
881
881
|
},
|
|
882
882
|
hasContainerTitle: {
|
|
883
883
|
type: Boolean,
|
|
@@ -902,28 +902,28 @@ const ue = 2, Te = ue + 2, Fr = (e, r, t = !1) => {
|
|
|
902
902
|
grey: `var(--kui-color-text-neutral-strong, ${Ee})`
|
|
903
903
|
};
|
|
904
904
|
return d > 0 ? f.green : d < 0 ? f.red : f.grey;
|
|
905
|
-
}, a = (d) => d > 0 ? "positive" : d < 0 ? "negative" : "neutral", n = [
|
|
905
|
+
}, a = (d) => d > 0 ? "positive" : d < 0 ? "negative" : "neutral", n = [A.Medium, A.Large].includes(t.cardSize), l = [A.Small].includes(t.cardSize);
|
|
906
906
|
return (d, f) => {
|
|
907
907
|
const i = Ie("KTooltip");
|
|
908
|
-
return
|
|
908
|
+
return T(), _("div", {
|
|
909
909
|
class: z(["metricscard", e.cardSize])
|
|
910
910
|
}, [
|
|
911
911
|
q("div", {
|
|
912
912
|
class: z(["metricscard-title", e.cardSize])
|
|
913
913
|
}, [
|
|
914
|
-
E(l) ? M("", !0) : (
|
|
914
|
+
E(l) ? M("", !0) : (T(), U(re(E(r).get(e.cardType)), {
|
|
915
915
|
key: 0,
|
|
916
916
|
class: "metricscard-icon",
|
|
917
917
|
color: `var(--kui-color-text-neutral, ${E(oe)})`,
|
|
918
918
|
size: E(j)
|
|
919
919
|
}, null, 8, ["color", "size"])),
|
|
920
|
-
(
|
|
920
|
+
(T(), U(re(e.titleTag), null, {
|
|
921
921
|
default: me(() => [
|
|
922
|
-
|
|
922
|
+
De(b(e.title), 1)
|
|
923
923
|
]),
|
|
924
924
|
_: 1
|
|
925
925
|
})),
|
|
926
|
-
e.tooltip ? (
|
|
926
|
+
e.tooltip ? (T(), U(i, {
|
|
927
927
|
key: 1,
|
|
928
928
|
class: "metricscard-tooltip",
|
|
929
929
|
placement: "right",
|
|
@@ -938,38 +938,38 @@ const ue = 2, Te = ue + 2, Fr = (e, r, t = !1) => {
|
|
|
938
938
|
_: 1
|
|
939
939
|
}, 8, ["text"])) : M("", !0)
|
|
940
940
|
], 2),
|
|
941
|
-
e.description && E(n) ? (
|
|
942
|
-
q("span", null,
|
|
941
|
+
e.description && E(n) ? (T(), _("div", Kr, [
|
|
942
|
+
q("span", null, b(e.description), 1)
|
|
943
943
|
])) : M("", !0),
|
|
944
944
|
q("div", Br, [
|
|
945
|
-
e.hasError ? (
|
|
946
|
-
F(E(
|
|
945
|
+
e.hasError ? (T(), _("div", Xr, [
|
|
946
|
+
F(E(we), {
|
|
947
947
|
color: `var(--kui-color-text-neutral, ${E(oe)})`,
|
|
948
948
|
size: E(zr)
|
|
949
949
|
}, null, 8, ["color", "size"]),
|
|
950
|
-
q("div", null, " " +
|
|
951
|
-
])) : (
|
|
950
|
+
q("div", null, " " + b(e.errorMessage), 1)
|
|
951
|
+
])) : (T(), _("div", {
|
|
952
952
|
key: 1,
|
|
953
953
|
class: z(["metricscard-value", e.cardSize]),
|
|
954
954
|
"data-testid": "metric-value"
|
|
955
|
-
},
|
|
956
|
-
E(n) ? (
|
|
955
|
+
}, b(e.metricValue), 3)),
|
|
956
|
+
E(n) ? (T(), _("div", Gr, [
|
|
957
957
|
q("div", {
|
|
958
958
|
class: z(["metricscard-trend-change", a(e.changePolarity)]),
|
|
959
959
|
"data-testid": "metric-trend-parent"
|
|
960
960
|
}, [
|
|
961
|
-
e.changePolarity !== 0 ? (
|
|
961
|
+
e.changePolarity !== 0 ? (T(), U(re(e.trendIcon), {
|
|
962
962
|
key: 0,
|
|
963
963
|
color: o(e.changePolarity),
|
|
964
964
|
size: E(j)
|
|
965
|
-
}, null, 8, ["color", "size"])) : (
|
|
965
|
+
}, null, 8, ["color", "size"])) : (T(), U(E(ir), {
|
|
966
966
|
key: 1,
|
|
967
967
|
color: `var(--kui-color-text-neutral-strong, ${E(Ee)})`,
|
|
968
968
|
size: E(j)
|
|
969
969
|
}, null, 8, ["color", "size"])),
|
|
970
|
-
q("div", jr,
|
|
970
|
+
q("div", jr, b(e.metricChange), 1)
|
|
971
971
|
], 2),
|
|
972
|
-
e.trendRange ? (
|
|
972
|
+
e.trendRange ? (T(), _("div", Hr, b(e.trendRange), 1)) : M("", !0)
|
|
973
973
|
])) : M("", !0)
|
|
974
974
|
])
|
|
975
975
|
], 2);
|
|
@@ -983,7 +983,7 @@ const ue = 2, Te = ue + 2, Fr = (e, r, t = !1) => {
|
|
|
983
983
|
}, Qr = /* @__PURE__ */ le(Yr, [["__scopeId", "data-v-b1513f6f"]]), Wr = {}, Jr = { class: "loading-tabs" };
|
|
984
984
|
function Zr(e, r) {
|
|
985
985
|
const t = Ie("KSkeletonBox");
|
|
986
|
-
return
|
|
986
|
+
return T(), _("div", Jr, [
|
|
987
987
|
F(t, { width: "100" }),
|
|
988
988
|
F(t, { width: "75" })
|
|
989
989
|
]);
|
|
@@ -1032,7 +1032,7 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1032
1032
|
cardSize: {
|
|
1033
1033
|
type: String,
|
|
1034
1034
|
required: !1,
|
|
1035
|
-
default: () =>
|
|
1035
|
+
default: () => A.Large
|
|
1036
1036
|
},
|
|
1037
1037
|
containerTitle: {
|
|
1038
1038
|
type: String,
|
|
@@ -1057,26 +1057,26 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1057
1057
|
hasContainerTitle: !!r.containerTitle
|
|
1058
1058
|
};
|
|
1059
1059
|
};
|
|
1060
|
-
return (a, n) => (
|
|
1060
|
+
return (a, n) => (T(), _("div", {
|
|
1061
1061
|
class: z(["kong-ui-public-metric-card-container", e.cardSize])
|
|
1062
1062
|
}, [
|
|
1063
|
-
r.containerTitle || r.containerDescription ? (
|
|
1064
|
-
|
|
1065
|
-
r.containerDescription ? (
|
|
1063
|
+
r.containerTitle || r.containerDescription ? (T(), _("div", rt, [
|
|
1064
|
+
De(b(r.containerTitle) + " ", 1),
|
|
1065
|
+
r.containerDescription ? (T(), _("div", tt, b(r.containerDescription), 1)) : M("", !0)
|
|
1066
1066
|
])) : M("", !0),
|
|
1067
|
-
t.value ? (
|
|
1068
|
-
F(E(
|
|
1069
|
-
e.errorMessage ? (
|
|
1070
|
-
])) : (
|
|
1071
|
-
(
|
|
1072
|
-
e.loading ? (
|
|
1067
|
+
t.value ? (T(), _("div", nt, [
|
|
1068
|
+
F(E(we), { class: "error-display-icon" }),
|
|
1069
|
+
e.errorMessage ? (T(), _("div", at, b(e.errorMessage), 1)) : M("", !0)
|
|
1070
|
+
])) : (T(), _("div", it, [
|
|
1071
|
+
(T(!0), _(ye, null, Ke(e.cards, (l, d) => (T(), _(ye, null, [
|
|
1072
|
+
e.loading ? (T(), _("div", {
|
|
1073
1073
|
key: `skeleton-${d}`,
|
|
1074
1074
|
class: "loading-tab"
|
|
1075
1075
|
}, [
|
|
1076
1076
|
F(et, {
|
|
1077
|
-
class: z(e.cardSize === E(
|
|
1077
|
+
class: z(e.cardSize === E(A).Small ? "loading-tabs-small" : "loading-tabs-large")
|
|
1078
1078
|
}, null, 8, ["class"])
|
|
1079
|
-
])) : (
|
|
1079
|
+
])) : (T(), U(Qr, Be({ key: d }, { ref_for: !0 }, o(l), {
|
|
1080
1080
|
"card-size": e.cardSize,
|
|
1081
1081
|
"card-type": l.cardType,
|
|
1082
1082
|
description: l.description,
|
|
@@ -1095,14 +1095,14 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1095
1095
|
__name: "MetricsConsumer",
|
|
1096
1096
|
props: {
|
|
1097
1097
|
lookupKey: { default: void 0 },
|
|
1098
|
-
cardSize: { default:
|
|
1098
|
+
cardSize: { default: A.Large },
|
|
1099
1099
|
cardToDisplay: { default: void 0 }
|
|
1100
1100
|
},
|
|
1101
1101
|
setup(e) {
|
|
1102
|
-
const r = e, t =
|
|
1102
|
+
const r = e, t = _e(Me);
|
|
1103
1103
|
if (!t)
|
|
1104
1104
|
throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");
|
|
1105
|
-
const { traffic: o, latency: a } = t.data, { i18n: n } = V.useI18n(), l = g(() => t.containerTitle.value ?
|
|
1105
|
+
const { traffic: o, latency: a } = t.data, { i18n: n } = V.useI18n(), l = g(() => t.containerTitle.value ? A.Medium : r.cardSize), d = V.useMetricCardBuilder({
|
|
1106
1106
|
cardType: O.TRAFFIC,
|
|
1107
1107
|
title: g(() => t.longCardTitles ? n.t("metricCard.long.traffic") : n.t("metricCard.short.traffic")),
|
|
1108
1108
|
record: o.mapped,
|
|
@@ -1111,7 +1111,7 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1111
1111
|
sumGroupedValues: B,
|
|
1112
1112
|
trendRange: o.trendRange
|
|
1113
1113
|
}), f = (h) => `${h.toFixed(ue)}%`, i = g(() => {
|
|
1114
|
-
const h = o.mapped.value, I = K(h, "current", r.lookupKey, ge), m = K(h, "current", r.lookupKey, B), y = I / m * 100 || 0, N = K(h, "previous", r.lookupKey, ge),
|
|
1114
|
+
const h = o.mapped.value, I = K(h, "current", r.lookupKey, ge), m = K(h, "current", r.lookupKey, B), y = I / m * 100 || 0, N = K(h, "previous", r.lookupKey, ge), R = K(h, "previous", r.lookupKey, B), C = N / R * 100 || 0;
|
|
1115
1115
|
return {
|
|
1116
1116
|
cardType: O.ERROR_RATE,
|
|
1117
1117
|
hasError: o.hasError.value,
|
|
@@ -1126,7 +1126,7 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1126
1126
|
cardType: O.LATENCY,
|
|
1127
1127
|
title: g(() => {
|
|
1128
1128
|
const { longCardTitles: h, averageLatencies: I } = t, m = I.value ? "averageLatency" : "p99Latency";
|
|
1129
|
-
return h ? n.t(`metricCard.long.${m}`) : l.value ===
|
|
1129
|
+
return h ? n.t(`metricCard.long.${m}`) : l.value === A.Small ? n.t(`metricCard.small.${m}`) : n.t(`metricCard.short.${m}`);
|
|
1130
1130
|
}),
|
|
1131
1131
|
hasError: a.hasError,
|
|
1132
1132
|
record: a.mapped,
|
|
@@ -1143,7 +1143,7 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1143
1143
|
fallbackDisplayText: n.t("general.notAvailable"),
|
|
1144
1144
|
cardSize: l.value,
|
|
1145
1145
|
hideTitle: !0
|
|
1146
|
-
})),
|
|
1146
|
+
})), S = g(() => ({
|
|
1147
1147
|
loading: p.value.loading,
|
|
1148
1148
|
trafficCard: d.value,
|
|
1149
1149
|
errorRateCard: i.value,
|
|
@@ -1151,7 +1151,7 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1151
1151
|
errorRateFormatted: f(i.value.currentValue),
|
|
1152
1152
|
latencyFormatted: s(u.value.currentValue)
|
|
1153
1153
|
}));
|
|
1154
|
-
return (h, I) => Ce(h.$slots, "default", { cardValues:
|
|
1154
|
+
return (h, I) => Ce(h.$slots, "default", { cardValues: S.value }, () => [
|
|
1155
1155
|
F(st, Xe(Ge(p.value)), null, 16)
|
|
1156
1156
|
]);
|
|
1157
1157
|
}
|
|
@@ -1161,12 +1161,12 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1161
1161
|
statusCode: 200,
|
|
1162
1162
|
body: ut(t, r)
|
|
1163
1163
|
});
|
|
1164
|
-
},
|
|
1165
|
-
var
|
|
1164
|
+
}, Se = (e) => e.reduce((r, t) => (r[t] = { name: t }, r), {}), ut = (e, r) => {
|
|
1165
|
+
var S, h, I;
|
|
1166
1166
|
const t = r != null && r.timeRange && {
|
|
1167
1167
|
start: r.timeRange.start,
|
|
1168
1168
|
end: r.timeRange.end
|
|
1169
|
-
} || ((
|
|
1169
|
+
} || ((S = e.time_range) == null ? void 0 : S.type) === "absolute" ? {
|
|
1170
1170
|
// @ts-ignore - already asserted time range is absolute above
|
|
1171
1171
|
start: new Date(e.time_range.start),
|
|
1172
1172
|
// @ts-ignore - already asserted time range is absolute above
|
|
@@ -1189,8 +1189,8 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1189
1189
|
for (let m = 0; m < f; m++)
|
|
1190
1190
|
for (let y = 0; y < u; y++) {
|
|
1191
1191
|
const N = i ? { [i]: s[y] } : {};
|
|
1192
|
-
(h = e.dimensions) != null && h.includes("status_code_grouped") ? B.forEach((
|
|
1193
|
-
const C = c.reduce((
|
|
1192
|
+
(h = e.dimensions) != null && h.includes("status_code_grouped") ? B.forEach((R) => {
|
|
1193
|
+
const C = c.reduce((D, x) => ((r == null ? void 0 : r.deterministic) ?? !0 ? D[x] = (f - m) * 1e3 + 100 * y + 1 : D[x] = Math.round(Math.random() * 1e3), D), { ...N, status_code_grouped: R });
|
|
1194
1194
|
v.push({
|
|
1195
1195
|
version: "v1",
|
|
1196
1196
|
timestamp: m === 0 ? H(l).toISOString() : H(l + d).toISOString(),
|
|
@@ -1199,18 +1199,16 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1199
1199
|
}) : v.push({
|
|
1200
1200
|
version: "v1",
|
|
1201
1201
|
timestamp: m === 0 ? H(l).toISOString() : H(l + d).toISOString(),
|
|
1202
|
-
event: c.reduce((
|
|
1202
|
+
event: c.reduce((R, C) => ((r == null ? void 0 : r.deterministic) ?? !0 ? R[C] = (f - m) * 1e3 + 100 * y + 1 : R[C] = Math.round(Math.random() * 1e3), R), { ...N })
|
|
1203
1203
|
});
|
|
1204
1204
|
}
|
|
1205
1205
|
const p = {
|
|
1206
|
-
start_ms: l,
|
|
1207
|
-
end_ms: n,
|
|
1208
1206
|
start: new Date(l).toISOString(),
|
|
1209
1207
|
end: new Date(n).toISOString(),
|
|
1210
1208
|
granularity_ms: d,
|
|
1211
1209
|
display: i ? {
|
|
1212
|
-
[i]:
|
|
1213
|
-
...(I = e.dimensions) != null && I.includes("status_code_grouped") ? { status_code_grouped:
|
|
1210
|
+
[i]: Se(s),
|
|
1211
|
+
...(I = e.dimensions) != null && I.includes("status_code_grouped") ? { status_code_grouped: Se(B) } : {}
|
|
1214
1212
|
} : {},
|
|
1215
1213
|
metric_names: e.metrics,
|
|
1216
1214
|
query_id: "test"
|
|
@@ -1223,11 +1221,11 @@ const et = /* @__PURE__ */ le(Wr, [["render", Zr], ["__scopeId", "data-v-9c7113d
|
|
|
1223
1221
|
export {
|
|
1224
1222
|
B as ALL_STATUS_CODE_GROUPS,
|
|
1225
1223
|
ue as DECIMAL_DISPLAY,
|
|
1226
|
-
|
|
1224
|
+
Re as DECIMAL_ROUNDING_PRECISION,
|
|
1227
1225
|
fr as DEFAULT_REFRESH_INTERVAL,
|
|
1228
1226
|
vr as INJECT_QUERY_PROVIDER,
|
|
1229
1227
|
dr as MAX_ANALYTICS_REQUEST_RETRIES,
|
|
1230
|
-
|
|
1228
|
+
A as MetricCardSize,
|
|
1231
1229
|
O as MetricCardType,
|
|
1232
1230
|
ht as MetricsConsumer,
|
|
1233
1231
|
gt as MetricsProvider,
|
|
@@ -1239,5 +1237,5 @@ export {
|
|
|
1239
1237
|
xr as metricChange,
|
|
1240
1238
|
ut as mockExploreResponse,
|
|
1241
1239
|
pt as mockExploreResponseFromCypress,
|
|
1242
|
-
|
|
1240
|
+
Tr as useTrendRange
|
|
1243
1241
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(v,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("@kong-ui-public/analytics-utilities"),require("@kong-ui-public/i18n"),require("axios"),require("@kong-ui-public/analytics-config-store"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","@kong-ui-public/analytics-utilities","@kong-ui-public/i18n","axios","@kong-ui-public/analytics-config-store","@kong/icons"],t):(v=typeof globalThis<"u"?globalThis:v||self,t(v["kong-ui-public-vitals-metric-provider"]={},v.Vue,v["kong-ui-public-analytics-utilities"],v["kong-ui-public-i18n"],v.axios,v["kong-ui-public-analytics-config-store"],v.KongIcons))})(this,function(v,t,re,te,Tr,De,C){"use strict";const ke={general:{notAvailable:"N/A"},metricCard:{small:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Avg. latency",p99Latency:"P99 latency"},short:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Average latency",p99Latency:"P99 latency"},long:{traffic:"Number of requests",errorRate:"Average error rate",averageLatency:"Average latency",p99Latency:"P99 latency"}},trendRange:{custom_days:"vs previous {numDays, plural, =1 {day} other {# days}}",custom_hours:"vs previous {numHours, plural, =1 {hour} other {# hours}}",custom_minutes:"vs previous {numMinutes, plural, =1 {minute} other {# minutes}}","15m":"vs previous 15 minutes","1h":"vs previous hour","6h":"vs previous 6 hours","12h":"vs previous 12 hours","24h":"vs previous 24 hours","7d":"vs previous 7 days","30d":"vs previous 30 days",current_week:"vs previous week",current_month:"vs previous month",current_quarter:"vs previous quarter",previous_week:"vs previous time period",previous_month:"vs previous time period",previous_quarter:"vs previous quarter"}};function Ae(){const e=te.createI18n("en-us",ke);return{i18n:e,i18nT:te.i18nTComponent(e)}}const ne=2,w=["1XX","2XX","3XX","4XX","5XX"],$=["4XX","5XX"],be=["1XX","2XX","3XX"],ae=30*1e3,ie="analytics-query-provider";var oe=(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))(oe||{});const Ve=e=>{var r,n,s,i,a;return e?!!((r=Object.keys(e))!=null&&r.length||(n=e.data)!=null&&n.length||(i=(s=e.data)==null?void 0:s.data)!=null&&i.length||!((a=e.data)!=null&&a.data)&&typeof e.data=="object"&&Object.keys(e==null?void 0:e.data).length):!1};function Ne(e=t.ref({}),r,n,s=Ve){const i=t.ref("PENDING");return t.watchEffect(()=>{const a=s(e.value);if(e.value&&a&&n.value){i.value="VALIDATING_HAS_DATA";return}if(e.value&&n.value){i.value="VALIDATING";return}if(e.value&&r.value){i.value="STALE_IF_ERROR";return}if(e.value===void 0&&!r.value){i.value="PENDING";return}if(e.value&&!r.value&&a){i.value="SUCCESS_HAS_DATA";return}if(e.value&&!r.value){i.value="SUCCESS";return}e.value===void 0&&r&&(i.value="ERROR")}),{state:i,swrvState:oe}}const b=Symbol("default"),K="status_code_grouped",se=(e,r,n,s,i)=>{e[r][n]||(e[r][n]={}),e[r][n][s]=i};function Oe(e,r){var f;const n=((f=e.meta.metric_names)==null?void 0:f[0])||"",s=e.meta.start_ms,i=Object.keys(e.meta.display||{}),a=!!i.find(m=>m===K),u=i.find(m=>m!==K);return i.length>2||i.length>1&&!a?(console.error("Don't know how to work with provided dimensions:",i),{previous:{[b]:{[b]:0}},current:{[b]:{[b]:0}}}):e.data.reduce((m,o)=>{const l=o.event[n],c=u?o.event[u]:b,d=a?o.event[K]:b;return new Date(o.timestamp).getTime()===s&&r?se(m,"previous",c,d,l):se(m,"current",c,d,l),m},{previous:{},current:{}})}function we(e){e.queryReady===void 0&&(e.queryReady=t.computed(()=>!0));const r=t.computed(()=>{var l,c;return{metrics:e.metrics.value,dimensions:[...(l=e.dimensions)!=null&&l.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(c=e.filter.value)!=null&&c.length?{filters:e.filter.value}:{},time_range:e.timeRange.value}}),n=t.computed(()=>{var c,d,y,E;if(!((c=e.queryReady)!=null&&c.value))return null;const l=(d=e.filter)!=null&&d.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${JSON.stringify(e.timeRange.value)}-${(y=e.dimensions)==null?void 0:y.join("-")}-${(E=e.metrics.value)==null?void 0:E.join("-")}-${l}-${e.refreshCounter.value}`}),{response:s,error:i,isValidating:a}=V.useRequest(()=>n.value,()=>e.queryFn({datasource:e.datasource.value,query:r.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:ne}),{state:u,swrvState:f}=Ne(s,i,a),m=t.computed(()=>{var l,c,d,y,E,T,p;return!((c=(l=s.value)==null?void 0:l.data)!=null&&c.length)||!((y=(d=s.value)==null?void 0:d.meta)!=null&&y.display)||!((p=(T=(E=s.value)==null?void 0:E.meta)==null?void 0:T.metric_names)!=null&&p.length)?{current:{},previous:{}}:Oe(s.value,e.withTrend.value)}),o=V.useTrendRange(e.withTrend,e.timeRange,t.computed(()=>{var l;return(l=s.value)==null?void 0:l.meta}));return{isLoading:t.computed(()=>f.PENDING===u.value),hasError:t.computed(()=>f.ERROR===u.value),raw:s,mapped:m,trendRange:o}}const L=(e,r,n=b,s)=>(s??[b]).reduce((a,u)=>{const f=e[r][n];return f?a+(f[u]||0):a},0);function Le(e){const{cardType:r,title:n,description:s,record:i,hasError:a,increaseIsBad:u,formatValueFn:f,trendRange:m}=e;return t.computed(()=>{let o=0,l=0;if(i!=null&&i.value)try{o=L(i.value,"current",e.lookupKey,e.sumGroupedValues),l=L(i.value,"previous",e.lookupKey,e.sumGroupedValues)}catch(c){console.error("Metric card data doesn't have the expected structure:",c)}return{cardType:r,hasError:a.value,currentValue:o,previousValue:l,title:n.value,description:s,increaseIsBad:!!u,formatValueFn:f,trendRange:m==null?void 0:m.value}})}function le(e,r,n){const{i18n:s}=V.useI18n(),i=1e3*60,a=i*60,u=a*24,f=(o,l)=>{let c=l-o;e.value&&(c/=2);const d=c/u,y=c/a,E=c/i;return d>=1?s.t("trendRange.custom_days",{numDays:Math.round(d)}):y>=1?s.t("trendRange.custom_hours",{numHours:Math.round(y)}):E>=1?s.t("trendRange.custom_minutes",{numMinutes:Math.round(E)}):s.t("trendRange.custom_days",{numDays:Math.round(d)})},m=()=>{var o,l;if((o=n==null?void 0:n.value)!=null&&o.start_ms&&n.value.end_ms)return{startMs:n.value.start_ms,endMs:n.value.end_ms};if(((l=r==null?void 0:r.value)==null?void 0:l.type)==="absolute"&&r.value.start&&r.value.end)return{startMs:new Date(r.value.start).getTime(),endMs:new Date(r.value.end).getTime()}};return t.computed(()=>{var o,l;if(((o=r==null?void 0:r.value)==null?void 0:o.type)==="relative"&&e.value)return s.t(`trendRange.${r.value.time_range}`);if(e.value||((l=r==null?void 0:r.value)==null?void 0:l.type)==="absolute"){const c=m();if(c)return f(c.startMs,c.endMs)}return""})}var G=new WeakMap,ce=0;function Me(e){if(!e.length)return"";for(var r="arg",n=0;n<e.length;++n){var s=void 0;e[n]===null||typeof e[n]!="object"&&typeof e[n]!="function"?typeof e[n]=="string"?s='"'+e[n]+'"':s=String(e[n]):G.has(e[n])?s=G.get(e[n]):(s=ce,G.set(e[n],ce++)),r+="@"+s}return r}function Fe(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Me(e):e=String(e||""),e}var X=function(){function e(r){r===void 0&&(r=0),this.items=new Map,this.ttl=r}return e.prototype.serializeKey=function(r){return Fe(r)},e.prototype.get=function(r){var n=this.serializeKey(r);return this.items.get(n)},e.prototype.set=function(r,n,s){var i=this.serializeKey(r),a=s||this.ttl,u=Date.now(),f={data:n,createdAt:u,expiresAt:a?u+a:1/0};this.dispatchExpire(a,f,i),this.items.set(i,f)},e.prototype.dispatchExpire=function(r,n,s){var i=this;r&&setTimeout(function(){var a=Date.now(),u=a>=n.expiresAt;u&&i.delete(s)},r)},e.prototype.delete=function(r){this.items.delete(r)},e}();function Be(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function qe(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var xe=function(e){return fetch(e).then(function(r){return r.json()})};const j={isOnline:Be,isDocumentVisible:qe,fetcher:xe};var A=function(){return A=Object.assign||function(e){for(var r,n=1,s=arguments.length;n<s;n++){r=arguments[n];for(var i in r)Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},A.apply(this,arguments)},M=function(e,r,n,s){function i(a){return a instanceof n?a:new n(function(u){u(a)})}return new(n||(n=Promise))(function(a,u){function f(l){try{o(s.next(l))}catch(c){u(c)}}function m(l){try{o(s.throw(l))}catch(c){u(c)}}function o(l){l.done?a(l.value):i(l.value).then(f,m)}o((s=s.apply(e,r||[])).next())})},F=function(e,r){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,i,a,u;return u={next:f(0),throw:f(1),return:f(2)},typeof Symbol=="function"&&(u[Symbol.iterator]=function(){return this}),u;function f(o){return function(l){return m([o,l])}}function m(o){if(s)throw new TypeError("Generator is already executing.");for(;n;)try{if(s=1,i&&(a=o[0]&2?i.return:o[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,o[1])).done)return a;switch(i=0,a&&(o=[o[0]&2,a.value]),o[0]){case 0:case 1:a=o;break;case 4:return n.label++,{value:o[1],done:!1};case 5:n.label++,i=o[1],o=[0];continue;case 7:o=n.ops.pop(),n.trys.pop();continue;default:if(a=n.trys,!(a=a.length>0&&a[a.length-1])&&(o[0]===6||o[0]===2)){n=0;continue}if(o[0]===3&&(!a||o[1]>a[0]&&o[1]<a[3])){n.label=o[1];break}if(o[0]===6&&n.label<a[1]){n.label=a[1],a=o;break}if(a&&n.label<a[2]){n.label=a[2],n.ops.push(o);break}a[2]&&n.ops.pop(),n.trys.pop();continue}o=r.call(e,n)}catch(l){o=[6,l],i=0}finally{s=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}},Ue=function(e,r){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var s=n.call(e),i,a=[],u;try{for(;(r===void 0||r-- >0)&&!(i=s.next()).done;)a.push(i.value)}catch(f){u={error:f}}finally{try{i&&!i.done&&(n=s.return)&&n.call(s)}finally{if(u)throw u.error}}return a},Pe=function(e,r,n){if(n||arguments.length===2)for(var s=0,i=r.length,a;s<i;s++)(a||!(s in r))&&(a||(a=Array.prototype.slice.call(r,0,s)),a[s]=r[s]);return e.concat(a||Array.prototype.slice.call(r))},ue=new X,q=new X,H=new X,de={cache:ue,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:j.fetcher,isOnline:j.isOnline,isDocumentVisible:j.isDocumentVisible};function ze(e,r,n){var s=q.get(e);if(s)s.data.push(r);else{var i=5e3;q.set(e,[r],n>0?n+i:n)}}function $e(e,r,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&r>n.errorRetryCount)){var s=Math.min(r||0,n.errorRetryCount),i=s*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:s+1,shouldRetryOnError:!0})},i)}}var fe=function(e,r,n,s){return n===void 0&&(n=ue),s===void 0&&(s=de.ttl),M(void 0,void 0,void 0,function(){var i,a,u,f,m,o,l;return F(this,function(c){switch(c.label){case 0:if(!Ge(r))return[3,5];c.label=1;case 1:return c.trys.push([1,3,,4]),[4,r];case 2:return i=c.sent(),[3,4];case 3:return f=c.sent(),a=f,[3,4];case 4:return[3,6];case 5:i=r,c.label=6;case 6:if(u=!1,m={data:i,error:a,isValidating:u},typeof i<"u")try{n.set(e,m,s)}catch(d){console.error("swrv(mutate): failed to set cache",d)}return o=q.get(e),o&&o.data.length&&(l=o.data.filter(function(d){return d.key===e}),l.forEach(function(d,y){typeof m.data<"u"&&(d.data=m.data),d.error=m.error,d.isValidating=m.isValidating,d.isLoading=m.isValidating;var E=y===l.length-1;E||delete l[y]}),l=l.filter(Boolean)),[2,m]}})})};function Ke(){for(var e=this,r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];var s,i,a=A({},de),u=!1,f=!1,m=t.getCurrentInstance(),o=(m==null?void 0:m.proxy)||m;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 l=(o==null?void 0:o.$isServer)||!1;r.length>=1&&(s=r[0]),r.length>=2&&(i=r[1]),r.length>2&&(a=A(A({},a),r[2]));var c=l?a.serverTTL:a.ttl,d=typeof s=="function"?s:t.ref(s);typeof i>"u"&&(i=a.fetcher);var y=null;y||(y=t.reactive({data:void 0,error:void 0,isValidating:!0,isLoading:!0,key:null}));var E=function(g,h){return M(e,void 0,void 0,function(){var N,R,S,k,B,Ce,J,Se=this;return F(this,function(Z){switch(Z.label){case 0:return N=y.data===void 0,R=d.value,R?(S=a.cache.get(R),k=S&&S.data,y.isValidating=!0,y.isLoading=!k,k&&(y.data=k.data,y.error=k.error),B=g||i,!B||!a.isDocumentVisible()&&!N||(h==null?void 0:h.forceRevalidate)!==void 0&&!(h!=null&&h.forceRevalidate)?(y.isValidating=!1,y.isLoading=!1,[2]):S&&(Ce=!!(Date.now()-S.createdAt>=a.dedupingInterval||h!=null&&h.forceRevalidate),!Ce)?(y.isValidating=!1,y.isLoading=!1,[2]):(J=function(){return M(Se,void 0,void 0,function(){var O,_e,ee,Ie;return F(this,function(z){switch(z.label){case 0:return O=H.get(R),O?[3,2]:(_e=Array.isArray(R)?R:[R],ee=B.apply(void 0,Pe([],Ue(_e),!1)),H.set(R,ee,a.dedupingInterval),[4,fe(R,ee,a.cache,c)]);case 1:return z.sent(),[3,4];case 2:return[4,fe(R,O.data,a.cache,c)];case 3:z.sent(),z.label=4;case 4:return y.isValidating=!1,y.isLoading=!1,H.delete(R),y.error!==void 0&&(Ie=!u&&a.shouldRetryOnError&&(h?h.shouldRetryOnError:!0),Ie&&$e(E,h?h.errorRetryCount:1,a)),[2]}})})},k&&a.revalidateDebounce?(setTimeout(function(){return M(Se,void 0,void 0,function(){return F(this,function(O){switch(O.label){case 0:return u?[3,2]:[4,J()];case 1:O.sent(),O.label=2;case 2:return[2]}})})},a.revalidateDebounce),[3,3]):[3,1])):[2];case 1:return[4,J()];case 2:Z.sent(),Z.label=3;case 3:return[2]}})})},T=function(){return M(e,void 0,void 0,function(){return F(this,function(g){return[2,E(null,{shouldRetryOnError:!1})]})})},p=null;t.onMounted(function(){var g=function(){return M(e,void 0,void 0,function(){return F(this,function(h){switch(h.label){case 0:return!y.error&&a.isOnline()?[4,E()]:[3,2];case 1:return h.sent(),[3,3];case 2:p&&clearTimeout(p),h.label=3;case 3:return a.refreshInterval&&!u&&(p=setTimeout(g,a.refreshInterval)),[2]}})})};a.refreshInterval&&(p=setTimeout(g,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",T,!1),window.addEventListener("focus",T,!1))}),t.onUnmounted(function(){u=!0,p&&clearTimeout(p),a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",T,!1),window.removeEventListener("focus",T,!1));var g=q.get(d.value);g&&(g.data=g.data.filter(function(h){return h!==y}))});try{t.watch(d,function(g){t.isReadonly(d)||(d.value=g),y.key=g,y.isValidating=!!g,ze(d.value,y,c),!l&&!f&&d.value&&E(),f=!1},{immediate:!0})}catch{}var I=A(A({},t.toRefs(y)),{mutate:function(g,h){return E(g,A(A({},h),{forceRevalidate:!0}))}});return I}function Ge(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function Xe(e,r,n){const{data:s,error:i,isValidating:a,mutate:u}=Ke(e,r,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:t.computed(()=>s.value),response:s,error:i,isValidating:a,revalidate:u}}const V={useI18n:Ae,useMetricCardBuilder:Le,useMetricFetcher:we,useTrendRange:le,useRequest:Xe},me=Symbol("METRICS_PROVIDER_KEY"),je=e=>{const{datasource:r,dimension:n,dimensionFilterValue:s,additionalFilter:i,queryReady:a,timeRange:u,hasTrendAccess:f,refreshInterval:m,abortController:o,queryFn:l,averageLatencies:c}=e;if(s&&!n)throw new Error("Must provide a dimension if filtering by a value");const d=!!(n&&s),y=!!(n&&!s),E=t.computed(()=>{const h=[];return d&&h.push({field:n,operator:"in",value:[s]}),i.value&&h.push(...re.stripUnknownFilters(r.value,i.value)),h}),T={datasource:r,metrics:t.ref(["request_count"]),dimensions:[...n&&!d?[n]:[],"status_code_grouped"],filter:E,queryReady:a,timeRange:u,withTrend:t.computed(()=>f.value&&!y),refreshInterval:m,queryFn:l,abortController:o,refreshCounter:e.refreshCounter},p={datasource:r,metrics:t.computed(()=>[c.value?"response_latency_average":"response_latency_p99"]),...n&&!d?{dimensions:[n]}:{},filter:E,queryReady:a,timeRange:u,withTrend:t.computed(()=>f.value&&!y),refreshInterval:m,queryFn:l,abortController:o,refreshCounter:e.refreshCounter},I=V.useMetricFetcher(T),g=V.useMetricFetcher(p);return{trafficData:I,latencyData:g}},He=t.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeRange:{default:"30d"},overrideTimeRange:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ae},longCardTitles:{type:Boolean,default:!1},containerTitle:{default:void 0},description:{default:void 0},percentileLatency:{type:Boolean,default:void 0},abortController:{default:void 0},refreshCounter:{default:0}},setup(e){const r=e;if(r.dimension&&re.queryableExploreDimensions.findIndex(d=>d===r.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);const n=t.inject(ie);let s;n?s=n.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"),s=()=>Promise.reject(new Error("Query bridge required")));const i=De.useAnalyticsConfigStore(),a=t.computed(()=>!0),u=t.computed(()=>!i.loading&&r.queryReady),f=t.computed(()=>r.datasource?r.datasource:"basic"),m=t.computed(()=>{const d=r.overrideTimeRange;return d&&!d.tz&&(d.tz=new Intl.DateTimeFormat().resolvedOptions().timeZone),d||{type:"relative",time_range:"7d",tz:new Intl.DateTimeFormat().resolvedOptions().timeZone}}),o=t.computed(()=>!r.percentileLatency),{trafficData:l,latencyData:c}=je({datasource:f,dimension:r.dimension,dimensionFilterValue:r.filterValue,additionalFilter:t.toRef(r,"additionalFilter"),queryReady:u,timeRange:m,hasTrendAccess:a,refreshInterval:r.refreshInterval,queryFn:s,averageLatencies:o,abortController:r.abortController,refreshCounter:t.toRef(r,"refreshCounter")});return t.provide(me,{data:{traffic:l,latency:c},description:t.toRef(()=>r.description),containerTitle:t.toRef(()=>r.containerTitle),hasTrendAccess:a,longCardTitles:r.longCardTitles,averageLatencies:o}),(d,y)=>t.renderSlot(d.$slots,"default",{hasTrendAccess:a.value,timeRange:m.value})}});function Ye(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var ye={exports:{}};(function(e){(function(){function r(o,l){if(l.separator===!1||o<1e3)return o.toString();var c=typeof l.separator=="string"?l.separator:",",d=[],y=Math.round(o).toString().split("");return y.reverse().forEach(function(E,T){T&&T%3===0&&d.push(c),d.push(E)}),d.reverse().join("")}function n(o,l,c){var d=o/l,y=c.round?"round":"floor";return c.decimal===!1?(o=Math[y](d),o.toString()):(c.precision?o=d:o=d<10?Math[y](d*10)/10:Math[y](d),o=o.toString(),typeof c.decimal=="string"&&(o=o.replace(".",c.decimal)),o)}var s=1e3,i=1e4,a=1e6,u=1e9,f=1e12;function m(o,l){var c;l=l||{};var d=o<0;d&&(o=Math.abs(o)),l.precision&&(o=parseFloat(o.toPrecision(l.precision)));var y=l.min10k?i:s;return o<y||l.precision&&l.precision>Math.log10(o)?c=r(n(o,1,l),l):o<a?c=n(o,s,l)+"k":o<u?c=n(o,a,l)+"m":o<f?c=r(n(o,u,l),l)+"b":c=r(n(o,f,l),l)+"t",d&&(c="-"+c),l.capital&&(c=c.toUpperCase()),l.prefix&&(c=l.prefix+c),l.suffix&&(c=c+l.suffix),c}m.addCommas=r,e.exports=m})()})(ye);var Qe=ye.exports;const We=Ye(Qe);var D=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(D||{}),_=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(_||{});const x=2,Y=x+2,ge=(e,r,n=!1)=>{let s=!r||Number(e.toFixed(Y))===0?0:Number(e.toFixed(Y))>0?1:-1;return n&&(s*=-1),s},he=(e,r,n)=>r?`${Math.abs(e*100).toFixed(x)}%`:n,ve=(e,r)=>r===0?0:e/r-1,pe=(e,r=!1)=>(r&&(e*=-1),e>0?C.TrendUpIcon:e<0?C.TrendDownIcon:C.IndeterminateSmallIcon),Je="#ad000e",Q="#6c7489",Ee="#52596e",Ze="#007d60",U="16px",er="20px",rr={key:0,class:"metricscard-description"},tr={class:"metricscard-valuetrend"},nr={key:0,class:"metricscard-error"},ar={key:2,class:"metricscard-trend"},ir={"data-testid":"metric-trend-change"},or={key:0,class:"metricscard-trend-range"},sr=t.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:D.GENERIC_COUNT},title:{type:String,default:"0%",required:!0},description:{type:String,default:"",required:!1},tooltip:{type:String,required:!1,default:""},timeframe:{type:String,required:!1,default:""},metricValue:{type:String,default:""},metricChange:{type:String,required:!0},changePolarity:{type:Number,required:!0},trendIcon:{type:Object,default:C.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>_.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const r=new Map([[D.GENERIC_COUNT,C.VitalsIcon],[D.TRAFFIC,C.CloudUploadIcon],[D.ERROR_RATE,C.WarningOutlineIcon],[D.LATENCY,C.ResponseIcon]]),n=e,s=f=>{const m={red:`var(--kui-color-text-danger-strong, ${Je})`,green:`var(--kui-color-text-success, ${Ze})`,grey:`var(--kui-color-text-neutral-strong, ${Ee})`};return f>0?m.green:f<0?m.red:m.grey},i=f=>f>0?"positive":f<0?"negative":"neutral",a=[_.Medium,_.Large].includes(n.cardSize),u=[_.Small].includes(n.cardSize);return(f,m)=>{const o=t.resolveComponent("KTooltip");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["metricscard",e.cardSize])},[t.createElementVNode("div",{class:t.normalizeClass(["metricscard-title",e.cardSize])},[t.unref(u)?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(t.resolveDynamicComponent(t.unref(r).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${t.unref(Q)})`,size:t.unref(U)},null,8,["color","size"])),(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.titleTag),null,{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.title),1)]),_:1})),e.tooltip?(t.openBlock(),t.createBlock(o,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:t.withCtx(()=>[t.createVNode(t.unref(C.InfoIcon),{color:`var(--kui-color-text-neutral, ${t.unref(Q)})`,size:t.unref(U)},null,8,["color","size"])]),_:1},8,["text"])):t.createCommentVNode("",!0)],2),e.description&&t.unref(a)?(t.openBlock(),t.createElementBlock("div",rr,[t.createElementVNode("span",null,t.toDisplayString(e.description),1)])):t.createCommentVNode("",!0),t.createElementVNode("div",tr,[e.hasError?(t.openBlock(),t.createElementBlock("div",nr,[t.createVNode(t.unref(C.WarningIcon),{color:`var(--kui-color-text-neutral, ${t.unref(Q)})`,size:t.unref(er)},null,8,["color","size"]),t.createElementVNode("div",null," "+t.toDisplayString(e.errorMessage),1)])):(t.openBlock(),t.createElementBlock("div",{key:1,class:t.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},t.toDisplayString(e.metricValue),3)),t.unref(a)?(t.openBlock(),t.createElementBlock("div",ar,[t.createElementVNode("div",{class:t.normalizeClass(["metricscard-trend-change",i(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.trendIcon),{key:0,color:s(e.changePolarity),size:t.unref(U)},null,8,["color","size"])):(t.openBlock(),t.createBlock(t.unref(C.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${t.unref(Ee)})`,size:t.unref(U)},null,8,["color","size"])),t.createElementVNode("div",ir,t.toDisplayString(e.metricChange),1)],2),e.trendRange?(t.openBlock(),t.createElementBlock("div",or,t.toDisplayString(e.trendRange),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)])],2)}}}),W=(e,r)=>{const n=e.__vccOpts||e;for(const[s,i]of r)n[s]=i;return n},lr=W(sr,[["__scopeId","data-v-b1513f6f"]]),cr={},ur={class:"loading-tabs"};function dr(e,r){const n=t.resolveComponent("KSkeletonBox");return t.openBlock(),t.createElementBlock("div",ur,[t.createVNode(n,{width:"100"}),t.createVNode(n,{width:"75"})])}const fr=W(cr,[["render",dr],["__scopeId","data-v-9c7113d7"]]),mr={key:0,class:"container-title"},yr={key:0,class:"container-description"},gr={key:1,class:"error-display"},hr={key:0,class:"error-display-message"},vr={key:2,class:"cards-wrapper"},pr=W(t.defineComponent({__name:"MetricCardContainer",props:{fallbackDisplayText:{type:String,required:!0},cards:{type:Array,required:!0},errorMessage:{type:String,required:!1,default:""},loading:{type:Boolean,required:!1,default:!1},hasTrendAccess:{type:Boolean,required:!1,default:!0},cardSize:{type:String,required:!1,default:()=>_.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const r=e,n=t.computed(()=>r.cards.every(i=>(i==null?void 0:i.hasError)===!0)),s=i=>{const a=ve(i.currentValue,i.previousValue)||0,u=ge(a,r.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):We(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):he(a,r.hasTrendAccess,r.fallbackDisplayText),changePolarity:u,trendIcon:pe(u,i.increaseIsBad),cardSize:r.cardSize,hasContainerTitle:!!r.containerTitle}};return(i,a)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[r.containerTitle||r.containerDescription?(t.openBlock(),t.createElementBlock("div",mr,[t.createTextVNode(t.toDisplayString(r.containerTitle)+" ",1),r.containerDescription?(t.openBlock(),t.createElementBlock("div",yr,t.toDisplayString(r.containerDescription),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0),n.value?(t.openBlock(),t.createElementBlock("div",gr,[t.createVNode(t.unref(C.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(t.openBlock(),t.createElementBlock("div",hr,t.toDisplayString(e.errorMessage),1)):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",vr,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.cards,(u,f)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[e.loading?(t.openBlock(),t.createElementBlock("div",{key:`skeleton-${f}`,class:"loading-tab"},[t.createVNode(fr,{class:t.normalizeClass(e.cardSize===t.unref(_).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])])):(t.openBlock(),t.createBlock(lr,t.mergeProps({key:f},{ref_for:!0},s(u),{"card-size":e.cardSize,"card-type":u.cardType,description:u.description,"error-message":e.errorMessage,"has-error":u.hasError,title:u.title,"title-tag":u.titleTag,tooltip:u.tooltip,"trend-range":u.trendRange}),null,16,["card-size","card-type","description","error-message","has-error","title","title-tag","tooltip","trend-range"]))],64))),256))]))],2))}}),[["__scopeId","data-v-7080ba56"]]),Er=t.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:_.Large},cardToDisplay:{default:void 0}},setup(e){const r=e,n=t.inject(me);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:s,latency:i}=n.data,{i18n:a}=V.useI18n(),u=t.computed(()=>n.containerTitle.value?_.Medium:r.cardSize),f=V.useMetricCardBuilder({cardType:D.TRAFFIC,title:t.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:s.mapped,hasError:s.hasError,lookupKey:r.lookupKey,sumGroupedValues:w,trendRange:s.trendRange}),m=p=>`${p.toFixed(x)}%`,o=t.computed(()=>{const p=s.mapped.value,I=L(p,"current",r.lookupKey,$),g=L(p,"current",r.lookupKey,w),h=I/g*100||0,N=L(p,"previous",r.lookupKey,$),R=L(p,"previous",r.lookupKey,w),S=N/R*100||0;return{cardType:D.ERROR_RATE,hasError:s.hasError.value,currentValue:h,previousValue:S,formatValueFn:m,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:s.trendRange.value}}),l=p=>`${p}ms`,c=V.useMetricCardBuilder({cardType:D.LATENCY,title:t.computed(()=>{const{longCardTitles:p,averageLatencies:I}=n,g=I.value?"averageLatency":"p99Latency";return p?a.t(`metricCard.long.${g}`):u.value===_.Small?a.t(`metricCard.small.${g}`):a.t(`metricCard.short.${g}`)}),hasError:i.hasError,record:i.mapped,lookupKey:r.lookupKey,increaseIsBad:!0,formatValueFn:l,trendRange:i.trendRange}),d=t.computed(()=>r.cardToDisplay==="TRAFFIC"?[f.value]:r.cardToDisplay==="ERROR_RATE"?[o.value]:r.cardToDisplay==="LATENCY"?[c.value]:[f.value,o.value,c.value]),y=t.computed(()=>r.cardToDisplay==="TRAFFIC"||r.cardToDisplay==="ERROR_RATE"?s.isLoading.value:r.cardToDisplay==="LATENCY"?i.isLoading.value:s.isLoading.value||i.isLoading.value),E=t.computed(()=>({cards:d.value,containerTitle:n.containerTitle.value,containerDescription:n.description.value,loading:y.value,hasTrendAccess:n.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:u.value,hideTitle:!0})),T=t.computed(()=>({loading:E.value.loading,trafficCard:f.value,errorRateCard:o.value,latencyCard:c.value,errorRateFormatted:m(o.value.currentValue),latencyFormatted:l(c.value.currentValue)}));return(p,I)=>t.renderSlot(p.$slots,"default",{cardValues:T.value},()=>[t.createVNode(pr,t.normalizeProps(t.guardReactiveProps(E.value)),null,16)])}}),P=e=>new Date(e),Rr=(e,r)=>{const n=e.body;e.reply({statusCode:200,body:Te(n,r)})},Re=e=>e.reduce((r,n)=>(r[n]={name:n},r),{}),Te=(e,r)=>{var T,p,I;const n=r!=null&&r.timeRange&&{start:r.timeRange.start,end:r.timeRange.end}||((T=e.time_range)==null?void 0:T.type)==="absolute"?{start:new Date(e.time_range.start),end:new Date(e.time_range.end)}:{start:new Date(Date.now()-864e5),end:new Date},s=n.end.getTime()-n.start.getTime(),i=e.granularity==="trend"?{start:new Date(n.start.getTime()-s),end:n.end,granularity:n.end.getTime()-n.start.getTime()}:{start:n.start,end:n.end,granularity:n.end.getTime()-n.start.getTime()},a=i.end.getTime(),u=i.start.getTime(),f=i.granularity,m=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 o=(e.dimensions??[]).find(g=>g!=="time"),l=(r==null?void 0:r.dimensionNames)??[],c=Math.max(l.length,1),d=e.metrics||[],y=[];for(let g=0;g<m;g++)for(let h=0;h<c;h++){const N=o?{[o]:l[h]}:{};(p=e.dimensions)!=null&&p.includes("status_code_grouped")?w.forEach(R=>{const S=d.reduce((k,B)=>((r==null?void 0:r.deterministic)??!0?k[B]=(m-g)*1e3+100*h+1:k[B]=Math.round(Math.random()*1e3),k),{...N,status_code_grouped:R});y.push({version:"v1",timestamp:g===0?P(u).toISOString():P(u+f).toISOString(),event:S})}):y.push({version:"v1",timestamp:g===0?P(u).toISOString():P(u+f).toISOString(),event:d.reduce((R,S)=>((r==null?void 0:r.deterministic)??!0?R[S]=(m-g)*1e3+100*h+1:R[S]=Math.round(Math.random()*1e3),R),{...N})})}const E={start_ms:u,end_ms:a,start:new Date(u).toISOString(),end:new Date(a).toISOString(),granularity_ms:f,display:o?{[o]:Re(l),...(I=e.dimensions)!=null&&I.includes("status_code_grouped")?{status_code_grouped:Re(w)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:y,meta:E}};v.ALL_STATUS_CODE_GROUPS=w,v.DECIMAL_DISPLAY=x,v.DECIMAL_ROUNDING_PRECISION=Y,v.DEFAULT_REFRESH_INTERVAL=ae,v.INJECT_QUERY_PROVIDER=ie,v.MAX_ANALYTICS_REQUEST_RETRIES=ne,v.MetricCardSize=_,v.MetricCardType=D,v.MetricsConsumer=Er,v.MetricsProvider=He,v.STATUS_CODES_FAILED=$,v.STATUS_CODES_SUCCESS=be,v.calculateChange=ve,v.changePolarity=ge,v.defineIcon=pe,v.metricChange=he,v.mockExploreResponse=Te,v.mockExploreResponseFromCypress=Rr,v.useTrendRange=le,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(v,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("@kong-ui-public/analytics-utilities"),require("@kong-ui-public/i18n"),require("axios"),require("@kong-ui-public/analytics-config-store"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","@kong-ui-public/analytics-utilities","@kong-ui-public/i18n","axios","@kong-ui-public/analytics-config-store","@kong/icons"],t):(v=typeof globalThis<"u"?globalThis:v||self,t(v["kong-ui-public-vitals-metric-provider"]={},v.Vue,v["kong-ui-public-analytics-utilities"],v["kong-ui-public-i18n"],v.axios,v["kong-ui-public-analytics-config-store"],v.KongIcons))})(this,function(v,t,re,te,Rr,De,C){"use strict";const ke={general:{notAvailable:"N/A"},metricCard:{small:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Avg. latency",p99Latency:"P99 latency"},short:{traffic:"Requests",errorRate:"Error rate",averageLatency:"Average latency",p99Latency:"P99 latency"},long:{traffic:"Number of requests",errorRate:"Average error rate",averageLatency:"Average latency",p99Latency:"P99 latency"}},trendRange:{custom_days:"vs previous {numDays, plural, =1 {day} other {# days}}",custom_hours:"vs previous {numHours, plural, =1 {hour} other {# hours}}",custom_minutes:"vs previous {numMinutes, plural, =1 {minute} other {# minutes}}","15m":"vs previous 15 minutes","1h":"vs previous hour","6h":"vs previous 6 hours","12h":"vs previous 12 hours","24h":"vs previous 24 hours","7d":"vs previous 7 days","30d":"vs previous 30 days",current_week:"vs previous week",current_month:"vs previous month",current_quarter:"vs previous quarter",previous_week:"vs previous time period",previous_month:"vs previous time period",previous_quarter:"vs previous quarter"}};function Ae(){const e=te.createI18n("en-us",ke);return{i18n:e,i18nT:te.i18nTComponent(e)}}const ne=2,O=["1XX","2XX","3XX","4XX","5XX"],$=["4XX","5XX"],be=["1XX","2XX","3XX"],ae=30*1e3,ie="analytics-query-provider";var oe=(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))(oe||{});const we=e=>{var r,n,s,i,a;return e?!!((r=Object.keys(e))!=null&&r.length||(n=e.data)!=null&&n.length||(i=(s=e.data)==null?void 0:s.data)!=null&&i.length||!((a=e.data)!=null&&a.data)&&typeof e.data=="object"&&Object.keys(e==null?void 0:e.data).length):!1};function Ve(e=t.ref({}),r,n,s=we){const i=t.ref("PENDING");return t.watchEffect(()=>{const a=s(e.value);if(e.value&&a&&n.value){i.value="VALIDATING_HAS_DATA";return}if(e.value&&n.value){i.value="VALIDATING";return}if(e.value&&r.value){i.value="STALE_IF_ERROR";return}if(e.value===void 0&&!r.value){i.value="PENDING";return}if(e.value&&!r.value&&a){i.value="SUCCESS_HAS_DATA";return}if(e.value&&!r.value){i.value="SUCCESS";return}e.value===void 0&&r&&(i.value="ERROR")}),{state:i,swrvState:oe}}const b=Symbol("default"),K="status_code_grouped",se=(e,r,n,s,i)=>{e[r][n]||(e[r][n]={}),e[r][n][s]=i};function Ne(e,r){var f;const n=((f=e.meta.metric_names)==null?void 0:f[0])||"",s=new Date(e.meta.start).getTime(),i=Object.keys(e.meta.display||{}),a=!!i.find(m=>m===K),u=i.find(m=>m!==K);return i.length>2||i.length>1&&!a?(console.error("Don't know how to work with provided dimensions:",i),{previous:{[b]:{[b]:0}},current:{[b]:{[b]:0}}}):e.data.reduce((m,o)=>{const l=o.event[n],c=u?o.event[u]:b,d=a?o.event[K]:b;return new Date(o.timestamp).getTime()===s&&r?se(m,"previous",c,d,l):se(m,"current",c,d,l),m},{previous:{},current:{}})}function Oe(e){e.queryReady===void 0&&(e.queryReady=t.computed(()=>!0));const r=t.computed(()=>{var l,c;return{metrics:e.metrics.value,dimensions:[...(l=e.dimensions)!=null&&l.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(c=e.filter.value)!=null&&c.length?{filters:e.filter.value}:{},time_range:e.timeRange.value}}),n=t.computed(()=>{var c,d,g,E;if(!((c=e.queryReady)!=null&&c.value))return null;const l=(d=e.filter)!=null&&d.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${JSON.stringify(e.timeRange.value)}-${(g=e.dimensions)==null?void 0:g.join("-")}-${(E=e.metrics.value)==null?void 0:E.join("-")}-${l}-${e.refreshCounter.value}`}),{response:s,error:i,isValidating:a}=w.useRequest(()=>n.value,()=>e.queryFn({datasource:e.datasource.value,query:r.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:ne}),{state:u,swrvState:f}=Ve(s,i,a),m=t.computed(()=>{var l,c,d,g,E,R,p;return!((c=(l=s.value)==null?void 0:l.data)!=null&&c.length)||!((g=(d=s.value)==null?void 0:d.meta)!=null&&g.display)||!((p=(R=(E=s.value)==null?void 0:E.meta)==null?void 0:R.metric_names)!=null&&p.length)?{current:{},previous:{}}:Ne(s.value,e.withTrend.value)}),o=w.useTrendRange(e.withTrend,e.timeRange,t.computed(()=>{var l;return(l=s.value)==null?void 0:l.meta}));return{isLoading:t.computed(()=>f.PENDING===u.value),hasError:t.computed(()=>f.ERROR===u.value),raw:s,mapped:m,trendRange:o}}const L=(e,r,n=b,s)=>(s??[b]).reduce((a,u)=>{const f=e[r][n];return f?a+(f[u]||0):a},0);function Le(e){const{cardType:r,title:n,description:s,record:i,hasError:a,increaseIsBad:u,formatValueFn:f,trendRange:m}=e;return t.computed(()=>{let o=0,l=0;if(i!=null&&i.value)try{o=L(i.value,"current",e.lookupKey,e.sumGroupedValues),l=L(i.value,"previous",e.lookupKey,e.sumGroupedValues)}catch(c){console.error("Metric card data doesn't have the expected structure:",c)}return{cardType:r,hasError:a.value,currentValue:o,previousValue:l,title:n.value,description:s,increaseIsBad:!!u,formatValueFn:f,trendRange:m==null?void 0:m.value}})}function le(e,r,n){const{i18n:s}=w.useI18n(),i=1e3*60,a=i*60,u=a*24,f=(o,l)=>{let c=l-o;e.value&&(c/=2);const d=c/u,g=c/a,E=c/i;return d>=1?s.t("trendRange.custom_days",{numDays:Math.round(d)}):g>=1?s.t("trendRange.custom_hours",{numHours:Math.round(g)}):E>=1?s.t("trendRange.custom_minutes",{numMinutes:Math.round(E)}):s.t("trendRange.custom_days",{numDays:Math.round(d)})},m=()=>{var o,l;if((o=n==null?void 0:n.value)!=null&&o.start&&n.value.end)return{startMs:new Date(n.value.start).getTime(),endMs:new Date(n.value.end).getTime()};if(((l=r==null?void 0:r.value)==null?void 0:l.type)==="absolute"&&r.value.start&&r.value.end)return{startMs:new Date(r.value.start).getTime(),endMs:new Date(r.value.end).getTime()}};return t.computed(()=>{var o,l;if(((o=r==null?void 0:r.value)==null?void 0:o.type)==="relative"&&e.value)return s.t(`trendRange.${r.value.time_range}`);if(e.value||((l=r==null?void 0:r.value)==null?void 0:l.type)==="absolute"){const c=m();if(c)return f(c.startMs,c.endMs)}return""})}var G=new WeakMap,ce=0;function Me(e){if(!e.length)return"";for(var r="arg",n=0;n<e.length;++n){var s=void 0;e[n]===null||typeof e[n]!="object"&&typeof e[n]!="function"?typeof e[n]=="string"?s='"'+e[n]+'"':s=String(e[n]):G.has(e[n])?s=G.get(e[n]):(s=ce,G.set(e[n],ce++)),r+="@"+s}return r}function Fe(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Me(e):e=String(e||""),e}var X=function(){function e(r){r===void 0&&(r=0),this.items=new Map,this.ttl=r}return e.prototype.serializeKey=function(r){return Fe(r)},e.prototype.get=function(r){var n=this.serializeKey(r);return this.items.get(n)},e.prototype.set=function(r,n,s){var i=this.serializeKey(r),a=s||this.ttl,u=Date.now(),f={data:n,createdAt:u,expiresAt:a?u+a:1/0};this.dispatchExpire(a,f,i),this.items.set(i,f)},e.prototype.dispatchExpire=function(r,n,s){var i=this;r&&setTimeout(function(){var a=Date.now(),u=a>=n.expiresAt;u&&i.delete(s)},r)},e.prototype.delete=function(r){this.items.delete(r)},e}();function Be(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function qe(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var xe=function(e){return fetch(e).then(function(r){return r.json()})};const j={isOnline:Be,isDocumentVisible:qe,fetcher:xe};var A=function(){return A=Object.assign||function(e){for(var r,n=1,s=arguments.length;n<s;n++){r=arguments[n];for(var i in r)Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},A.apply(this,arguments)},M=function(e,r,n,s){function i(a){return a instanceof n?a:new n(function(u){u(a)})}return new(n||(n=Promise))(function(a,u){function f(l){try{o(s.next(l))}catch(c){u(c)}}function m(l){try{o(s.throw(l))}catch(c){u(c)}}function o(l){l.done?a(l.value):i(l.value).then(f,m)}o((s=s.apply(e,r||[])).next())})},F=function(e,r){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,i,a,u;return u={next:f(0),throw:f(1),return:f(2)},typeof Symbol=="function"&&(u[Symbol.iterator]=function(){return this}),u;function f(o){return function(l){return m([o,l])}}function m(o){if(s)throw new TypeError("Generator is already executing.");for(;n;)try{if(s=1,i&&(a=o[0]&2?i.return:o[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,o[1])).done)return a;switch(i=0,a&&(o=[o[0]&2,a.value]),o[0]){case 0:case 1:a=o;break;case 4:return n.label++,{value:o[1],done:!1};case 5:n.label++,i=o[1],o=[0];continue;case 7:o=n.ops.pop(),n.trys.pop();continue;default:if(a=n.trys,!(a=a.length>0&&a[a.length-1])&&(o[0]===6||o[0]===2)){n=0;continue}if(o[0]===3&&(!a||o[1]>a[0]&&o[1]<a[3])){n.label=o[1];break}if(o[0]===6&&n.label<a[1]){n.label=a[1],a=o;break}if(a&&n.label<a[2]){n.label=a[2],n.ops.push(o);break}a[2]&&n.ops.pop(),n.trys.pop();continue}o=r.call(e,n)}catch(l){o=[6,l],i=0}finally{s=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}},Ue=function(e,r){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var s=n.call(e),i,a=[],u;try{for(;(r===void 0||r-- >0)&&!(i=s.next()).done;)a.push(i.value)}catch(f){u={error:f}}finally{try{i&&!i.done&&(n=s.return)&&n.call(s)}finally{if(u)throw u.error}}return a},Pe=function(e,r,n){if(n||arguments.length===2)for(var s=0,i=r.length,a;s<i;s++)(a||!(s in r))&&(a||(a=Array.prototype.slice.call(r,0,s)),a[s]=r[s]);return e.concat(a||Array.prototype.slice.call(r))},ue=new X,q=new X,H=new X,de={cache:ue,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:j.fetcher,isOnline:j.isOnline,isDocumentVisible:j.isDocumentVisible};function ze(e,r,n){var s=q.get(e);if(s)s.data.push(r);else{var i=5e3;q.set(e,[r],n>0?n+i:n)}}function $e(e,r,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&r>n.errorRetryCount)){var s=Math.min(r||0,n.errorRetryCount),i=s*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:s+1,shouldRetryOnError:!0})},i)}}var fe=function(e,r,n,s){return n===void 0&&(n=ue),s===void 0&&(s=de.ttl),M(void 0,void 0,void 0,function(){var i,a,u,f,m,o,l;return F(this,function(c){switch(c.label){case 0:if(!Ge(r))return[3,5];c.label=1;case 1:return c.trys.push([1,3,,4]),[4,r];case 2:return i=c.sent(),[3,4];case 3:return f=c.sent(),a=f,[3,4];case 4:return[3,6];case 5:i=r,c.label=6;case 6:if(u=!1,m={data:i,error:a,isValidating:u},typeof i<"u")try{n.set(e,m,s)}catch(d){console.error("swrv(mutate): failed to set cache",d)}return o=q.get(e),o&&o.data.length&&(l=o.data.filter(function(d){return d.key===e}),l.forEach(function(d,g){typeof m.data<"u"&&(d.data=m.data),d.error=m.error,d.isValidating=m.isValidating,d.isLoading=m.isValidating;var E=g===l.length-1;E||delete l[g]}),l=l.filter(Boolean)),[2,m]}})})};function Ke(){for(var e=this,r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];var s,i,a=A({},de),u=!1,f=!1,m=t.getCurrentInstance(),o=(m==null?void 0:m.proxy)||m;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 l=(o==null?void 0:o.$isServer)||!1;r.length>=1&&(s=r[0]),r.length>=2&&(i=r[1]),r.length>2&&(a=A(A({},a),r[2]));var c=l?a.serverTTL:a.ttl,d=typeof s=="function"?s:t.ref(s);typeof i>"u"&&(i=a.fetcher);var g=null;g||(g=t.reactive({data:void 0,error:void 0,isValidating:!0,isLoading:!0,key:null}));var E=function(y,h){return M(e,void 0,void 0,function(){var V,T,S,k,B,Ce,J,Se=this;return F(this,function(Z){switch(Z.label){case 0:return V=g.data===void 0,T=d.value,T?(S=a.cache.get(T),k=S&&S.data,g.isValidating=!0,g.isLoading=!k,k&&(g.data=k.data,g.error=k.error),B=y||i,!B||!a.isDocumentVisible()&&!V||(h==null?void 0:h.forceRevalidate)!==void 0&&!(h!=null&&h.forceRevalidate)?(g.isValidating=!1,g.isLoading=!1,[2]):S&&(Ce=!!(Date.now()-S.createdAt>=a.dedupingInterval||h!=null&&h.forceRevalidate),!Ce)?(g.isValidating=!1,g.isLoading=!1,[2]):(J=function(){return M(Se,void 0,void 0,function(){var N,_e,ee,Ie;return F(this,function(z){switch(z.label){case 0:return N=H.get(T),N?[3,2]:(_e=Array.isArray(T)?T:[T],ee=B.apply(void 0,Pe([],Ue(_e),!1)),H.set(T,ee,a.dedupingInterval),[4,fe(T,ee,a.cache,c)]);case 1:return z.sent(),[3,4];case 2:return[4,fe(T,N.data,a.cache,c)];case 3:z.sent(),z.label=4;case 4:return g.isValidating=!1,g.isLoading=!1,H.delete(T),g.error!==void 0&&(Ie=!u&&a.shouldRetryOnError&&(h?h.shouldRetryOnError:!0),Ie&&$e(E,h?h.errorRetryCount:1,a)),[2]}})})},k&&a.revalidateDebounce?(setTimeout(function(){return M(Se,void 0,void 0,function(){return F(this,function(N){switch(N.label){case 0:return u?[3,2]:[4,J()];case 1:N.sent(),N.label=2;case 2:return[2]}})})},a.revalidateDebounce),[3,3]):[3,1])):[2];case 1:return[4,J()];case 2:Z.sent(),Z.label=3;case 3:return[2]}})})},R=function(){return M(e,void 0,void 0,function(){return F(this,function(y){return[2,E(null,{shouldRetryOnError:!1})]})})},p=null;t.onMounted(function(){var y=function(){return M(e,void 0,void 0,function(){return F(this,function(h){switch(h.label){case 0:return!g.error&&a.isOnline()?[4,E()]:[3,2];case 1:return h.sent(),[3,3];case 2:p&&clearTimeout(p),h.label=3;case 3:return a.refreshInterval&&!u&&(p=setTimeout(y,a.refreshInterval)),[2]}})})};a.refreshInterval&&(p=setTimeout(y,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",R,!1),window.addEventListener("focus",R,!1))}),t.onUnmounted(function(){u=!0,p&&clearTimeout(p),a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",R,!1),window.removeEventListener("focus",R,!1));var y=q.get(d.value);y&&(y.data=y.data.filter(function(h){return h!==g}))});try{t.watch(d,function(y){t.isReadonly(d)||(d.value=y),g.key=y,g.isValidating=!!y,ze(d.value,g,c),!l&&!f&&d.value&&E(),f=!1},{immediate:!0})}catch{}var I=A(A({},t.toRefs(g)),{mutate:function(y,h){return E(y,A(A({},h),{forceRevalidate:!0}))}});return I}function Ge(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function Xe(e,r,n){const{data:s,error:i,isValidating:a,mutate:u}=Ke(e,r,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:t.computed(()=>s.value),response:s,error:i,isValidating:a,revalidate:u}}const w={useI18n:Ae,useMetricCardBuilder:Le,useMetricFetcher:Oe,useTrendRange:le,useRequest:Xe},me=Symbol("METRICS_PROVIDER_KEY"),je=e=>{const{datasource:r,dimension:n,dimensionFilterValue:s,additionalFilter:i,queryReady:a,timeRange:u,hasTrendAccess:f,refreshInterval:m,abortController:o,queryFn:l,averageLatencies:c}=e;if(s&&!n)throw new Error("Must provide a dimension if filtering by a value");const d=!!(n&&s),g=!!(n&&!s),E=t.computed(()=>{const h=[];return d&&h.push({field:n,operator:"in",value:[s]}),i.value&&h.push(...re.stripUnknownFilters(r.value,i.value)),h}),R={datasource:r,metrics:t.ref(["request_count"]),dimensions:[...n&&!d?[n]:[],"status_code_grouped"],filter:E,queryReady:a,timeRange:u,withTrend:t.computed(()=>f.value&&!g),refreshInterval:m,queryFn:l,abortController:o,refreshCounter:e.refreshCounter},p={datasource:r,metrics:t.computed(()=>[c.value?"response_latency_average":"response_latency_p99"]),...n&&!d?{dimensions:[n]}:{},filter:E,queryReady:a,timeRange:u,withTrend:t.computed(()=>f.value&&!g),refreshInterval:m,queryFn:l,abortController:o,refreshCounter:e.refreshCounter},I=w.useMetricFetcher(R),y=w.useMetricFetcher(p);return{trafficData:I,latencyData:y}},He=t.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeRange:{default:"30d"},overrideTimeRange:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ae},longCardTitles:{type:Boolean,default:!1},containerTitle:{default:void 0},description:{default:void 0},percentileLatency:{type:Boolean,default:void 0},abortController:{default:void 0},refreshCounter:{default:0}},setup(e){const r=e;if(r.dimension&&re.queryableExploreDimensions.findIndex(d=>d===r.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${r.dimension}`);const n=t.inject(ie);let s;n?s=n.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"),s=()=>Promise.reject(new Error("Query bridge required")));const i=De.useAnalyticsConfigStore(),a=t.computed(()=>!0),u=t.computed(()=>!i.loading&&r.queryReady),f=t.computed(()=>r.datasource?r.datasource:"basic"),m=t.computed(()=>{const d=r.overrideTimeRange;return d&&!d.tz&&(d.tz=new Intl.DateTimeFormat().resolvedOptions().timeZone),d||{type:"relative",time_range:"7d",tz:new Intl.DateTimeFormat().resolvedOptions().timeZone}}),o=t.computed(()=>!r.percentileLatency),{trafficData:l,latencyData:c}=je({datasource:f,dimension:r.dimension,dimensionFilterValue:r.filterValue,additionalFilter:t.toRef(r,"additionalFilter"),queryReady:u,timeRange:m,hasTrendAccess:a,refreshInterval:r.refreshInterval,queryFn:s,averageLatencies:o,abortController:r.abortController,refreshCounter:t.toRef(r,"refreshCounter")});return t.provide(me,{data:{traffic:l,latency:c},description:t.toRef(()=>r.description),containerTitle:t.toRef(()=>r.containerTitle),hasTrendAccess:a,longCardTitles:r.longCardTitles,averageLatencies:o}),(d,g)=>t.renderSlot(d.$slots,"default",{hasTrendAccess:a.value,timeRange:m.value})}});function Ye(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var ge={exports:{}};(function(e){(function(){function r(o,l){if(l.separator===!1||o<1e3)return o.toString();var c=typeof l.separator=="string"?l.separator:",",d=[],g=Math.round(o).toString().split("");return g.reverse().forEach(function(E,R){R&&R%3===0&&d.push(c),d.push(E)}),d.reverse().join("")}function n(o,l,c){var d=o/l,g=c.round?"round":"floor";return c.decimal===!1?(o=Math[g](d),o.toString()):(c.precision?o=d:o=d<10?Math[g](d*10)/10:Math[g](d),o=o.toString(),typeof c.decimal=="string"&&(o=o.replace(".",c.decimal)),o)}var s=1e3,i=1e4,a=1e6,u=1e9,f=1e12;function m(o,l){var c;l=l||{};var d=o<0;d&&(o=Math.abs(o)),l.precision&&(o=parseFloat(o.toPrecision(l.precision)));var g=l.min10k?i:s;return o<g||l.precision&&l.precision>Math.log10(o)?c=r(n(o,1,l),l):o<a?c=n(o,s,l)+"k":o<u?c=n(o,a,l)+"m":o<f?c=r(n(o,u,l),l)+"b":c=r(n(o,f,l),l)+"t",d&&(c="-"+c),l.capital&&(c=c.toUpperCase()),l.prefix&&(c=l.prefix+c),l.suffix&&(c=c+l.suffix),c}m.addCommas=r,e.exports=m})()})(ge);var Qe=ge.exports;const We=Ye(Qe);var D=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(D||{}),_=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(_||{});const x=2,Y=x+2,ye=(e,r,n=!1)=>{let s=!r||Number(e.toFixed(Y))===0?0:Number(e.toFixed(Y))>0?1:-1;return n&&(s*=-1),s},he=(e,r,n)=>r?`${Math.abs(e*100).toFixed(x)}%`:n,ve=(e,r)=>r===0?0:e/r-1,pe=(e,r=!1)=>(r&&(e*=-1),e>0?C.TrendUpIcon:e<0?C.TrendDownIcon:C.IndeterminateSmallIcon),Je="#ad000e",Q="#6c7489",Ee="#52596e",Ze="#007d60",U="16px",er="20px",rr={key:0,class:"metricscard-description"},tr={class:"metricscard-valuetrend"},nr={key:0,class:"metricscard-error"},ar={key:2,class:"metricscard-trend"},ir={"data-testid":"metric-trend-change"},or={key:0,class:"metricscard-trend-range"},sr=t.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:D.GENERIC_COUNT},title:{type:String,default:"0%",required:!0},description:{type:String,default:"",required:!1},tooltip:{type:String,required:!1,default:""},timeframe:{type:String,required:!1,default:""},metricValue:{type:String,default:""},metricChange:{type:String,required:!0},changePolarity:{type:Number,required:!0},trendIcon:{type:Object,default:C.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>_.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const r=new Map([[D.GENERIC_COUNT,C.VitalsIcon],[D.TRAFFIC,C.CloudUploadIcon],[D.ERROR_RATE,C.WarningOutlineIcon],[D.LATENCY,C.ResponseIcon]]),n=e,s=f=>{const m={red:`var(--kui-color-text-danger-strong, ${Je})`,green:`var(--kui-color-text-success, ${Ze})`,grey:`var(--kui-color-text-neutral-strong, ${Ee})`};return f>0?m.green:f<0?m.red:m.grey},i=f=>f>0?"positive":f<0?"negative":"neutral",a=[_.Medium,_.Large].includes(n.cardSize),u=[_.Small].includes(n.cardSize);return(f,m)=>{const o=t.resolveComponent("KTooltip");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["metricscard",e.cardSize])},[t.createElementVNode("div",{class:t.normalizeClass(["metricscard-title",e.cardSize])},[t.unref(u)?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(t.resolveDynamicComponent(t.unref(r).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${t.unref(Q)})`,size:t.unref(U)},null,8,["color","size"])),(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.titleTag),null,{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.title),1)]),_:1})),e.tooltip?(t.openBlock(),t.createBlock(o,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:t.withCtx(()=>[t.createVNode(t.unref(C.InfoIcon),{color:`var(--kui-color-text-neutral, ${t.unref(Q)})`,size:t.unref(U)},null,8,["color","size"])]),_:1},8,["text"])):t.createCommentVNode("",!0)],2),e.description&&t.unref(a)?(t.openBlock(),t.createElementBlock("div",rr,[t.createElementVNode("span",null,t.toDisplayString(e.description),1)])):t.createCommentVNode("",!0),t.createElementVNode("div",tr,[e.hasError?(t.openBlock(),t.createElementBlock("div",nr,[t.createVNode(t.unref(C.WarningIcon),{color:`var(--kui-color-text-neutral, ${t.unref(Q)})`,size:t.unref(er)},null,8,["color","size"]),t.createElementVNode("div",null," "+t.toDisplayString(e.errorMessage),1)])):(t.openBlock(),t.createElementBlock("div",{key:1,class:t.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},t.toDisplayString(e.metricValue),3)),t.unref(a)?(t.openBlock(),t.createElementBlock("div",ar,[t.createElementVNode("div",{class:t.normalizeClass(["metricscard-trend-change",i(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.trendIcon),{key:0,color:s(e.changePolarity),size:t.unref(U)},null,8,["color","size"])):(t.openBlock(),t.createBlock(t.unref(C.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${t.unref(Ee)})`,size:t.unref(U)},null,8,["color","size"])),t.createElementVNode("div",ir,t.toDisplayString(e.metricChange),1)],2),e.trendRange?(t.openBlock(),t.createElementBlock("div",or,t.toDisplayString(e.trendRange),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0)])],2)}}}),W=(e,r)=>{const n=e.__vccOpts||e;for(const[s,i]of r)n[s]=i;return n},lr=W(sr,[["__scopeId","data-v-b1513f6f"]]),cr={},ur={class:"loading-tabs"};function dr(e,r){const n=t.resolveComponent("KSkeletonBox");return t.openBlock(),t.createElementBlock("div",ur,[t.createVNode(n,{width:"100"}),t.createVNode(n,{width:"75"})])}const fr=W(cr,[["render",dr],["__scopeId","data-v-9c7113d7"]]),mr={key:0,class:"container-title"},gr={key:0,class:"container-description"},yr={key:1,class:"error-display"},hr={key:0,class:"error-display-message"},vr={key:2,class:"cards-wrapper"},pr=W(t.defineComponent({__name:"MetricCardContainer",props:{fallbackDisplayText:{type:String,required:!0},cards:{type:Array,required:!0},errorMessage:{type:String,required:!1,default:""},loading:{type:Boolean,required:!1,default:!1},hasTrendAccess:{type:Boolean,required:!1,default:!0},cardSize:{type:String,required:!1,default:()=>_.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const r=e,n=t.computed(()=>r.cards.every(i=>(i==null?void 0:i.hasError)===!0)),s=i=>{const a=ve(i.currentValue,i.previousValue)||0,u=ye(a,r.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):We(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):he(a,r.hasTrendAccess,r.fallbackDisplayText),changePolarity:u,trendIcon:pe(u,i.increaseIsBad),cardSize:r.cardSize,hasContainerTitle:!!r.containerTitle}};return(i,a)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[r.containerTitle||r.containerDescription?(t.openBlock(),t.createElementBlock("div",mr,[t.createTextVNode(t.toDisplayString(r.containerTitle)+" ",1),r.containerDescription?(t.openBlock(),t.createElementBlock("div",gr,t.toDisplayString(r.containerDescription),1)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0),n.value?(t.openBlock(),t.createElementBlock("div",yr,[t.createVNode(t.unref(C.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(t.openBlock(),t.createElementBlock("div",hr,t.toDisplayString(e.errorMessage),1)):t.createCommentVNode("",!0)])):(t.openBlock(),t.createElementBlock("div",vr,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.cards,(u,f)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[e.loading?(t.openBlock(),t.createElementBlock("div",{key:`skeleton-${f}`,class:"loading-tab"},[t.createVNode(fr,{class:t.normalizeClass(e.cardSize===t.unref(_).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])])):(t.openBlock(),t.createBlock(lr,t.mergeProps({key:f},{ref_for:!0},s(u),{"card-size":e.cardSize,"card-type":u.cardType,description:u.description,"error-message":e.errorMessage,"has-error":u.hasError,title:u.title,"title-tag":u.titleTag,tooltip:u.tooltip,"trend-range":u.trendRange}),null,16,["card-size","card-type","description","error-message","has-error","title","title-tag","tooltip","trend-range"]))],64))),256))]))],2))}}),[["__scopeId","data-v-7080ba56"]]),Er=t.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:_.Large},cardToDisplay:{default:void 0}},setup(e){const r=e,n=t.inject(me);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:s,latency:i}=n.data,{i18n:a}=w.useI18n(),u=t.computed(()=>n.containerTitle.value?_.Medium:r.cardSize),f=w.useMetricCardBuilder({cardType:D.TRAFFIC,title:t.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:s.mapped,hasError:s.hasError,lookupKey:r.lookupKey,sumGroupedValues:O,trendRange:s.trendRange}),m=p=>`${p.toFixed(x)}%`,o=t.computed(()=>{const p=s.mapped.value,I=L(p,"current",r.lookupKey,$),y=L(p,"current",r.lookupKey,O),h=I/y*100||0,V=L(p,"previous",r.lookupKey,$),T=L(p,"previous",r.lookupKey,O),S=V/T*100||0;return{cardType:D.ERROR_RATE,hasError:s.hasError.value,currentValue:h,previousValue:S,formatValueFn:m,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:s.trendRange.value}}),l=p=>`${p}ms`,c=w.useMetricCardBuilder({cardType:D.LATENCY,title:t.computed(()=>{const{longCardTitles:p,averageLatencies:I}=n,y=I.value?"averageLatency":"p99Latency";return p?a.t(`metricCard.long.${y}`):u.value===_.Small?a.t(`metricCard.small.${y}`):a.t(`metricCard.short.${y}`)}),hasError:i.hasError,record:i.mapped,lookupKey:r.lookupKey,increaseIsBad:!0,formatValueFn:l,trendRange:i.trendRange}),d=t.computed(()=>r.cardToDisplay==="TRAFFIC"?[f.value]:r.cardToDisplay==="ERROR_RATE"?[o.value]:r.cardToDisplay==="LATENCY"?[c.value]:[f.value,o.value,c.value]),g=t.computed(()=>r.cardToDisplay==="TRAFFIC"||r.cardToDisplay==="ERROR_RATE"?s.isLoading.value:r.cardToDisplay==="LATENCY"?i.isLoading.value:s.isLoading.value||i.isLoading.value),E=t.computed(()=>({cards:d.value,containerTitle:n.containerTitle.value,containerDescription:n.description.value,loading:g.value,hasTrendAccess:n.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:u.value,hideTitle:!0})),R=t.computed(()=>({loading:E.value.loading,trafficCard:f.value,errorRateCard:o.value,latencyCard:c.value,errorRateFormatted:m(o.value.currentValue),latencyFormatted:l(c.value.currentValue)}));return(p,I)=>t.renderSlot(p.$slots,"default",{cardValues:R.value},()=>[t.createVNode(pr,t.normalizeProps(t.guardReactiveProps(E.value)),null,16)])}}),P=e=>new Date(e),Tr=(e,r)=>{const n=e.body;e.reply({statusCode:200,body:Re(n,r)})},Te=e=>e.reduce((r,n)=>(r[n]={name:n},r),{}),Re=(e,r)=>{var R,p,I;const n=r!=null&&r.timeRange&&{start:r.timeRange.start,end:r.timeRange.end}||((R=e.time_range)==null?void 0:R.type)==="absolute"?{start:new Date(e.time_range.start),end:new Date(e.time_range.end)}:{start:new Date(Date.now()-864e5),end:new Date},s=n.end.getTime()-n.start.getTime(),i=e.granularity==="trend"?{start:new Date(n.start.getTime()-s),end:n.end,granularity:n.end.getTime()-n.start.getTime()}:{start:n.start,end:n.end,granularity:n.end.getTime()-n.start.getTime()},a=i.end.getTime(),u=i.start.getTime(),f=i.granularity,m=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 o=(e.dimensions??[]).find(y=>y!=="time"),l=(r==null?void 0:r.dimensionNames)??[],c=Math.max(l.length,1),d=e.metrics||[],g=[];for(let y=0;y<m;y++)for(let h=0;h<c;h++){const V=o?{[o]:l[h]}:{};(p=e.dimensions)!=null&&p.includes("status_code_grouped")?O.forEach(T=>{const S=d.reduce((k,B)=>((r==null?void 0:r.deterministic)??!0?k[B]=(m-y)*1e3+100*h+1:k[B]=Math.round(Math.random()*1e3),k),{...V,status_code_grouped:T});g.push({version:"v1",timestamp:y===0?P(u).toISOString():P(u+f).toISOString(),event:S})}):g.push({version:"v1",timestamp:y===0?P(u).toISOString():P(u+f).toISOString(),event:d.reduce((T,S)=>((r==null?void 0:r.deterministic)??!0?T[S]=(m-y)*1e3+100*h+1:T[S]=Math.round(Math.random()*1e3),T),{...V})})}const E={start:new Date(u).toISOString(),end:new Date(a).toISOString(),granularity_ms:f,display:o?{[o]:Te(l),...(I=e.dimensions)!=null&&I.includes("status_code_grouped")?{status_code_grouped:Te(O)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:g,meta:E}};v.ALL_STATUS_CODE_GROUPS=O,v.DECIMAL_DISPLAY=x,v.DECIMAL_ROUNDING_PRECISION=Y,v.DEFAULT_REFRESH_INTERVAL=ae,v.INJECT_QUERY_PROVIDER=ie,v.MAX_ANALYTICS_REQUEST_RETRIES=ne,v.MetricCardSize=_,v.MetricCardType=D,v.MetricsConsumer=Er,v.MetricsProvider=He,v.STATUS_CODES_FAILED=$,v.STATUS_CODES_SUCCESS=be,v.calculateChange=ve,v.changePolarity=ye,v.defineIcon=pe,v.metricChange=he,v.mockExploreResponse=Re,v.mockExploreResponseFromCypress=Tr,v.useTrendRange=le,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kong-ui-public/analytics-metric-provider",
|
|
3
|
-
"version": "11.1.
|
|
3
|
+
"version": "11.1.13",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/vitals-metric-provider.umd.js",
|
|
6
6
|
"module": "./dist/vitals-metric-provider.es.js",
|
|
@@ -40,16 +40,16 @@
|
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@kong/kongponents": "^9.49.0",
|
|
43
|
-
"@kong-ui-public/analytics-config-store": "^1.2.
|
|
44
|
-
"@kong-ui-public/
|
|
45
|
-
"@kong-ui-public/
|
|
43
|
+
"@kong-ui-public/analytics-config-store": "^1.2.16",
|
|
44
|
+
"@kong-ui-public/analytics-utilities": "^12.8.0",
|
|
45
|
+
"@kong-ui-public/i18n": "^2.4.5"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"@kong/design-tokens": "1.18.2",
|
|
49
49
|
"@kong/kongponents": "9.49.0",
|
|
50
50
|
"pinia": ">= 2.1.7 < 3",
|
|
51
|
-
"@kong-ui-public/analytics-config-store": "^1.2.
|
|
52
|
-
"@kong-ui-public/analytics-utilities": "^12.
|
|
51
|
+
"@kong-ui-public/analytics-config-store": "^1.2.16",
|
|
52
|
+
"@kong-ui-public/analytics-utilities": "^12.8.0",
|
|
53
53
|
"@kong-ui-public/i18n": "^2.4.5"
|
|
54
54
|
},
|
|
55
55
|
"scripts": {
|