@kong-ui-public/analytics-metric-provider 8.6.13 → 8.6.14
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.
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.metricscard-tooltip,.trafficcard.active .metricscard-tooltip{pointer-events:all}.metricscard[data-v-
|
|
1
|
+
.metricscard-tooltip,.trafficcard.active .metricscard-tooltip{pointer-events:all}.metricscard[data-v-9765f7cc]{display:flex;flex-direction:column;width:100%}@media (max-width: 767px){.metricscard[data-v-9765f7cc]{max-width:none;width:auto}}@media (min-width: 768px){.metricscard[data-v-9765f7cc]{height:100%;justify-content:space-evenly}}.metricscard[data-v-9765f7cc]:hover{border:none;text-decoration:none}.metricscard-title[data-v-9765f7cc]{align-items:center;color:#000933;color:var(--kui-color-text, #000933);display:flex;flex-direction:row;font-size:14px;font-size:var(--kui-font-size-30, 14px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);line-height:16px;line-height:var(--kui-line-height-20, 16px);margin:0;margin:var(--kui-space-0, 0px)}.metricscard-title.sm[data-v-9765f7cc]{font-size:12px;font-size:var(--kui-font-size-20, 12px)}.metricscard-title.md[data-v-9765f7cc]{font-size:14px;font-size:var(--kui-font-size-30, 14px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600)}.metricscard-title.lg[data-v-9765f7cc],.metricscard-title.xl[data-v-9765f7cc]{font-size:14px;font-size:var(--kui-font-size-30, 14px)}.metricscard-description[data-v-9765f7cc]{color:#afb7c5;color:var(--kui-color-text-disabled, #afb7c5);font-size:12px;font-size:var(--kui-font-size-20, 12px);line-height:16px;line-height:var(--kui-line-height-20, 16px);margin-top:8px;margin-top:var(--kui-space-40, 8px)}.metricscard-icon[data-v-9765f7cc]{margin-right:4px;margin-right:var(--kui-space-20, 4px)}.metricscard-value[data-v-9765f7cc]{color:#000933;color:var(--kui-color-text, #000933);display:flex;flex-direction:row;font-size:24px;font-size:var(--kui-font-size-70, 24px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);justify-content:space-between;line-height:32px;line-height:var(--kui-line-height-60, 32px)}.metricscard-value.sm[data-v-9765f7cc]{font-size:14px;font-size:var(--kui-font-size-30, 14px);line-height:24px;line-height:var(--kui-line-height-40, 24px)}.metricscard-value.xl[data-v-9765f7cc]{font-size:48px;font-size:var(--kui-font-size-100, 48px)}.metricscard-valuetrend[data-v-9765f7cc]{display:flex;flex-direction:column;row-gap:12px;row-gap:var(--kui-space-50, 12px)}@media (max-width: 767px){.metricscard-valuetrend[data-v-9765f7cc]{row-gap:6px;row-gap:var(--kui-space-30, 6px)}}.metricscard-valuetrend.is-compact[data-v-9765f7cc]{align-items:center;flex-direction:row!important;justify-content:space-between;margin-top:0;margin-top:var(--kui-space-0, 0px)}.metricscard-trend[data-v-9765f7cc]{align-items:center;column-gap:8px;column-gap:var(--kui-space-40, 8px);display:flex}.metricscard-trend-change[data-v-9765f7cc]{align-items:center;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);display:flex;flex-direction:row;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);padding:4px 8px;padding:var(--kui-space-20, 4px) var(--kui-space-40, 8px)}.metricscard-trend-change .kui-icon[data-v-9765f7cc]{margin-right:4px;margin-right:var(--kui-space-20, 4px)}.metricscard-trend-change.positive[data-v-9765f7cc]{background-color:#ecfffb;background-color:var(--kui-color-background-success-weakest, #ecfffb);color:#007d60;color:var(--kui-color-text-success, #007d60)}.metricscard-trend-change.negative[data-v-9765f7cc]{background-color:#ffe5e5;background-color:var(--kui-color-background-danger-weakest, #ffe5e5);color:#ad000e;color:var(--kui-color-text-danger-strong, #ad000e)}.metricscard-trend-change.neutral[data-v-9765f7cc]{background-color:#e0e4ea;background-color:var(--kui-color-background-neutral-weaker, #e0e4ea);color:#52596e;color:var(--kui-color-text-neutral-strong, #52596e)}.metricscard-trend-range[data-v-9765f7cc]{color:#000933;color:var(--kui-color-text, #000933);font-size:12px;font-size:var(--kui-font-size-20, 12px)}.metricscard-tooltip[data-v-9765f7cc]{display:inline-flex;margin:auto 0 auto 4px;margin:var(--kui-space-auto, auto) var(--kui-space-0, 0px) var(--kui-space-auto, auto) var(--kui-space-20, 4px);vertical-align:middle}.metricscard-error[data-v-9765f7cc]{align-items:center;color:#3a3f51;color:var(--kui-color-text-neutral-stronger, #3a3f51);display:flex;flex-direction:row;font-size:12px;font-size:var(--kui-font-size-20, 12px);margin-top:8px;margin-top:var(--kui-space-40, 8px)}.metricscard-error .kong-icon-warning[data-v-9765f7cc]{margin-right:12px;margin-right:var(--kui-space-50, 12px)}.metricscard.active .metricscard-tooltip[data-v-9765f7cc]{pointer-events:all}.loading-tabs[data-v-50eab68c]{display:flex;flex-direction:column}.loading-tabs-large[data-v-50eab68c]{padding:4px;row-gap:12px;width:240px}.loading-tabs-small[data-v-50eab68c]{padding:2px;row-gap:8px;width:120px}.loading-tabs-small .box[data-v-50eab68c]{height:12px}@media (max-width: 767px){.loading-tabs[data-v-50eab68c]{width:auto}}.kong-ui-public-metric-card-container[data-v-eac0ca04]{background-color:transparent;background-color:var(--kui-color-background-transparent, transparent);display:flex;flex-direction:column;justify-content:space-between;width:100%}.kong-ui-public-metric-card-container .container-title[data-v-eac0ca04]{align-items:center;display:flex;font-size:16px;font-size:var(--kui-font-size-40, 16px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);justify-content:space-between;margin-bottom:12px;margin-bottom:var(--kui-space-50, 12px)}.kong-ui-public-metric-card-container .container-title .container-description[data-v-eac0ca04]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:400;font-weight:var(--kui-font-weight-regular, 400)}.kong-ui-public-metric-card-container .cards-wrapper[data-v-eac0ca04]{display:flex;flex-direction:row;flex-grow:1;column-gap:24px;row-gap:16px}@media (max-width: 767px){.kong-ui-public-metric-card-container .cards-wrapper[data-v-eac0ca04]{column-gap:16px;row-gap:16px;flex-direction:column}}.kong-ui-public-metric-card-container.sm[data-v-eac0ca04]{column-gap:0;row-gap:0}.kong-ui-public-metric-card-container .error-display[data-v-eac0ca04]{align-items:center;display:flex;justify-content:center;margin:auto;margin:var(--kui-space-auto, auto)}.kong-ui-public-metric-card-container .error-display-icon[data-v-eac0ca04]{display:flex}.kong-ui-public-metric-card-container .error-display-message[data-v-eac0ca04]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);font-size:14px;font-size:var(--kui-font-size-30, 14px);margin-left:12px;margin-left:var(--kui-space-50, 12px)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetricsCard.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/display/MetricsCard.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MetricsCard.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/display/MetricsCard.vue"],"names":[],"mappings":"AAsZA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AASnC,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAE5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAIlD,OAAO,KAAK,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,aAAa,CAAA;;;cA6ZtC,QAAQ,CAAC,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAqCxB,QAAQ,CAAC,OAAO,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgB5B,QAAQ,CAAC,cAAc,CAAC;;;;;;;;;;cAUxB,QAAQ,CAAC,SAAS,CAAC;;;;;cA/DnB,QAAQ,CAAC,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAqCxB,QAAQ,CAAC,OAAO,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgB5B,QAAQ,CAAC,cAAc,CAAC;;;;;;;;;;cAUxB,QAAQ,CAAC,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAtEvC,wBA0EG"}
|
|
@@ -941,7 +941,7 @@ const le = 2, Ee = le + 2, Ur = (e, r, t = !1) => {
|
|
|
941
941
|
for (const [o, a] of r)
|
|
942
942
|
t[o] = a;
|
|
943
943
|
return t;
|
|
944
|
-
}, et = /* @__PURE__ */ ce(Zr, [["__scopeId", "data-v-
|
|
944
|
+
}, et = /* @__PURE__ */ ce(Zr, [["__scopeId", "data-v-9765f7cc"]]), rt = {}, tt = { class: "loading-tabs" };
|
|
945
945
|
function nt(e, r) {
|
|
946
946
|
const t = Ae("KSkeletonBox");
|
|
947
947
|
return T(), S("div", tt, [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(R,r){typeof exports=="object"&&typeof module<"u"?r(exports,require("vue"),require("@kong-ui-public/analytics-utilities"),require("@kong-ui-public/i18n"),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","@kong-ui-public/analytics-config-store","@kong/icons"],r):(R=typeof globalThis<"u"?globalThis:R||self,r(R["kong-ui-public-vitals-metric-provider"]={},R.Vue,R["kong-ui-public-analytics-utilities"],R["kong-ui-public-i18n"],R["kong-ui-public-analytics-config-store"],R.KongIcons))})(this,function(R,r,A,re,Te,_){"use strict";const Ce={general:{notAvailable:"N/A"},metricCard:{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:"vs previous {numDays, plural, =1 {day} other {# days}}","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 Se(){const e=re.createI18n("en-us",Ce);return{i18n:e,i18nT:re.i18nTComponent(e)}}const te=2,w=["1XX","2XX","3XX","4XX","5XX"],P=["4XX","5XX"],_e=["1XX","2XX","3XX"],ne=30*1e3,ae="analytics-query-provider";var ie=(e=>(e.VALIDATING="VALIDATING",e.VALIDATING_HAS_DATA="VALIDATING_HAS_DATA",e.PENDING="PENDING",e.SUCCESS="SUCCESS",e.SUCCESS_HAS_DATA="SUCCESS_HAS_DATA",e.ERROR="ERROR",e.STALE_IF_ERROR="STALE_IF_ERROR",e))(ie||{});const Ie=e=>{var t,n,s,i,a;return e?!!((t=Object.keys(e))!=null&&t.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 ke(e=r.ref({}),t,n,s=Ie){const i=r.ref("PENDING");return r.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&&t.value){i.value="STALE_IF_ERROR";return}if(e.value===void 0&&!t.value){i.value="PENDING";return}if(e.value&&!t.value&&a){i.value="SUCCESS_HAS_DATA";return}if(e.value&&!t.value){i.value="SUCCESS";return}e.value===void 0&&t&&(i.value="ERROR")}),{state:i,swrvState:ie}}const b=Symbol("default"),U="status_code_grouped",oe=(e,t,n,s,i)=>{e[t][n]||(e[t][n]={}),e[t][n][s]=i};function Ae(e,t){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(d=>d===U),l=i.find(d=>d!==U);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((d,o)=>{const c=o.event[n],u=l?o.event[l]:b,m=a?o.event[U]:b;return new Date(o.timestamp).getTime()===s&&t?oe(d,"previous",u,m,c):oe(d,"current",u,m,c),d},{previous:{},current:{}})}function De(e){e.queryReady===void 0&&(e.queryReady=r.computed(()=>!0));const{i18n:t}=N.useI18n(),n=r.computed(()=>{var u,m;return{metrics:e.metrics.value,dimensions:[...(u=e.dimensions)!=null&&u.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(m=e.filter.value)!=null&&m.length?{filters:e.filter.value}:{},time_range:e.timeframe.value.v4Query(e.tz.value)}}),s=r.computed(()=>{var m,y,p,h;if(!((m=e.queryReady)!=null&&m.value))return null;const u=(y=e.filter)!=null&&y.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${e.timeframe.value.cacheKey()}-${(p=e.dimensions)==null?void 0:p.join("-")}-${(h=e.metrics.value)==null?void 0:h.join("-")}-${u}-${e.refreshCounter.value}`}),{response:i,error:a,isValidating:l}=N.useRequest(()=>s.value,()=>e.queryFn({datasource:e.datasource.value,query:n.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:te}),{state:f,swrvState:d}=ke(i,a,l),o=r.computed(()=>{var u,m,y,p,h,v,T;return!((m=(u=i.value)==null?void 0:u.data)!=null&&m.length)||!((p=(y=i.value)==null?void 0:y.meta)!=null&&p.display)||!((T=(v=(h=i.value)==null?void 0:h.meta)==null?void 0:v.metric_names)!=null&&T.length)?{current:{},previous:{}}:Ae(i.value,e.withTrend.value)}),c=r.computed(()=>{var u,m;if(e.timeframe.value.key==="custom"){if(!((m=(u=i.value)==null?void 0:u.meta)!=null&&m.start_ms))return"";const{start_ms:y,end_ms:p}=i.value.meta;let h=(p-y)/(1e3*60*60*24);return e.withTrend.value&&(h/=2),t.t("trendRange.custom",{numDays:Math.round(h)})}else return e.withTrend.value?t.t(`trendRange.${e.timeframe.value.key}`):""});return{isLoading:r.computed(()=>d.PENDING===f.value),hasError:r.computed(()=>d.ERROR===f.value),raw:i,mapped:o,trendRange:c}}const L=(e,t,n=b,s)=>(s??[b]).reduce((a,l)=>{const f=e[t][n];return f?a+(f[l]||0):a},0);function be(e){const{cardType:t,title:n,description:s,record:i,hasError:a,increaseIsBad:l,formatValueFn:f,trendRange:d}=e;return r.computed(()=>{let o=0,c=0;if(i!=null&&i.value)try{o=L(i.value,"current",e.lookupKey,e.sumGroupedValues),c=L(i.value,"previous",e.lookupKey,e.sumGroupedValues)}catch(u){console.error("Metric card data doesn't have the expected structure:",u)}return{cardType:t,hasError:a.value,currentValue:o,previousValue:c,title:n.value,description:s,increaseIsBad:!!l,formatValueFn:f,trendRange:d==null?void 0:d.value}})}var $=new WeakMap,se=0;function Ve(e){if(!e.length)return"";for(var t="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]):$.has(e[n])?s=$.get(e[n]):(s=se,$.set(e[n],se++)),t+="@"+s}return t}function Ne(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Ve(e):e=String(e||""),e}var X=function(){function e(t){t===void 0&&(t=0),this.items=new Map,this.ttl=t}return e.prototype.serializeKey=function(t){return Ne(t)},e.prototype.get=function(t){var n=this.serializeKey(t);return this.items.get(n)},e.prototype.set=function(t,n,s){var i=this.serializeKey(t),a=s||this.ttl,l=Date.now(),f={data:n,createdAt:l,expiresAt:a?l+a:1/0};this.dispatchExpire(a,f,i),this.items.set(i,f)},e.prototype.dispatchExpire=function(t,n,s){var i=this;t&&setTimeout(function(){var a=Date.now(),l=a>=n.expiresAt;l&&i.delete(s)},t)},e.prototype.delete=function(t){this.items.delete(t)},e}();function Oe(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function we(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var Le=function(e){return fetch(e).then(function(t){return t.json()})};const G={isOnline:Oe,isDocumentVisible:we,fetcher:Le};var D=function(){return D=Object.assign||function(e){for(var t,n=1,s=arguments.length;n<s;n++){t=arguments[n];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e},D.apply(this,arguments)},B=function(e,t,n,s){function i(a){return a instanceof n?a:new n(function(l){l(a)})}return new(n||(n=Promise))(function(a,l){function f(c){try{o(s.next(c))}catch(u){l(u)}}function d(c){try{o(s.throw(c))}catch(u){l(u)}}function o(c){c.done?a(c.value):i(c.value).then(f,d)}o((s=s.apply(e,t||[])).next())})},F=function(e,t){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,i,a,l;return l={next:f(0),throw:f(1),return:f(2)},typeof Symbol=="function"&&(l[Symbol.iterator]=function(){return this}),l;function f(o){return function(c){return d([o,c])}}function d(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=t.call(e,n)}catch(c){o=[6,c],i=0}finally{s=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}},Be=function(e,t){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var s=n.call(e),i,a=[],l;try{for(;(t===void 0||t-- >0)&&!(i=s.next()).done;)a.push(i.value)}catch(f){l={error:f}}finally{try{i&&!i.done&&(n=s.return)&&n.call(s)}finally{if(l)throw l.error}}return a},Fe=function(e,t,n){if(n||arguments.length===2)for(var s=0,i=t.length,a;s<i;s++)(a||!(s in t))&&(a||(a=Array.prototype.slice.call(t,0,s)),a[s]=t[s]);return e.concat(a||Array.prototype.slice.call(t))},ce=new X,q=new X,j=new X,le={cache:ce,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:G.fetcher,isOnline:G.isOnline,isDocumentVisible:G.isDocumentVisible};function Me(e,t,n){var s=q.get(e);if(s)s.data.push(t);else{var i=5e3;q.set(e,[t],n>0?n+i:n)}}function qe(e,t,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&t>n.errorRetryCount)){var s=Math.min(t||0,n.errorRetryCount),i=s*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:s+1,shouldRetryOnError:!0})},i)}}var ue=function(e,t,n,s){return n===void 0&&(n=ce),s===void 0&&(s=le.ttl),B(void 0,void 0,void 0,function(){var i,a,l,f,d,o,c;return F(this,function(u){switch(u.label){case 0:if(!ze(t))return[3,5];u.label=1;case 1:return u.trys.push([1,3,,4]),[4,t];case 2:return i=u.sent(),[3,4];case 3:return f=u.sent(),a=f,[3,4];case 4:return[3,6];case 5:i=t,u.label=6;case 6:if(l=!1,d={data:i,error:a,isValidating:l},typeof i<"u")try{n.set(e,d,s)}catch(m){console.error("swrv(mutate): failed to set cache",m)}return o=q.get(e),o&&o.data.length&&(c=o.data.filter(function(m){return m.key===e}),c.forEach(function(m,y){typeof d.data<"u"&&(m.data=d.data),m.error=d.error,m.isValidating=d.isValidating;var p=y===c.length-1;p||delete c[y]}),c=c.filter(Boolean)),[2,d]}})})};function xe(){for(var e=this,t=[],n=0;n<arguments.length;n++)t[n]=arguments[n];var s,i,a=D({},le),l=!1,f=!1,d=r.getCurrentInstance(),o=(d==null?void 0:d.proxy)||d;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 c=(o==null?void 0:o.$isServer)||!1;t.length>=1&&(s=t[0]),t.length>=2&&(i=t[1]),t.length>2&&(a=D(D({},a),t[2]));var u=c?a.serverTTL:a.ttl,m=typeof s=="function"?s:r.ref(s);typeof i>"u"&&(i=a.fetcher);var y=null;y||(y=r.reactive({data:void 0,error:void 0,isValidating:!0,key:null}));var p=function(E,g){return B(e,void 0,void 0,function(){var S,C,V,M,W,pe,J,ve=this;return F(this,function(Z){switch(Z.label){case 0:return S=y.data===void 0,C=m.value,C?(V=a.cache.get(C),M=V&&V.data,y.isValidating=!0,M&&(y.data=M.data,y.error=M.error),W=E||i,!W||!a.isDocumentVisible()&&!S||(g==null?void 0:g.forceRevalidate)!==void 0&&!(g!=null&&g.forceRevalidate)?(y.isValidating=!1,[2]):V&&(pe=!!(Date.now()-V.createdAt>=a.dedupingInterval||g!=null&&g.forceRevalidate),!pe)?(y.isValidating=!1,[2]):(J=function(){return B(ve,void 0,void 0,function(){var O,Ee,ee,Re;return F(this,function(K){switch(K.label){case 0:return O=j.get(C),O?[3,2]:(Ee=Array.isArray(C)?C:[C],ee=W.apply(void 0,Fe([],Be(Ee),!1)),j.set(C,ee,a.dedupingInterval),[4,ue(C,ee,a.cache,u)]);case 1:return K.sent(),[3,4];case 2:return[4,ue(C,O.data,a.cache,u)];case 3:K.sent(),K.label=4;case 4:return y.isValidating=!1,j.delete(C),y.error!==void 0&&(Re=!l&&a.shouldRetryOnError&&(g?g.shouldRetryOnError:!0),Re&&qe(p,g?g.errorRetryCount:1,a)),[2]}})})},M&&a.revalidateDebounce?(setTimeout(function(){return B(ve,void 0,void 0,function(){return F(this,function(O){switch(O.label){case 0:return l?[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]}})})},h=function(){return B(e,void 0,void 0,function(){return F(this,function(E){return[2,p(null,{shouldRetryOnError:!1})]})})},v=null;r.onMounted(function(){var E=function(){return B(e,void 0,void 0,function(){return F(this,function(g){switch(g.label){case 0:return!y.error&&a.isOnline()?[4,p()]:[3,2];case 1:return g.sent(),[3,3];case 2:v&&clearTimeout(v),g.label=3;case 3:return a.refreshInterval&&!l&&(v=setTimeout(E,a.refreshInterval)),[2]}})})};a.refreshInterval&&(v=setTimeout(E,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",h,!1),window.addEventListener("focus",h,!1))}),r.onUnmounted(function(){l=!0,v&&clearTimeout(v),a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",h,!1),window.removeEventListener("focus",h,!1));var E=q.get(m.value);E&&(E.data=E.data.filter(function(g){return g!==y}))});try{r.watch(m,function(E){r.isReadonly(m)||(m.value=E),y.key=E,y.isValidating=!!E,Me(m.value,y,u),!c&&!f&&m.value&&p(),f=!1},{immediate:!0})}catch{}var T=D(D({},r.toRefs(y)),{mutate:function(E,g){return p(E,D(D({},g),{forceRevalidate:!0}))}});return T}function ze(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function Ke(e,t,n){const{data:s,error:i,isValidating:a,mutate:l}=xe(e,t,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:r.computed(()=>s.value),response:s,error:i,isValidating:a,revalidate:l}}const N={useI18n:Se,useMetricCardBuilder:be,useMetricFetcher:De,useRequest:Ke},de=Symbol("METRICS_PROVIDER_KEY"),Pe=e=>{const{datasource:t,dimension:n,dimensionFilterValue:s,additionalFilter:i,queryReady:a,timeframe:l,tz:f,hasTrendAccess:d,refreshInterval:o,abortController:c,queryFn:u,averageLatencies:m}=e;if(s&&!n)throw new Error("Must provide a dimension if filtering by a value");const y=!!(n&&s),p=!!(n&&!s),h=r.computed(()=>{const S=[];return y&&S.push({dimension:n,type:"in",values:[s]}),i.value&&S.push(...A.stripUnknownFilters(t.value,i.value)),S}),v={datasource:t,metrics:r.ref(["request_count"]),dimensions:[...n&&!y?[n]:[],"status_code_grouped"],filter:h,queryReady:a,timeframe:l,tz:f,withTrend:r.computed(()=>d.value&&!p),refreshInterval:o,queryFn:u,abortController:c,refreshCounter:e.refreshCounter},T={datasource:t,metrics:r.computed(()=>[m.value?"response_latency_average":"response_latency_p99"]),...n&&!y?{dimensions:[n]}:{},filter:h,queryReady:a,timeframe:l,tz:f,withTrend:r.computed(()=>d.value&&!p),refreshInterval:o,queryFn:u,abortController:c,refreshCounter:e.refreshCounter},E=N.useMetricFetcher(v),g=N.useMetricFetcher(T);return{trafficData:E,latencyData:g}},Ue=r.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeframe:{default:A.TimeframeKeys.THIRTY_DAY},overrideTimeframe:{default:void 0},tz:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ne},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 t=e;if(t.dimension&&A.queryableExploreDimensions.findIndex(y=>y===t.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${t.dimension}`);const n=r.inject(ae);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=Te.useAnalyticsConfigStore(),a=r.computed(()=>!0),l=r.computed(()=>!i.loading&&t.queryReady),f=r.computed(()=>t.tz?t.tz:new Intl.DateTimeFormat().resolvedOptions().timeZone),d=r.computed(()=>t.datasource?t.datasource:"basic"),o=r.computed(()=>t.overrideTimeframe||A.TimePeriods.get(A.TimeframeKeys.SEVEN_DAY)),c=r.computed(()=>!t.percentileLatency),{trafficData:u,latencyData:m}=Pe({datasource:d,dimension:t.dimension,dimensionFilterValue:t.filterValue,additionalFilter:r.toRef(t,"additionalFilter"),queryReady:l,timeframe:o,tz:f,hasTrendAccess:a,refreshInterval:t.refreshInterval,queryFn:s,averageLatencies:c,abortController:t.abortController,refreshCounter:r.toRef(t,"refreshCounter")});return r.provide(de,{data:{traffic:u,latency:m},description:r.toRef(()=>t.description),containerTitle:r.toRef(()=>t.containerTitle),hasTrendAccess:a,longCardTitles:t.longCardTitles,averageLatencies:c}),(y,p)=>r.renderSlot(y.$slots,"default",{hasTrendAccess:a.value,timeframe:o.value})}});function $e(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var fe={exports:{}};(function(e){(function(){function t(o,c){if(c.separator===!1||o<1e3)return o.toString();var u=typeof c.separator=="string"?c.separator:",",m=[],y=Math.round(o).toString().split("");return y.reverse().forEach(function(p,h){h&&h%3===0&&m.push(u),m.push(p)}),m.reverse().join("")}function n(o,c,u){var m=o/c,y=u.round?"round":"floor";return u.decimal===!1?(o=Math[y](m),o.toString()):(u.precision?o=m:o=m<10?Math[y](m*10)/10:Math[y](m),o=o.toString(),typeof u.decimal=="string"&&(o=o.replace(".",u.decimal)),o)}var s=1e3,i=1e4,a=1e6,l=1e9,f=1e12;function d(o,c){var u;c=c||{};var m=o<0;m&&(o=Math.abs(o)),c.precision&&(o=parseFloat(o.toPrecision(c.precision)));var y=c.min10k?i:s;return o<y||c.precision&&c.precision>Math.log10(o)?u=t(n(o,1,c),c):o<a?u=n(o,s,c)+"k":o<l?u=n(o,a,c)+"m":o<f?u=t(n(o,l,c),c)+"b":u=t(n(o,f,c),c)+"t",m&&(u="-"+u),c.capital&&(u=u.toUpperCase()),c.prefix&&(u=c.prefix+u),c.suffix&&(u=u+c.suffix),u}d.addCommas=t,e.exports=d})()})(fe);var Xe=fe.exports;const Ge=$e(Xe);var I=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(I||{}),k=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(k||{});const Y=2,me=Y+2,je=(e,t,n=!1)=>{let s=!t||Number(e.toFixed(me))===0?0:Number(e.toFixed(me))>0?1:-1;return n&&(s*=-1),s},Ye=(e,t,n)=>t?`${Math.abs(e*100).toFixed(Y)}%`:n,He=(e,t)=>t===0?0:e/t-1,Qe=(e,t=!1)=>(t&&(e*=-1),e>0?_.TrendUpIcon:e<0?_.TrendDownIcon:_.IndeterminateSmallIcon),We="#ad000e",H="#6c7489",ye="#52596e",Je="#007d60",x="16px",Ze="20px",er={class:"metricscard"},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=r.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:I.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:_.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>k.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const t=new Map([[I.GENERIC_COUNT,_.VitalsIcon],[I.TRAFFIC,_.CloudUploadIcon],[I.ERROR_RATE,_.WarningOutlineIcon],[I.LATENCY,_.ResponseIcon]]),n=e,s=f=>{const d={red:`var(--kui-color-text-danger-strong, ${We})`,green:`var(--kui-color-text-success, ${Je})`,grey:`var(--kui-color-text-neutral-strong, ${ye})`};return f>0?d.green:f<0?d.red:d.grey},i=f=>f>0?"positive":f<0?"negative":"neutral",a=[k.Medium,k.Large].includes(n.cardSize),l=[k.Small].includes(n.cardSize);return(f,d)=>{const o=r.resolveComponent("KTooltip");return r.openBlock(),r.createElementBlock("div",er,[r.createElementVNode("div",{class:r.normalizeClass(["metricscard-title",e.cardSize])},[r.unref(l)?r.createCommentVNode("",!0):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(r.unref(t).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(x)},null,8,["color","size"])),(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.titleTag),null,{default:r.withCtx(()=>[r.createTextVNode(r.toDisplayString(e.title),1)]),_:1})),e.tooltip?(r.openBlock(),r.createBlock(o,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:r.withCtx(()=>[r.createVNode(r.unref(_.InfoIcon),{color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(x)},null,8,["color","size"])]),_:1},8,["text"])):r.createCommentVNode("",!0)],2),e.description&&r.unref(a)?(r.openBlock(),r.createElementBlock("div",rr,[r.createElementVNode("span",null,r.toDisplayString(e.description),1)])):r.createCommentVNode("",!0),r.createElementVNode("div",tr,[e.hasError?(r.openBlock(),r.createElementBlock("div",nr,[r.createVNode(r.unref(_.WarningIcon),{color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(Ze)},null,8,["color","size"]),r.createElementVNode("div",null," "+r.toDisplayString(e.errorMessage),1)])):(r.openBlock(),r.createElementBlock("div",{key:1,class:r.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},r.toDisplayString(e.metricValue),3)),r.unref(a)?(r.openBlock(),r.createElementBlock("div",ar,[r.createElementVNode("div",{class:r.normalizeClass(["metricscard-trend-change",i(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.trendIcon),{key:0,color:s(e.changePolarity),size:r.unref(x)},null,8,["color","size"])):(r.openBlock(),r.createBlock(r.unref(_.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${r.unref(ye)})`,size:r.unref(x)},null,8,["color","size"])),r.createElementVNode("div",ir,r.toDisplayString(e.metricChange),1)],2),e.trendRange?(r.openBlock(),r.createElementBlock("div",or,r.toDisplayString(e.trendRange),1)):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0)])])}}}),Q=(e,t)=>{const n=e.__vccOpts||e;for(const[s,i]of t)n[s]=i;return n},cr=Q(sr,[["__scopeId","data-v-1104dc0f"]]),lr={},ur={class:"loading-tabs"};function dr(e,t){const n=r.resolveComponent("KSkeletonBox");return r.openBlock(),r.createElementBlock("div",ur,[r.createVNode(n,{width:"100"}),r.createVNode(n,{width:"75"})])}const fr=Q(lr,[["render",dr],["__scopeId","data-v-50eab68c"]]),mr={key:0,class:"container-title"},yr={key:0,class:"container-description"},hr={key:1,class:"error-display"},gr={key:0,class:"error-display-message"},pr={key:2,class:"cards-wrapper"},vr=Q(r.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:()=>k.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const t=e,n=r.computed(()=>t.cards.every(i=>(i==null?void 0:i.hasError)===!0)),s=i=>{const a=He(i.currentValue,i.previousValue)||0,l=je(a,t.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):Ge(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):Ye(a,t.hasTrendAccess,t.fallbackDisplayText),changePolarity:l,trendIcon:Qe(l,i.increaseIsBad),cardSize:t.cardSize,hasContainerTitle:!!t.containerTitle}};return(i,a)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[t.containerTitle||t.containerDescription?(r.openBlock(),r.createElementBlock("div",mr,[r.createTextVNode(r.toDisplayString(t.containerTitle)+" ",1),t.containerDescription?(r.openBlock(),r.createElementBlock("div",yr,r.toDisplayString(t.containerDescription),1)):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0),n.value?(r.openBlock(),r.createElementBlock("div",hr,[r.createVNode(r.unref(_.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(r.openBlock(),r.createElementBlock("div",gr,r.toDisplayString(e.errorMessage),1)):r.createCommentVNode("",!0)])):(r.openBlock(),r.createElementBlock("div",pr,[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(e.cards,(l,f)=>(r.openBlock(),r.createElementBlock(r.Fragment,null,[e.loading?(r.openBlock(),r.createBlock(fr,{key:`skeleton-${f}`,class:r.normalizeClass(e.cardSize===r.unref(k).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])):(r.openBlock(),r.createBlock(cr,r.mergeProps({key:f,ref_for:!0},s(l),{"card-size":e.cardSize,"card-type":l.cardType,description:l.description,"error-message":e.errorMessage,"has-error":l.hasError,title:l.title,"title-tag":l.titleTag,tooltip:l.tooltip,"trend-range":l.trendRange}),null,16,["card-size","card-type","description","error-message","has-error","title","title-tag","tooltip","trend-range"]))],64))),256))]))],2))}}),[["__scopeId","data-v-eac0ca04"]]),Er=r.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:k.Large},cardToDisplay:{default:void 0}},setup(e){const t=e,n=r.inject(de);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:s,latency:i}=n.data,{i18n:a}=N.useI18n(),l=N.useMetricCardBuilder({cardType:I.TRAFFIC,title:r.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:s.mapped,hasError:s.hasError,lookupKey:t.lookupKey,sumGroupedValues:w,trendRange:s.trendRange}),f=h=>`${h.toFixed(Y)}%`,d=r.computed(()=>{const h=s.mapped.value,v=L(h,"current",t.lookupKey,P),T=L(h,"current",t.lookupKey,w),E=v/T*100||0,g=L(h,"previous",t.lookupKey,P),S=L(h,"previous",t.lookupKey,w),C=g/S*100||0;return{cardType:I.ERROR_RATE,hasError:s.hasError.value,currentValue:E,previousValue:C,formatValueFn:f,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:s.trendRange.value}}),o=h=>`${h}ms`,c=N.useMetricCardBuilder({cardType:I.LATENCY,title:r.computed(()=>{const{longCardTitles:h,averageLatencies:v}=n,T=v.value?"averageLatency":"p99Latency";return h?a.t(`metricCard.long.${T}`):a.t(`metricCard.short.${T}`)}),hasError:i.hasError,record:i.mapped,lookupKey:t.lookupKey,increaseIsBad:!0,formatValueFn:o,trendRange:i.trendRange}),u=r.computed(()=>t.cardToDisplay==="TRAFFIC"?[l.value]:t.cardToDisplay==="ERROR_RATE"?[d.value]:t.cardToDisplay==="LATENCY"?[c.value]:[l.value,d.value,c.value]),m=r.computed(()=>t.cardToDisplay==="TRAFFIC"||t.cardToDisplay==="ERROR_RATE"?s.isLoading.value:t.cardToDisplay==="LATENCY"?i.isLoading.value:s.isLoading.value||i.isLoading.value),y=r.computed(()=>({cards:u.value,containerTitle:n.containerTitle.value,containerDescription:n.description.value,loading:m.value,hasTrendAccess:n.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:n.containerTitle.value?k.Medium:t.cardSize,hideTitle:!0})),p=r.computed(()=>({loading:y.value.loading,trafficCard:l.value,errorRateCard:d.value,latencyCard:c.value,errorRateFormatted:f(d.value.currentValue),latencyFormatted:o(c.value.currentValue)}));return(h,v)=>r.renderSlot(h.$slots,"default",{cardValues:p.value},()=>[r.createVNode(vr,r.normalizeProps(r.guardReactiveProps(y.value)),null,16)])}}),z=e=>new Date(e),Rr=(e,t)=>{const n=e.body;e.reply({statusCode:200,body:ge(n,t)})},he=e=>e.reduce((t,n)=>(t[n]={name:n},t),{}),ge=(e,t)=>{var p,h;const n=A.TimePeriods.get(A.TimeframeKeys.ONE_DAY),s=e.granularity==="trend"?new A.DeltaQueryTime(n):new A.UnaryQueryTime(n),i=s.endMs(),a=s.startMs(),l=s.granularityMs(),f=e.granularity==="trend"?2:1;if((e.dimensions??[]).length>2)throw new Error(`Explore only supports 0-2 dimensions; got: ${JSON.stringify(e.dimensions)}`);const d=(e.dimensions??[]).find(v=>v!=="time"),o=(t==null?void 0:t.dimensionNames)??[],c=Math.max(o.length,1),u=e.metrics||[],m=[];for(let v=0;v<f;v++)for(let T=0;T<c;T++){const E=d?{[d]:o[T]}:{};(p=e.dimensions)!=null&&p.includes("status_code_grouped")?w.forEach(g=>{const S=u.reduce((C,V)=>((t==null?void 0:t.deterministic)??!0?C[V]=(f-v)*1e3+100*T+1:C[V]=Math.round(Math.random()*1e3),C),{...E,status_code_grouped:g});m.push({version:"v1",timestamp:v===0?z(a).toISOString():z(a+l).toISOString(),event:S})}):m.push({version:"v1",timestamp:v===0?z(a).toISOString():z(a+l).toISOString(),event:u.reduce((g,S)=>((t==null?void 0:t.deterministic)??!0?g[S]=(f-v)*1e3+100*T+1:g[S]=Math.round(Math.random()*1e3),g),{...E})})}const y={start_ms:a,end_ms:i,granularity_ms:l,display:d?{[d]:he(o),...(h=e.dimensions)!=null&&h.includes("status_code_grouped")?{status_code_grouped:he(w)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:m,meta:y}};R.ALL_STATUS_CODE_GROUPS=w,R.DEFAULT_REFRESH_INTERVAL=ne,R.INJECT_QUERY_PROVIDER=ae,R.MAX_ANALYTICS_REQUEST_RETRIES=te,R.MetricCardSize=k,R.MetricCardType=I,R.MetricsConsumer=Er,R.MetricsProvider=Ue,R.STATUS_CODES_FAILED=P,R.STATUS_CODES_SUCCESS=_e,R.mockExploreResponse=ge,R.mockExploreResponseFromCypress=Rr,Object.defineProperty(R,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(R,r){typeof exports=="object"&&typeof module<"u"?r(exports,require("vue"),require("@kong-ui-public/analytics-utilities"),require("@kong-ui-public/i18n"),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","@kong-ui-public/analytics-config-store","@kong/icons"],r):(R=typeof globalThis<"u"?globalThis:R||self,r(R["kong-ui-public-vitals-metric-provider"]={},R.Vue,R["kong-ui-public-analytics-utilities"],R["kong-ui-public-i18n"],R["kong-ui-public-analytics-config-store"],R.KongIcons))})(this,function(R,r,A,re,Te,_){"use strict";const Ce={general:{notAvailable:"N/A"},metricCard:{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:"vs previous {numDays, plural, =1 {day} other {# days}}","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 Se(){const e=re.createI18n("en-us",Ce);return{i18n:e,i18nT:re.i18nTComponent(e)}}const te=2,w=["1XX","2XX","3XX","4XX","5XX"],P=["4XX","5XX"],_e=["1XX","2XX","3XX"],ne=30*1e3,ae="analytics-query-provider";var ie=(e=>(e.VALIDATING="VALIDATING",e.VALIDATING_HAS_DATA="VALIDATING_HAS_DATA",e.PENDING="PENDING",e.SUCCESS="SUCCESS",e.SUCCESS_HAS_DATA="SUCCESS_HAS_DATA",e.ERROR="ERROR",e.STALE_IF_ERROR="STALE_IF_ERROR",e))(ie||{});const Ie=e=>{var t,n,s,i,a;return e?!!((t=Object.keys(e))!=null&&t.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 ke(e=r.ref({}),t,n,s=Ie){const i=r.ref("PENDING");return r.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&&t.value){i.value="STALE_IF_ERROR";return}if(e.value===void 0&&!t.value){i.value="PENDING";return}if(e.value&&!t.value&&a){i.value="SUCCESS_HAS_DATA";return}if(e.value&&!t.value){i.value="SUCCESS";return}e.value===void 0&&t&&(i.value="ERROR")}),{state:i,swrvState:ie}}const b=Symbol("default"),U="status_code_grouped",oe=(e,t,n,s,i)=>{e[t][n]||(e[t][n]={}),e[t][n][s]=i};function Ae(e,t){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(d=>d===U),l=i.find(d=>d!==U);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((d,o)=>{const c=o.event[n],u=l?o.event[l]:b,m=a?o.event[U]:b;return new Date(o.timestamp).getTime()===s&&t?oe(d,"previous",u,m,c):oe(d,"current",u,m,c),d},{previous:{},current:{}})}function De(e){e.queryReady===void 0&&(e.queryReady=r.computed(()=>!0));const{i18n:t}=N.useI18n(),n=r.computed(()=>{var u,m;return{metrics:e.metrics.value,dimensions:[...(u=e.dimensions)!=null&&u.length?[...e.dimensions]:[],...e.withTrend.value?["time"]:[]],granularity:e.withTrend.value?"trend":void 0,...(m=e.filter.value)!=null&&m.length?{filters:e.filter.value}:{},time_range:e.timeframe.value.v4Query(e.tz.value)}}),s=r.computed(()=>{var m,y,p,h;if(!((m=e.queryReady)!=null&&m.value))return null;const u=(y=e.filter)!=null&&y.value?JSON.stringify(e.filter.value):"";return`metric-fetcher-${e.timeframe.value.cacheKey()}-${(p=e.dimensions)==null?void 0:p.join("-")}-${(h=e.metrics.value)==null?void 0:h.join("-")}-${u}-${e.refreshCounter.value}`}),{response:i,error:a,isValidating:l}=N.useRequest(()=>s.value,()=>e.queryFn({datasource:e.datasource.value,query:n.value},e.abortController??new AbortController),{refreshInterval:e.refreshInterval,revalidateOnFocus:!1,errorRetryCount:te}),{state:f,swrvState:d}=ke(i,a,l),o=r.computed(()=>{var u,m,y,p,h,v,T;return!((m=(u=i.value)==null?void 0:u.data)!=null&&m.length)||!((p=(y=i.value)==null?void 0:y.meta)!=null&&p.display)||!((T=(v=(h=i.value)==null?void 0:h.meta)==null?void 0:v.metric_names)!=null&&T.length)?{current:{},previous:{}}:Ae(i.value,e.withTrend.value)}),c=r.computed(()=>{var u,m;if(e.timeframe.value.key==="custom"){if(!((m=(u=i.value)==null?void 0:u.meta)!=null&&m.start_ms))return"";const{start_ms:y,end_ms:p}=i.value.meta;let h=(p-y)/(1e3*60*60*24);return e.withTrend.value&&(h/=2),t.t("trendRange.custom",{numDays:Math.round(h)})}else return e.withTrend.value?t.t(`trendRange.${e.timeframe.value.key}`):""});return{isLoading:r.computed(()=>d.PENDING===f.value),hasError:r.computed(()=>d.ERROR===f.value),raw:i,mapped:o,trendRange:c}}const L=(e,t,n=b,s)=>(s??[b]).reduce((a,l)=>{const f=e[t][n];return f?a+(f[l]||0):a},0);function be(e){const{cardType:t,title:n,description:s,record:i,hasError:a,increaseIsBad:l,formatValueFn:f,trendRange:d}=e;return r.computed(()=>{let o=0,c=0;if(i!=null&&i.value)try{o=L(i.value,"current",e.lookupKey,e.sumGroupedValues),c=L(i.value,"previous",e.lookupKey,e.sumGroupedValues)}catch(u){console.error("Metric card data doesn't have the expected structure:",u)}return{cardType:t,hasError:a.value,currentValue:o,previousValue:c,title:n.value,description:s,increaseIsBad:!!l,formatValueFn:f,trendRange:d==null?void 0:d.value}})}var $=new WeakMap,se=0;function Ve(e){if(!e.length)return"";for(var t="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]):$.has(e[n])?s=$.get(e[n]):(s=se,$.set(e[n],se++)),t+="@"+s}return t}function Ne(e){if(typeof e=="function")try{e=e()}catch{e=""}return Array.isArray(e)?e=Ve(e):e=String(e||""),e}var X=function(){function e(t){t===void 0&&(t=0),this.items=new Map,this.ttl=t}return e.prototype.serializeKey=function(t){return Ne(t)},e.prototype.get=function(t){var n=this.serializeKey(t);return this.items.get(n)},e.prototype.set=function(t,n,s){var i=this.serializeKey(t),a=s||this.ttl,l=Date.now(),f={data:n,createdAt:l,expiresAt:a?l+a:1/0};this.dispatchExpire(a,f,i),this.items.set(i,f)},e.prototype.dispatchExpire=function(t,n,s){var i=this;t&&setTimeout(function(){var a=Date.now(),l=a>=n.expiresAt;l&&i.delete(s)},t)},e.prototype.delete=function(t){this.items.delete(t)},e}();function Oe(){return typeof navigator.onLine<"u"?navigator.onLine:!0}function we(){return typeof document<"u"&&typeof document.visibilityState<"u"?document.visibilityState!=="hidden":!0}var Le=function(e){return fetch(e).then(function(t){return t.json()})};const G={isOnline:Oe,isDocumentVisible:we,fetcher:Le};var D=function(){return D=Object.assign||function(e){for(var t,n=1,s=arguments.length;n<s;n++){t=arguments[n];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e},D.apply(this,arguments)},B=function(e,t,n,s){function i(a){return a instanceof n?a:new n(function(l){l(a)})}return new(n||(n=Promise))(function(a,l){function f(c){try{o(s.next(c))}catch(u){l(u)}}function d(c){try{o(s.throw(c))}catch(u){l(u)}}function o(c){c.done?a(c.value):i(c.value).then(f,d)}o((s=s.apply(e,t||[])).next())})},F=function(e,t){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},s,i,a,l;return l={next:f(0),throw:f(1),return:f(2)},typeof Symbol=="function"&&(l[Symbol.iterator]=function(){return this}),l;function f(o){return function(c){return d([o,c])}}function d(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=t.call(e,n)}catch(c){o=[6,c],i=0}finally{s=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}},Be=function(e,t){var n=typeof Symbol=="function"&&e[Symbol.iterator];if(!n)return e;var s=n.call(e),i,a=[],l;try{for(;(t===void 0||t-- >0)&&!(i=s.next()).done;)a.push(i.value)}catch(f){l={error:f}}finally{try{i&&!i.done&&(n=s.return)&&n.call(s)}finally{if(l)throw l.error}}return a},Fe=function(e,t,n){if(n||arguments.length===2)for(var s=0,i=t.length,a;s<i;s++)(a||!(s in t))&&(a||(a=Array.prototype.slice.call(t,0,s)),a[s]=t[s]);return e.concat(a||Array.prototype.slice.call(t))},ce=new X,q=new X,j=new X,le={cache:ce,refreshInterval:0,ttl:0,serverTTL:1e3,dedupingInterval:2e3,revalidateOnFocus:!0,revalidateDebounce:0,shouldRetryOnError:!0,errorRetryInterval:5e3,errorRetryCount:5,fetcher:G.fetcher,isOnline:G.isOnline,isDocumentVisible:G.isDocumentVisible};function Me(e,t,n){var s=q.get(e);if(s)s.data.push(t);else{var i=5e3;q.set(e,[t],n>0?n+i:n)}}function qe(e,t,n){if(n.isDocumentVisible()&&!(n.errorRetryCount!==void 0&&t>n.errorRetryCount)){var s=Math.min(t||0,n.errorRetryCount),i=s*n.errorRetryInterval;setTimeout(function(){e(null,{errorRetryCount:s+1,shouldRetryOnError:!0})},i)}}var ue=function(e,t,n,s){return n===void 0&&(n=ce),s===void 0&&(s=le.ttl),B(void 0,void 0,void 0,function(){var i,a,l,f,d,o,c;return F(this,function(u){switch(u.label){case 0:if(!ze(t))return[3,5];u.label=1;case 1:return u.trys.push([1,3,,4]),[4,t];case 2:return i=u.sent(),[3,4];case 3:return f=u.sent(),a=f,[3,4];case 4:return[3,6];case 5:i=t,u.label=6;case 6:if(l=!1,d={data:i,error:a,isValidating:l},typeof i<"u")try{n.set(e,d,s)}catch(m){console.error("swrv(mutate): failed to set cache",m)}return o=q.get(e),o&&o.data.length&&(c=o.data.filter(function(m){return m.key===e}),c.forEach(function(m,y){typeof d.data<"u"&&(m.data=d.data),m.error=d.error,m.isValidating=d.isValidating;var p=y===c.length-1;p||delete c[y]}),c=c.filter(Boolean)),[2,d]}})})};function xe(){for(var e=this,t=[],n=0;n<arguments.length;n++)t[n]=arguments[n];var s,i,a=D({},le),l=!1,f=!1,d=r.getCurrentInstance(),o=(d==null?void 0:d.proxy)||d;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 c=(o==null?void 0:o.$isServer)||!1;t.length>=1&&(s=t[0]),t.length>=2&&(i=t[1]),t.length>2&&(a=D(D({},a),t[2]));var u=c?a.serverTTL:a.ttl,m=typeof s=="function"?s:r.ref(s);typeof i>"u"&&(i=a.fetcher);var y=null;y||(y=r.reactive({data:void 0,error:void 0,isValidating:!0,key:null}));var p=function(E,g){return B(e,void 0,void 0,function(){var S,C,V,M,W,pe,J,ve=this;return F(this,function(Z){switch(Z.label){case 0:return S=y.data===void 0,C=m.value,C?(V=a.cache.get(C),M=V&&V.data,y.isValidating=!0,M&&(y.data=M.data,y.error=M.error),W=E||i,!W||!a.isDocumentVisible()&&!S||(g==null?void 0:g.forceRevalidate)!==void 0&&!(g!=null&&g.forceRevalidate)?(y.isValidating=!1,[2]):V&&(pe=!!(Date.now()-V.createdAt>=a.dedupingInterval||g!=null&&g.forceRevalidate),!pe)?(y.isValidating=!1,[2]):(J=function(){return B(ve,void 0,void 0,function(){var O,Ee,ee,Re;return F(this,function(K){switch(K.label){case 0:return O=j.get(C),O?[3,2]:(Ee=Array.isArray(C)?C:[C],ee=W.apply(void 0,Fe([],Be(Ee),!1)),j.set(C,ee,a.dedupingInterval),[4,ue(C,ee,a.cache,u)]);case 1:return K.sent(),[3,4];case 2:return[4,ue(C,O.data,a.cache,u)];case 3:K.sent(),K.label=4;case 4:return y.isValidating=!1,j.delete(C),y.error!==void 0&&(Re=!l&&a.shouldRetryOnError&&(g?g.shouldRetryOnError:!0),Re&&qe(p,g?g.errorRetryCount:1,a)),[2]}})})},M&&a.revalidateDebounce?(setTimeout(function(){return B(ve,void 0,void 0,function(){return F(this,function(O){switch(O.label){case 0:return l?[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]}})})},h=function(){return B(e,void 0,void 0,function(){return F(this,function(E){return[2,p(null,{shouldRetryOnError:!1})]})})},v=null;r.onMounted(function(){var E=function(){return B(e,void 0,void 0,function(){return F(this,function(g){switch(g.label){case 0:return!y.error&&a.isOnline()?[4,p()]:[3,2];case 1:return g.sent(),[3,3];case 2:v&&clearTimeout(v),g.label=3;case 3:return a.refreshInterval&&!l&&(v=setTimeout(E,a.refreshInterval)),[2]}})})};a.refreshInterval&&(v=setTimeout(E,a.refreshInterval)),a.revalidateOnFocus&&(document.addEventListener("visibilitychange",h,!1),window.addEventListener("focus",h,!1))}),r.onUnmounted(function(){l=!0,v&&clearTimeout(v),a.revalidateOnFocus&&(document.removeEventListener("visibilitychange",h,!1),window.removeEventListener("focus",h,!1));var E=q.get(m.value);E&&(E.data=E.data.filter(function(g){return g!==y}))});try{r.watch(m,function(E){r.isReadonly(m)||(m.value=E),y.key=E,y.isValidating=!!E,Me(m.value,y,u),!c&&!f&&m.value&&p(),f=!1},{immediate:!0})}catch{}var T=D(D({},r.toRefs(y)),{mutate:function(E,g){return p(E,D(D({},g),{forceRevalidate:!0}))}});return T}function ze(e){return e!==null&&typeof e=="object"&&typeof e.then=="function"}function Ke(e,t,n){const{data:s,error:i,isValidating:a,mutate:l}=xe(e,t,{revalidateDebounce:500,revalidateOnFocus:!1,dedupingInterval:100,...n});return{data:r.computed(()=>s.value),response:s,error:i,isValidating:a,revalidate:l}}const N={useI18n:Se,useMetricCardBuilder:be,useMetricFetcher:De,useRequest:Ke},de=Symbol("METRICS_PROVIDER_KEY"),Pe=e=>{const{datasource:t,dimension:n,dimensionFilterValue:s,additionalFilter:i,queryReady:a,timeframe:l,tz:f,hasTrendAccess:d,refreshInterval:o,abortController:c,queryFn:u,averageLatencies:m}=e;if(s&&!n)throw new Error("Must provide a dimension if filtering by a value");const y=!!(n&&s),p=!!(n&&!s),h=r.computed(()=>{const S=[];return y&&S.push({dimension:n,type:"in",values:[s]}),i.value&&S.push(...A.stripUnknownFilters(t.value,i.value)),S}),v={datasource:t,metrics:r.ref(["request_count"]),dimensions:[...n&&!y?[n]:[],"status_code_grouped"],filter:h,queryReady:a,timeframe:l,tz:f,withTrend:r.computed(()=>d.value&&!p),refreshInterval:o,queryFn:u,abortController:c,refreshCounter:e.refreshCounter},T={datasource:t,metrics:r.computed(()=>[m.value?"response_latency_average":"response_latency_p99"]),...n&&!y?{dimensions:[n]}:{},filter:h,queryReady:a,timeframe:l,tz:f,withTrend:r.computed(()=>d.value&&!p),refreshInterval:o,queryFn:u,abortController:c,refreshCounter:e.refreshCounter},E=N.useMetricFetcher(v),g=N.useMetricFetcher(T);return{trafficData:E,latencyData:g}},Ue=r.defineComponent({__name:"MetricsProvider",props:{datasource:{default:void 0},maxTimeframe:{default:A.TimeframeKeys.THIRTY_DAY},overrideTimeframe:{default:void 0},tz:{default:void 0},dimension:{default:void 0},filterValue:{default:void 0},additionalFilter:{default:void 0},queryReady:{type:Boolean,default:!0},refreshInterval:{default:ne},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 t=e;if(t.dimension&&A.queryableExploreDimensions.findIndex(y=>y===t.dimension)===-1)throw new Error(`Attempted to use MetricsProvider with an invalid dimension: ${t.dimension}`);const n=r.inject(ae);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=Te.useAnalyticsConfigStore(),a=r.computed(()=>!0),l=r.computed(()=>!i.loading&&t.queryReady),f=r.computed(()=>t.tz?t.tz:new Intl.DateTimeFormat().resolvedOptions().timeZone),d=r.computed(()=>t.datasource?t.datasource:"basic"),o=r.computed(()=>t.overrideTimeframe||A.TimePeriods.get(A.TimeframeKeys.SEVEN_DAY)),c=r.computed(()=>!t.percentileLatency),{trafficData:u,latencyData:m}=Pe({datasource:d,dimension:t.dimension,dimensionFilterValue:t.filterValue,additionalFilter:r.toRef(t,"additionalFilter"),queryReady:l,timeframe:o,tz:f,hasTrendAccess:a,refreshInterval:t.refreshInterval,queryFn:s,averageLatencies:c,abortController:t.abortController,refreshCounter:r.toRef(t,"refreshCounter")});return r.provide(de,{data:{traffic:u,latency:m},description:r.toRef(()=>t.description),containerTitle:r.toRef(()=>t.containerTitle),hasTrendAccess:a,longCardTitles:t.longCardTitles,averageLatencies:c}),(y,p)=>r.renderSlot(y.$slots,"default",{hasTrendAccess:a.value,timeframe:o.value})}});function $e(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var fe={exports:{}};(function(e){(function(){function t(o,c){if(c.separator===!1||o<1e3)return o.toString();var u=typeof c.separator=="string"?c.separator:",",m=[],y=Math.round(o).toString().split("");return y.reverse().forEach(function(p,h){h&&h%3===0&&m.push(u),m.push(p)}),m.reverse().join("")}function n(o,c,u){var m=o/c,y=u.round?"round":"floor";return u.decimal===!1?(o=Math[y](m),o.toString()):(u.precision?o=m:o=m<10?Math[y](m*10)/10:Math[y](m),o=o.toString(),typeof u.decimal=="string"&&(o=o.replace(".",u.decimal)),o)}var s=1e3,i=1e4,a=1e6,l=1e9,f=1e12;function d(o,c){var u;c=c||{};var m=o<0;m&&(o=Math.abs(o)),c.precision&&(o=parseFloat(o.toPrecision(c.precision)));var y=c.min10k?i:s;return o<y||c.precision&&c.precision>Math.log10(o)?u=t(n(o,1,c),c):o<a?u=n(o,s,c)+"k":o<l?u=n(o,a,c)+"m":o<f?u=t(n(o,l,c),c)+"b":u=t(n(o,f,c),c)+"t",m&&(u="-"+u),c.capital&&(u=u.toUpperCase()),c.prefix&&(u=c.prefix+u),c.suffix&&(u=u+c.suffix),u}d.addCommas=t,e.exports=d})()})(fe);var Xe=fe.exports;const Ge=$e(Xe);var I=(e=>(e.GENERIC_COUNT="GenericCount",e.TRAFFIC="Traffic",e.ERROR_RATE="ErrorRate",e.LATENCY="Latency",e))(I||{}),k=(e=>(e.Small="sm",e.Medium="md",e.Large="lg",e.ExtraLarge="xl",e))(k||{});const Y=2,me=Y+2,je=(e,t,n=!1)=>{let s=!t||Number(e.toFixed(me))===0?0:Number(e.toFixed(me))>0?1:-1;return n&&(s*=-1),s},Ye=(e,t,n)=>t?`${Math.abs(e*100).toFixed(Y)}%`:n,He=(e,t)=>t===0?0:e/t-1,Qe=(e,t=!1)=>(t&&(e*=-1),e>0?_.TrendUpIcon:e<0?_.TrendDownIcon:_.IndeterminateSmallIcon),We="#ad000e",H="#6c7489",ye="#52596e",Je="#007d60",x="16px",Ze="20px",er={class:"metricscard"},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=r.defineComponent({__name:"MetricsCard",props:{cardType:{type:String,required:!0,default:I.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:_.IndeterminateSmallIcon},trendRange:{type:String,default:""},hasError:{type:Boolean,default:!1},errorMessage:{type:String,default:"Vitals data error"},cardSize:{type:String,required:!1,default:()=>k.Large},hasContainerTitle:{type:Boolean,required:!1,default:!1},titleTag:{type:String,default:"span"}},setup(e){const t=new Map([[I.GENERIC_COUNT,_.VitalsIcon],[I.TRAFFIC,_.CloudUploadIcon],[I.ERROR_RATE,_.WarningOutlineIcon],[I.LATENCY,_.ResponseIcon]]),n=e,s=f=>{const d={red:`var(--kui-color-text-danger-strong, ${We})`,green:`var(--kui-color-text-success, ${Je})`,grey:`var(--kui-color-text-neutral-strong, ${ye})`};return f>0?d.green:f<0?d.red:d.grey},i=f=>f>0?"positive":f<0?"negative":"neutral",a=[k.Medium,k.Large].includes(n.cardSize),l=[k.Small].includes(n.cardSize);return(f,d)=>{const o=r.resolveComponent("KTooltip");return r.openBlock(),r.createElementBlock("div",er,[r.createElementVNode("div",{class:r.normalizeClass(["metricscard-title",e.cardSize])},[r.unref(l)?r.createCommentVNode("",!0):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(r.unref(t).get(e.cardType)),{key:0,class:"metricscard-icon",color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(x)},null,8,["color","size"])),(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.titleTag),null,{default:r.withCtx(()=>[r.createTextVNode(r.toDisplayString(e.title),1)]),_:1})),e.tooltip?(r.openBlock(),r.createBlock(o,{key:1,class:"metricscard-tooltip",placement:"right",text:e.tooltip},{default:r.withCtx(()=>[r.createVNode(r.unref(_.InfoIcon),{color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(x)},null,8,["color","size"])]),_:1},8,["text"])):r.createCommentVNode("",!0)],2),e.description&&r.unref(a)?(r.openBlock(),r.createElementBlock("div",rr,[r.createElementVNode("span",null,r.toDisplayString(e.description),1)])):r.createCommentVNode("",!0),r.createElementVNode("div",tr,[e.hasError?(r.openBlock(),r.createElementBlock("div",nr,[r.createVNode(r.unref(_.WarningIcon),{color:`var(--kui-color-text-neutral, ${r.unref(H)})`,size:r.unref(Ze)},null,8,["color","size"]),r.createElementVNode("div",null," "+r.toDisplayString(e.errorMessage),1)])):(r.openBlock(),r.createElementBlock("div",{key:1,class:r.normalizeClass(["metricscard-value",e.cardSize]),"data-testid":"metric-value"},r.toDisplayString(e.metricValue),3)),r.unref(a)?(r.openBlock(),r.createElementBlock("div",ar,[r.createElementVNode("div",{class:r.normalizeClass(["metricscard-trend-change",i(e.changePolarity)]),"data-testid":"metric-trend-parent"},[e.changePolarity!==0?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.trendIcon),{key:0,color:s(e.changePolarity),size:r.unref(x)},null,8,["color","size"])):(r.openBlock(),r.createBlock(r.unref(_.EqualIcon),{key:1,color:`var(--kui-color-text-neutral-strong, ${r.unref(ye)})`,size:r.unref(x)},null,8,["color","size"])),r.createElementVNode("div",ir,r.toDisplayString(e.metricChange),1)],2),e.trendRange?(r.openBlock(),r.createElementBlock("div",or,r.toDisplayString(e.trendRange),1)):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0)])])}}}),Q=(e,t)=>{const n=e.__vccOpts||e;for(const[s,i]of t)n[s]=i;return n},cr=Q(sr,[["__scopeId","data-v-9765f7cc"]]),lr={},ur={class:"loading-tabs"};function dr(e,t){const n=r.resolveComponent("KSkeletonBox");return r.openBlock(),r.createElementBlock("div",ur,[r.createVNode(n,{width:"100"}),r.createVNode(n,{width:"75"})])}const fr=Q(lr,[["render",dr],["__scopeId","data-v-50eab68c"]]),mr={key:0,class:"container-title"},yr={key:0,class:"container-description"},hr={key:1,class:"error-display"},gr={key:0,class:"error-display-message"},pr={key:2,class:"cards-wrapper"},vr=Q(r.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:()=>k.Large},containerTitle:{type:String,required:!1,default:""},containerDescription:{type:String,required:!1,default:""}},setup(e){const t=e,n=r.computed(()=>t.cards.every(i=>(i==null?void 0:i.hasError)===!0)),s=i=>{const a=He(i.currentValue,i.previousValue)||0,l=je(a,t.hasTrendAccess,i.increaseIsBad);return{metricValue:i.formatValueFn?i.formatValueFn(i.currentValue):Ge(i.currentValue,{capital:!0,round:!0})||"0",metricChange:i.formatChangeFn?i.formatChangeFn(a):Ye(a,t.hasTrendAccess,t.fallbackDisplayText),changePolarity:l,trendIcon:Qe(l,i.increaseIsBad),cardSize:t.cardSize,hasContainerTitle:!!t.containerTitle}};return(i,a)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["kong-ui-public-metric-card-container",e.cardSize])},[t.containerTitle||t.containerDescription?(r.openBlock(),r.createElementBlock("div",mr,[r.createTextVNode(r.toDisplayString(t.containerTitle)+" ",1),t.containerDescription?(r.openBlock(),r.createElementBlock("div",yr,r.toDisplayString(t.containerDescription),1)):r.createCommentVNode("",!0)])):r.createCommentVNode("",!0),n.value?(r.openBlock(),r.createElementBlock("div",hr,[r.createVNode(r.unref(_.WarningIcon),{class:"error-display-icon"}),e.errorMessage?(r.openBlock(),r.createElementBlock("div",gr,r.toDisplayString(e.errorMessage),1)):r.createCommentVNode("",!0)])):(r.openBlock(),r.createElementBlock("div",pr,[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(e.cards,(l,f)=>(r.openBlock(),r.createElementBlock(r.Fragment,null,[e.loading?(r.openBlock(),r.createBlock(fr,{key:`skeleton-${f}`,class:r.normalizeClass(e.cardSize===r.unref(k).Small?"loading-tabs-small":"loading-tabs-large")},null,8,["class"])):(r.openBlock(),r.createBlock(cr,r.mergeProps({key:f,ref_for:!0},s(l),{"card-size":e.cardSize,"card-type":l.cardType,description:l.description,"error-message":e.errorMessage,"has-error":l.hasError,title:l.title,"title-tag":l.titleTag,tooltip:l.tooltip,"trend-range":l.trendRange}),null,16,["card-size","card-type","description","error-message","has-error","title","title-tag","tooltip","trend-range"]))],64))),256))]))],2))}}),[["__scopeId","data-v-eac0ca04"]]),Er=r.defineComponent({__name:"MetricsConsumer",props:{lookupKey:{default:void 0},cardSize:{default:k.Large},cardToDisplay:{default:void 0}},setup(e){const t=e,n=r.inject(de);if(!n)throw new Error("MetricsConsumer must be nested inside a MetricsProvider instance.");const{traffic:s,latency:i}=n.data,{i18n:a}=N.useI18n(),l=N.useMetricCardBuilder({cardType:I.TRAFFIC,title:r.computed(()=>n.longCardTitles?a.t("metricCard.long.traffic"):a.t("metricCard.short.traffic")),record:s.mapped,hasError:s.hasError,lookupKey:t.lookupKey,sumGroupedValues:w,trendRange:s.trendRange}),f=h=>`${h.toFixed(Y)}%`,d=r.computed(()=>{const h=s.mapped.value,v=L(h,"current",t.lookupKey,P),T=L(h,"current",t.lookupKey,w),E=v/T*100||0,g=L(h,"previous",t.lookupKey,P),S=L(h,"previous",t.lookupKey,w),C=g/S*100||0;return{cardType:I.ERROR_RATE,hasError:s.hasError.value,currentValue:E,previousValue:C,formatValueFn:f,title:n.longCardTitles?a.t("metricCard.long.errorRate"):a.t("metricCard.short.errorRate"),increaseIsBad:!0,trendRange:s.trendRange.value}}),o=h=>`${h}ms`,c=N.useMetricCardBuilder({cardType:I.LATENCY,title:r.computed(()=>{const{longCardTitles:h,averageLatencies:v}=n,T=v.value?"averageLatency":"p99Latency";return h?a.t(`metricCard.long.${T}`):a.t(`metricCard.short.${T}`)}),hasError:i.hasError,record:i.mapped,lookupKey:t.lookupKey,increaseIsBad:!0,formatValueFn:o,trendRange:i.trendRange}),u=r.computed(()=>t.cardToDisplay==="TRAFFIC"?[l.value]:t.cardToDisplay==="ERROR_RATE"?[d.value]:t.cardToDisplay==="LATENCY"?[c.value]:[l.value,d.value,c.value]),m=r.computed(()=>t.cardToDisplay==="TRAFFIC"||t.cardToDisplay==="ERROR_RATE"?s.isLoading.value:t.cardToDisplay==="LATENCY"?i.isLoading.value:s.isLoading.value||i.isLoading.value),y=r.computed(()=>({cards:u.value,containerTitle:n.containerTitle.value,containerDescription:n.description.value,loading:m.value,hasTrendAccess:n.hasTrendAccess.value,fallbackDisplayText:a.t("general.notAvailable"),cardSize:n.containerTitle.value?k.Medium:t.cardSize,hideTitle:!0})),p=r.computed(()=>({loading:y.value.loading,trafficCard:l.value,errorRateCard:d.value,latencyCard:c.value,errorRateFormatted:f(d.value.currentValue),latencyFormatted:o(c.value.currentValue)}));return(h,v)=>r.renderSlot(h.$slots,"default",{cardValues:p.value},()=>[r.createVNode(vr,r.normalizeProps(r.guardReactiveProps(y.value)),null,16)])}}),z=e=>new Date(e),Rr=(e,t)=>{const n=e.body;e.reply({statusCode:200,body:ge(n,t)})},he=e=>e.reduce((t,n)=>(t[n]={name:n},t),{}),ge=(e,t)=>{var p,h;const n=A.TimePeriods.get(A.TimeframeKeys.ONE_DAY),s=e.granularity==="trend"?new A.DeltaQueryTime(n):new A.UnaryQueryTime(n),i=s.endMs(),a=s.startMs(),l=s.granularityMs(),f=e.granularity==="trend"?2:1;if((e.dimensions??[]).length>2)throw new Error(`Explore only supports 0-2 dimensions; got: ${JSON.stringify(e.dimensions)}`);const d=(e.dimensions??[]).find(v=>v!=="time"),o=(t==null?void 0:t.dimensionNames)??[],c=Math.max(o.length,1),u=e.metrics||[],m=[];for(let v=0;v<f;v++)for(let T=0;T<c;T++){const E=d?{[d]:o[T]}:{};(p=e.dimensions)!=null&&p.includes("status_code_grouped")?w.forEach(g=>{const S=u.reduce((C,V)=>((t==null?void 0:t.deterministic)??!0?C[V]=(f-v)*1e3+100*T+1:C[V]=Math.round(Math.random()*1e3),C),{...E,status_code_grouped:g});m.push({version:"v1",timestamp:v===0?z(a).toISOString():z(a+l).toISOString(),event:S})}):m.push({version:"v1",timestamp:v===0?z(a).toISOString():z(a+l).toISOString(),event:u.reduce((g,S)=>((t==null?void 0:t.deterministic)??!0?g[S]=(f-v)*1e3+100*T+1:g[S]=Math.round(Math.random()*1e3),g),{...E})})}const y={start_ms:a,end_ms:i,granularity_ms:l,display:d?{[d]:he(o),...(h=e.dimensions)!=null&&h.includes("status_code_grouped")?{status_code_grouped:he(w)}:{}}:{},metric_names:e.metrics,query_id:"test"};return{data:m,meta:y}};R.ALL_STATUS_CODE_GROUPS=w,R.DEFAULT_REFRESH_INTERVAL=ne,R.INJECT_QUERY_PROVIDER=ae,R.MAX_ANALYTICS_REQUEST_RETRIES=te,R.MetricCardSize=k,R.MetricCardType=I,R.MetricsConsumer=Er,R.MetricsProvider=Ue,R.STATUS_CODES_FAILED=P,R.STATUS_CODES_SUCCESS=_e,R.mockExploreResponse=ge,R.mockExploreResponseFromCypress=Rr,Object.defineProperty(R,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": "8.6.
|
|
3
|
+
"version": "8.6.14",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/vitals-metric-provider.umd.js",
|
|
6
6
|
"module": "./dist/vitals-metric-provider.es.js",
|
|
@@ -40,17 +40,17 @@
|
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@kong/kongponents": "^9.14.16",
|
|
43
|
+
"@kong-ui-public/i18n": "^2.2.10",
|
|
43
44
|
"@kong-ui-public/analytics-config-store": "^0.8.31",
|
|
44
|
-
"@kong-ui-public/analytics-utilities": "^5.12.0"
|
|
45
|
-
"@kong-ui-public/i18n": "^2.2.10"
|
|
45
|
+
"@kong-ui-public/analytics-utilities": "^5.12.0"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"@kong/design-tokens": "1.17.2",
|
|
49
49
|
"@kong/kongponents": "9.14.16",
|
|
50
50
|
"pinia": ">= 2.1.7 < 3",
|
|
51
|
-
"@kong-ui-public/analytics-config-store": "^0.8.31",
|
|
52
51
|
"@kong-ui-public/analytics-utilities": "^5.12.0",
|
|
53
|
-
"@kong-ui-public/i18n": "^2.2.10"
|
|
52
|
+
"@kong-ui-public/i18n": "^2.2.10",
|
|
53
|
+
"@kong-ui-public/analytics-config-store": "^0.8.31"
|
|
54
54
|
},
|
|
55
55
|
"scripts": {
|
|
56
56
|
"dev": "cross-env USE_SANDBOX=true vite",
|