@unblind/react 0.1.0-alpha.8 → 0.1.0-beta.1

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/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
- import{QueryClient as re,QueryClientProvider as Ne,useQueryClient as Ie}from"@tanstack/react-query";import{createContext as De,useCallback as Oe,useContext as Ve,useMemo as ne}from"react";import{jsx as ie}from"react/jsx-runtime";var se=De(void 0);function ae({children:e,queryClient:t,queryClientConfig:o,apiBaseUrl:n="/api/unblind",fetchImpl:r}){let l=ne(()=>{if(t)return t;let i={refetchOnWindowFocus:!1,refetchOnReconnect:!1,refetchOnMount:!1},u={defaultOptions:{queries:i}};return o?new re({...o,defaultOptions:{...o.defaultOptions,queries:{...i,...o.defaultOptions?.queries}}}):new re(u)},[t,o]),s=ne(()=>({apiBaseUrl:n,fetchImpl:r}),[n,r]);return ie(Ne,{client:l,children:ie(se.Provider,{value:s,children:e})})}function M(){let e=Ve(se);if(!e)throw new Error("useUnblindConfig must be used within an UnblindClientProvider. Please wrap your app or component tree with <UnblindClientProvider>.");return e}function le(){let e=Ie();return Oe(async()=>{await e.refetchQueries({queryKey:["unblind","timeseries"]})},[e])}import{createContext as Fe,useContext as ce,useMemo as ue}from"react";import{jsx as L,jsxs as ze}from"react/jsx-runtime";function $(){return L("div",{className:"ub-default",children:ze("div",{className:"ub-empty-content",children:[L("div",{className:"ub-empty-icon-wrapper",children:L("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:"ub-icon",children:L("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"})})}),L("p",{className:"ub-empty-text","data-text":"No data available for this time range"})]})})}function W(){return L("div",{className:"ub-error"})}function X(){return L("div",{className:"ub-default","data-text":"Loading"})}import{jsx as je}from"react/jsx-runtime";var Y=Fe(void 0);function J({children:e,timeRange:t,startTime:o,endTime:n,interval:r,attributes:l,groupBy:s,operator:i,appearance:u}){let a=ce(Y),m=u?.components?.Loading,d=u?.components?.Error,p=u?.components?.Tooltip,c=ue(()=>{if(!(!m&&!d&&!p))return{components:{...m&&{Loading:m},...d&&{Error:d},...p&&{Tooltip:p}}}},[m,d,p]),f=ue(()=>({timeRange:t??a?.timeRange,startTime:o??a?.startTime,endTime:n??a?.endTime,interval:r??a?.interval,attributes:l??a?.attributes,groupBy:s??a?.groupBy,operator:i??a?.operator,appearance:c??a?.appearance}),[t,o,n,r,l,s,i,c,a]);return je(Y.Provider,{value:f,children:e})}var Be=["#7c3aed","#eab308","#2563eb","#dc2626","#16a34a","#f97316","#0891b2","#9333ea","#ca8a04","#4f46e5","#0d9488","#be185d"],qe="6h";function V(){let e=ce(Y);return{timeRange:e?.timeRange||qe,startTime:e?.startTime,endTime:e?.endTime,interval:e?.interval,attributes:e?.attributes,groupBy:e?.groupBy,operator:e?.operator,appearance:{components:{Loading:e?.appearance?.components?.Loading??X,Error:e?.appearance?.components?.Error??W,Empty:e?.appearance?.components?.Empty??$,Tooltip:e?.appearance?.components?.Tooltip},colors:e?.appearance?.colors||Be,tooltip:e?.appearance?.tooltip}}}import{jsx as pe}from"react/jsx-runtime";function Ge({children:e,queryClient:t,apiBaseUrl:o,fetchImpl:n,timeRange:r,startTime:l,endTime:s,interval:i,attributes:u,groupBy:a,operator:m,appearance:d}){return pe(ae,{queryClient:t,apiBaseUrl:o,fetchImpl:n,children:pe(J,{timeRange:r,startTime:l,endTime:s,interval:i,attributes:u,groupBy:a,operator:m,appearance:d,children:e})})}import{useQuery as He}from"@tanstack/react-query";function Ke(){let{apiBaseUrl:e,fetchImpl:t=fetch}=M(),o=He({queryKey:["unblind","metrics"],queryFn:async()=>{let n=await t(`${e}/metrics`,{headers:{"Content-Type":"application/json"}});if(!n.ok)throw new Error("Error loading metrics metadata");if(n.status===200){let{data:r}=await n.json();return r}else throw new Error("Unexpected status code")}});return{metrics:o.data,isLoading:o.isLoading,hasError:o.isError,refetch:o.refetch}}import{useQuery as $e}from"@tanstack/react-query";import{useMemo as G}from"react";import _e from"ms";function Qe(e){let t=Math.floor(Date.now()/1e3);return[t-Math.floor(_e(e)/1e3),t]}function z(e,t,o){let n,r;if(typeof t=="number"&&typeof o=="number")n=t,r=o;else if(e){let[l,s]=Qe(e);n=l,r=s}else throw new Error("Either timeRange or both startTime and endTime must be provided");return[n,r]}function Z({queries:e,timeRange:t,startTime:o,endTime:n,interval:r}){let{apiBaseUrl:l,fetchImpl:s=fetch}=M(),i=G(()=>e.map(g=>g.metrics.join(",")).join(","),[e]),u=G(()=>e.map(g=>{let w=g.attributes;if(!w)return"";let S=Object.keys(w);return S.length===0?"":S.map(v=>v+":"+w[v]?.join(",")).join(",")}).join(","),[e]),a=G(()=>e.map(g=>g.operator),[e]),m=G(()=>e.map(g=>g.groupBy).join(", "),[e]),p=$e({queryKey:["unblind","timeseries",i,u,o,n,t,r,a,m],queryFn:async()=>{if(!i)throw new Error("Missing required parameters");if(i.length===0)throw new Error("No series provided");let[g,w]=z(t,o,n),S={queries:e,startTime:g,endTime:w,interval:r},v=await s(`${l}/tenants/timeseries`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(S)});if(!v.ok)throw new Error("Error fetching metric");let{series:A,times:y,metadata:x}=await v.json();if(!A)throw console.error("Series not found"),new Error("Series not found");return{series:A,times:y,metadata:x}},enabled:!!i&&(typeof o=="number"&&typeof n=="number"||!!t)}),{metadata:c,series:f,times:h}=G(()=>p.data?{series:p.data.series,times:p.data.times,metadata:p.data.metadata}:{series:[],times:[],metadata:{}},[p]),b=p.isLoading,T=p.isFetching,C=p.isError;return{data:{series:f,times:h,metadata:c},isLoading:b,isFetching:T,hasError:C,refetch:p.refetch}}import{useQuery as We}from"@tanstack/react-query";import{useMemo as Xe}from"react";function Ye({timeRange:e,startTime:t,endTime:o}){let{apiBaseUrl:n,fetchImpl:r=fetch}=M(),s=We({queryKey:["unblind","usage",e,t,o],queryFn:async()=>{let[m,d]=z(e,t,o),p=`${n}/tenants/usage`,c=await r(p,{headers:{"Content-Type":"application/json"},body:JSON.stringify({startTime:m,endTime:d})});if(!c.ok)throw new Error("Error fetching usage");let{data:f}=await c.json();if(!f)throw new Error("usage not found");return f},enabled:typeof t=="number"&&typeof o=="number"||!!e}),i=Xe(()=>s.data?s.data||[]:[],[s]),u=s.isLoading||s.isRefetching,a=s.isError;return{usage:i,isLoading:u,hasError:a,refetch:s.refetch}}import{useInfiniteQuery as Je}from"@tanstack/react-query";import{useMemo as Ze}from"react";function et({timeRange:e,filters:t,startTime:o,endTime:n}){let{apiBaseUrl:r,fetchImpl:l=fetch}=M(),s=typeof o=="number"&&typeof n=="number"||!!e,i=Je({queryKey:["unblind","logs",e,t.map(a=>a.name+":"+a.value).sort().join(",")],queryFn:async({pageParam:a})=>{let m=t.reduce((v,A)=>(v[A.name]||(v[A.name]=[]),v[A.name].push(A.value),v),{}),{body:d=[],severity:p=[],"service.name":c=[],"trace.id":f=[],"span.id":h=[],...b}=m,[T,C]=z(e,o,n),g=await l(`${r}/tenants/logs`,{method:"POST",body:JSON.stringify({filter:{attributes:b,body:d,severity:p,traceId:f,spanId:h,service:c},startTime:T,endTime:C,pagination:{page:a}}),headers:{"Content-Type":"application/json"}});if(!g.ok)throw new Error("Error fetching logs");let{data:w,next_page:S}=await g.json();if(!w)throw new Error("logs not found");return{data:w,next_page:S}},enabled:s,initialPageParam:void 0,getNextPageParam:a=>a.next_page});return{logs:Ze(()=>i.data?i.data.pages.flatMap(a=>a.data||[]):[],[i.data]),isLoading:i.isLoading,hasError:i.isError,hasNextPage:i.hasNextPage??!1,fetchNextPage:i.fetchNextPage,isFetchingNextPage:i.isFetchingNextPage,refetch:i.refetch}}import{useEffect as tt,useState as ot}from"react";function ee(){let[e,t]=ot(!1);return tt(()=>{let o=()=>t(document.documentElement.classList.contains("dark"));return o(),window.addEventListener("storage",o),window.addEventListener("theme-change",o),()=>{window.removeEventListener("storage",o),window.removeEventListener("theme-change",o)}},[]),e}import{useEffect as Nt,useRef as It}from"react";import Dt from"uplot";import Q from"uplot";import{getValueFormat as Ut}from"@grafana/data";import{dateTimeFormat as rt,dateTimeFormatTimeAgo as nt,systemDateFormats as K}from"@grafana/data";var R={millisecond:1,second:1e3,minute:6e4,hour:36e5,day:864e5,month:24192e5,year:31536e6},F={second:[1,2,5,10,15,30],minute:[1,2,5,10,15,30],hour:[1,2,3,4,6,8,12],day:[1,2,3,7,14],month:[1,2,3,6],year:[1,2,5,10,20,50,100]};function it(e,t,o,n){if(t>7*R.day){let r=K.interval.year,l=Math.round(R.year/R.day)*R.day;return Math.round(t/R.day)*R.day===l?r=K.interval.year:t<=R.year?r=K.interval.month:r=K.interval.day,e.map(i=>rt(i,{format:r,timeZone:n}))}return e.map(r=>{let l=new Date(r),s=t<R.minute,i=t<R.second,u=l.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1,timeZone:n});return(u==="00:00"||u==="24:00")&&!s&&!i?l.toLocaleDateString(void 0,{day:"2-digit",month:"short",timeZone:n}):l.toLocaleTimeString(void 0,{hour:"2-digit",minute:"2-digit",second:s?"2-digit":void 0,fractionalSecondDigits:i?3:void 0,hour12:!1,timeZone:n})})}function fe(e){let t=[{size:R.second/1e3,increments:F.second},{size:R.minute/1e3,increments:F.minute},{size:R.hour/1e3,increments:F.hour},{size:R.day/1e3,increments:F.day},{size:R.month/1e3,increments:F.month},{size:R.year/1e3,increments:F.year}];for(let r of t)for(let l of r.increments){let s=r.size*l;if(s>=e)return{increment:s*1e3,multiplier:l}}let o=t[t.length-1],n=o.increments[o.increments.length-1];return{increment:o.size*n*1e3,multiplier:n}}function me(e,t,o){return[t,o]}function st(e,t,o,n){let r=o-t,l=e.width,s=Math.floor(l/100),i=r/s,{increment:u,multiplier:a}=fe(i),m=u/1e3,d=[];if(r<12*3600){let c=Math.ceil(t/m)*m;for(;c<=o;c+=m)d.push(c);return d}if(r<3*86400){if(u>=6*3600*1e3){let f=u/1e3/3600,h=new Date(t*1e3);if(n==="UTC"){let T=h.getUTCHours(),C=Math.floor(T/f)*f;h.setUTCHours(C,0,0,0)}else{let T=h.getHours(),C=Math.floor(T/f)*f;h.setHours(C,0,0,0)}let b=h.getTime()/1e3;for(b<t&&(b+=m);b<=o;)d.push(b),b+=m;return d}let c=Math.ceil(t/m)*m;for(;c<=o;c+=m)d.push(c);return d}if(u>=R.day){let c=new Date(t*1e3);n==="UTC"?(c.setUTCHours(0,0,0,0),c.getTime()/1e3<t&&c.setUTCDate(c.getUTCDate()+a)):(c.setHours(0,0,0,0),c.getTime()/1e3<t&&c.setDate(c.getDate()+a));let f=c.getTime()/1e3;for(;f<=o;)d.push(f),n==="UTC"?c.setUTCDate(c.getUTCDate()+a):c.setDate(c.getDate()+a),f=c.getTime()/1e3;return d}let p=Math.ceil(t/m)*m;for(;p<=o;p+=m)d.push(p);return d}function de(e,t,o){return t.length===0?[]:t.map((n,r)=>r===0||r===t.length-1?nt(n*1e3,{timeZone:o}):"")}function at(e,t,o){let n=e.scales.x,r=((n?.max??0)-(n?.min??0))*1e3,l=Math.floor(e.width/100),s=r/1e3/l,{increment:i}=fe(s),u=t.map(a=>a*1e3);return it(u,i,r,o)}function ge(e,t,o=!1){let n=o?(s,i,u,a)=>me(s,u,a):(s,i,u,a)=>st(s,u,a,t),r=o?(s,i)=>de(s,i,t):(s,i)=>at(s,i,t),l=o?(s,i,u,a,m)=>{let p=document.createElement("canvas").getContext("2d");if(!p)return 0;p.font=N(e);let c=de(s,me(s,u,a),t),f=Math.max(p.measureText(c[0]||"").width,p.measureText(c[1]||"").width);return Math.ceil(f/2)+15}:void 0;return{font:N(e),labelFont:N(e),grid:{show:!1,width:.5},ticks:{width:.5},splits:n,values:r,size:20}}import{computePosition as gt,flip as bt,offset as ht}from"@floating-ui/dom";import yt from"uplot";import{createRoot as lt}from"react-dom/client";var te=class{overlay=null;reactRoot=null;initialize(){this.overlay||(this.overlay=document.createElement("div"),this.overlay.id="unblind-tooltip-overlay",this.overlay.style.display="none",this.overlay.style.position="fixed",this.overlay.style.pointerEvents="none",this.overlay.style.zIndex="9999",document.body.appendChild(this.overlay),this.reactRoot=lt(this.overlay))}getOverlay(){return this.overlay}render(t){this.reactRoot&&this.reactRoot.render(t)}show(){this.overlay&&(this.overlay.style.display="block")}hide(){this.overlay&&(this.overlay.style.display="none"),this.render(null)}destroy(){this.reactRoot&&(this.reactRoot.unmount(),this.reactRoot=null),this.overlay&&(this.overlay.remove(),this.overlay=null)}},B=new te;import{dateTimeFormat as be}from"@grafana/data";import{useMemo as he}from"react";import{jsx as U,jsxs as E}from"react/jsx-runtime";function Ce(e){return e.metric.displayName||e.metric.name||(typeof e.serie.label=="string"?e.serie.label:e.serie.label?.textContent||"Unknown")}function ye(e){let t=e.attributes||{};if(t["service.name"])return String(t["service.name"]);let n=Object.keys(t)[0];return n?String(t[n]):"z-fallback"}function Te(e){return[...e].sort((t,o)=>(Number(o.value)||0)-(Number(t.value)||0))}function ve(e){return[...e].sort((t,o)=>ye(t).localeCompare(ye(o)))}function ut(e){let t={};return e.forEach(o=>{let n=Ce(o);t[n]||(t[n]=[]),t[n].push(o)}),t}function ct(e,t,o,n="original"){if(o==="flat")return[{label:"",items:t?Te(e):ve(e)}];let r=ut(e);return Object.keys(r).sort((s,i)=>s.localeCompare(i)).map(s=>{let i=r[s];if(!i)return{label:_(s,n),items:[]};let u=t?Te(i):ve(i);return{label:_(s,n),items:u}})}function _(e,t,o){switch(t){case"suffix":{let n=e.split(/[._-]/),r=n[n.length-1]||"";return o?r:r.charAt(0).toUpperCase()+r.slice(1).toLowerCase()}case"title":return e.split(/[._-]/).map(n=>o?n:n.charAt(0).toUpperCase()+n.slice(1).toLowerCase()).join(" ");default:return e}}function pt(e,t){if(t&&t!=="auto")return t;let o=e.some(r=>r.attributes&&Object.keys(r.attributes).length>0),n=new Set(e.map(Ce));return o&&n.size>=1?"group-by-metric":"flat"}function xe({hideAttributeKey:e,attribute:t,format:o,isLastAttribute:n}){let[r,l]=t;return E("div",{className:"ub-tooltip-item-attribute-container",children:[E("div",{className:e?"ub-tooltip-item-attribute":"ub-tooltip-item-attribute-with-key",children:[!e&&E("span",{className:"ub-tooltip-item-attribute-key",children:[_(r,o),":"]}),U("span",{className:"ub-tooltip-item-attribute-value",children:l})]}),!n&&e&&U("span",{"data-text":", ",className:"ub-tooltip-item-attribute-divider"})]})}function mt({item:e,hideMetric:t,hideAttributeKey:o,hideAttributes:n,format:r}){let s=Object.entries(e.attributes||{}),i=s.length>0&&!n;return n&&t&&console.warn("Invalid configuration. Attributes and metrics are hidden."),E("div",{className:"ub-tooltip-item-row",children:[E("div",{className:"ub-tooltip-item-left"+(t?" ub-tooltip-item-hidden-metric":""),children:[E("div",{className:"ub-tooltip-item-heading",children:[U("span",{className:"ub-tooltip-item-dot",style:{backgroundColor:e.color}}),t?U("div",{className:"ub-tooltip-item-attributes",children:s.map((u,a)=>U(xe,{hideAttributeKey:o,attribute:u,format:r,isLastAttribute:a>=s.length-1},"attr_"+u[0]))}):U("span",{className:i?"ub-tooltip-item-metric-name-label":"ub-tooltip-item-metric-name",children:_(e.metric.name,r)})]}),i&&!t&&U("div",{className:"ub-tooltip-item-attributes",children:s.map((u,a)=>U(xe,{hideAttributeKey:o,attribute:u,format:r,isLastAttribute:a>=s.length-1},"attr_"+u[0]))})]}),U("div",{className:"ub-tooltip-item-value",children:e.formattedValue??U("span",{className:"ub-tooltip-item-value--empty",children:"\u2014"})})]})}function dt({className:e="ub-tooltip-divider",...t}){return U("hr",{role:"presentation",...t,className:e})}function ft({group:e,groupIdx:t,hideAttributeKey:o,hideMetric:n,hideAttributes:r,format:l,hideGroupLabel:s}){return E("div",{className:"ub-tooltip-group",children:[!s&&U("div",{className:`ub-tooltip-group-header${t>0?" ub-tooltip-group-header--separator":""}`,children:e.label}),U("div",{className:"ub-tooltip-items",children:e.items.map((i,u)=>U(mt,{item:i,format:l,hideAttributeKey:o,hideMetric:n,hideAttributes:r},`item-${t}-${u}`))})]},e.label)}function we({timestamp:e,items:t,timeZone:o,spansMultipleDays:n,sortByValues:r,format:l="original",layout:s="flat",hideAttributeKey:i,hideMetric:u,hideAttributes:a}){let m=n?be(e*1e3,{format:"MMM DD, HH:mm",timeZone:o}):be(e*1e3,{format:"HH:mm",timeZone:o}),d=he(()=>pt(t,s),[t,s]),p=d==="flat",f=typeof u=="boolean"?u:d==="group-by-metric",h=typeof i=="boolean"?i:!1,b=typeof a=="boolean"?a:!1,T=he(()=>ct(t,r,d,l),[t,r,d,l]);return E("div",{className:"ub-tooltip",children:[U("div",{className:"ub-tooltip-datetime",children:m}),U(dt,{}),T.length>0?U("div",{className:"ub-tooltip-content",children:T.map((C,g)=>U(ft,{group:C,groupIdx:g,hideAttributeKey:h,hideMetric:f,hideAttributes:b,hideGroupLabel:p,format:l},C.label))}):U("div",{className:"ub-tooltip-no-data",children:"No data available"})]})}import{jsx as Pe}from"react/jsx-runtime";var Tt=4,vt=8;function xt(e,t){if(!e||e.length===0)return!1;let o=e[0],n=e[e.length-1];if(o==null||n==null)return!1;let r=new Date(o*1e3),l=new Date(n*1e3),s=i=>t==="UTC"?`${i.getUTCFullYear()}-${i.getUTCMonth()}-${i.getUTCDate()}`:i.toLocaleDateString(void 0,{timeZone:t});return s(r)!==s(l)}function Ct(e,t){let o=!1;for(let r=1;r<e.series.length;r++)if(e.data[r]?.[t]!=null){o=!0;break}if(o)return t;let n=e.data[0].length;for(let r=1;t+r<n||t-r>=0;r++){let l=t-r,s=t+r;if(l>=0){for(let i=1;i<e.series.length;i++)if(e.data[i]?.[l]!=null)return l}if(s<n){for(let i=1;i<e.series.length;i++)if(e.data[i]?.[s]!=null)return s}}return t}function wt(e,t,o,n,r,l){let s=!1,i=[];for(let u=1;u<e.series.length;u++){let a=e.data[u]?.[t]??null;if(n&&a!=null&&u>1){let b=e.data[u-1]?.[t]??0;a=a-b}let m=e.series[u],d=l?.[u-1];if(!d){console.warn("Original serie not found");continue}let p=r[d.metric];if(!p){console.warn("Metric metadata not found");continue}let c=m?.stroke,f=typeof c=="function"?c(yt,u):c??"#ffffff00",h=a==null?void 0:o?o(a):String(a);d?.attributes&&Object.keys(d?.attributes).length>0&&(s=!0),i.push({metric:p,color:f,value:a===null?void 0:a,formattedValue:h,attributes:d?.attributes,serie:m})}return{items:i,hasAttributes:s}}async function Pt(e,t){let{x:o,y:n}=await gt({getBoundingClientRect:()=>({x:t.left,y:t.top,width:0,height:0,top:t.top,left:t.left,right:t.left,bottom:t.top})},e,{placement:"top-start",strategy:"fixed",middleware:[ht({mainAxis:Tt,crossAxis:vt}),bt()]});e.style.left=`${o}px`,e.style.top=`${n}px`}function Ue(e,t,o,n,r,l,s,i,u,a,m,d){let p,c,f,h=!1;function b(){let g=p.getBoundingClientRect();c=g.left,f=g.top}function T(){B.hide()}function C(){B.show()}return{hooks:{init:g=>{B.initialize(),p=g.over,window.addEventListener("scroll",b,!0),window.addEventListener("resize",b);let w=new MutationObserver(()=>{p&&!document.body.contains(p)&&(h=!1,T(),w.disconnect())});p.onmouseenter=()=>{h=!0,C()},p.onmouseleave=()=>{h=!1,T()},b()},setSize:()=>{b()},setCursor:g=>{let{left:w,top:S,idx:v}=g.cursor;if(!h||v==null){T();return}let y=g.data[0],x=xt(y,r),P=Ct(g,v),k=g.data[0][P];if(k===void 0)return;let{items:D}=wt(g,P,e,t,o,s),q={left:(w||0)+c,top:(S||0)+f};C();let O=l,H=O?Pe(O,{timestamp:k,items:D,timeZone:r}):Pe(we,{timestamp:k,items:D,timeZone:r,spansMultipleDays:x,stacked:t,sortByValues:n,layout:i,format:u,hideAttributeKey:a,hideAttributes:m,hideMetric:d});B.render(H);let j=B.getOverlay();j&&Pt(j,q)},destroy(){window.removeEventListener("scroll",b,!0),window.removeEventListener("resize",b),p&&(p.onmouseenter=null,p.onmouseleave=null)}}}}var N=e=>`${getComputedStyle(document.documentElement).getPropertyValue("--ub-chart-font-size").trim()} ${e}`,Ae=(e,t)=>{let o=e;return t&&t.unit&&t.unit.code&&t.unit.code!=="1"&&(!o&&t.unit?o=t.unit.code:o&&t.unit.code!==o&&(o=void 0)),o};function At(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)&&Array.isArray(e.fill)&&Array.isArray(e.border)}function Rt(e){return Array.isArray(e)}var Re=(e,t,o,n,r)=>Rt(o)?r&&(n==="step"||n==="line"||n==="spline")?o[t]+"66":o[t]:At(o)?r?o.fill[t]:o.border[t]:o(e,t,n,r),St=e=>{let t=Q.paths.bars({size:[.6,100],radius:0,gap:0}),o=Q.paths.linear({alignGaps:0}),n=Q.paths.spline({alignGaps:1}),r=Q.paths.stepped({alignGaps:1});switch(e){case"line":return o;case"bar":return t;case"area":return o;case"step":return r;case"spline":return n;default:return o}},kt=(e,t,o,n)=>Re(e,t,o,n,!0),Mt=(e,t)=>{switch(e){case"bar":return 1;case"line":return t?1.5:2;case"spline":return t?1.5:2;case"area":return 1;case"step":return 1.5;default:return 1}},Et=(e,t,o)=>{let n=e.posToVal(t,"x"),r=e.data[0];if(!r||r.length===0)return[t,o];let l=0,s=0,i=r.length-1;for(;i-s>1;){let c=Math.floor((s+i)/2),f=r[c];f!=null&&f<n?s=c:i=c}let u=r[s],a=r[i];u!=null&&a!=null?l=Math.abs(u-n)<Math.abs(a-n)?s:i:u!=null?l=s:a!=null&&(l=i);let m=l;for(let c=l;c>=0;c--){let f=!1;for(let h=1;h<e.data.length;h++){let b=e.data[h];if(b&&b[c]!=null){f=!0;break}}if(f){m=c;break}}let d=r[m];return d==null?[t,o]:[e.valToPos(d,"x"),o]},Se=(e,t,o,n,r,l,s,i,u,a,m,d,p,c,f,h,b,T,C)=>{let g=e?.clientWidth??1050,w=e?.clientHeight??250,S=typeof o=="string"?String(o).toLowerCase().replaceAll("by","bytes"):o,v=Ut(S==="1"?null:S),A=Mt(r,u),y={width:g,height:w,scales:{y:{range:ke(o)}},plugins:[Ue(x=>{let P=v(x,Number.isInteger(x)?0:2);return P.text+(P.suffix?.trim()||"")},l,t,m,d,p,n,h,f,b,T,C)],padding:c?[10,15,10,15]:[8,15,8,15],cursor:{y:!1,sync:{key:"_"},drag:{setScale:!0,x:!0,y:!1},move:Et},series:[{},...n.map((x,P)=>({label:x.metric,stroke:Re(x,P,i,r),width:A,points:{show:!1},spanGaps:!0,paths:St(r),fill:u||l?kt(x,P,i,r):void 0}))],axes:[ge(a,d,c),Me(v,a,o)],legend:{show:!1}};if(s){let x=y.axes?.[0],P=y.axes?.[1];x&&(x.stroke="#dadada",x.grid&&(x.grid.stroke="#2c3235")),P&&(P.stroke="#dadada",P.grid&&(P.grid.stroke="#2c3235"))}else{let x=y.axes?.[0],P=y.axes?.[1];x&&(x.stroke="#45556c"),P&&(P.stroke="#45556c")}return y};var Ee=e=>{let t=e/4,o=Math.pow(10,Math.floor(Math.log10(t))),n=t/o,r;return n>5?r=10*o:n>2?r=5*o:n>1?r=2*o:r=o,Math.ceil(e/r)*r},ke=e=>(t,o,n)=>{let l=n*2,s=o<0?o*2:o*0;if(e==="percent"||e==="percentunit")return n>100?o<0?[s,l]:[0,l]:o<0?[s,100]:[0,100];if(n<=.9999)return o<=0?[s,1]:[0,1];let i=Ee(l),u=Ee(Math.abs(s));return o<0?[-u,i]:[0,i]},Lt=(e,t,o,n)=>{let r=e.axes[o];if(n>1)return r?._size;let l=(r?.ticks?.size||0)+(r?.gap||0),s=(t??[]).reduce((i,u)=>u.length>i.length?u:i,"");return s!=""&&(e.ctx.font=r?.font?.[0]??e.ctx.font,l+=e.ctx.measureText(s).width/devicePixelRatio),Math.ceil(l)};function Me(e,t,o){return{gap:0,font:N(t),labelFont:N(t),grid:{show:!0,width:.5},ticks:{width:.5},values:(n,r)=>r.map(l=>{let s=e(l);return s.text+(s.suffix?.trim()||"")}),size:Lt}}function Le(e,t){let o=[],n=e[0],r=n.length,l=Array(r).fill(0),s=[n];return e.forEach((i,u)=>{u!==0&&(t?s.push(i):s.push(i.map((a,m)=>l[m]=l[m]+(a||0))))}),e.forEach((i,u)=>{u===0||t||o.push({series:[e.findIndex((a,m)=>m>u),u]})}),{data:s,bands:o.filter(i=>i.series[1]>-1)}}import{jsx as Ot}from"react/jsx-runtime";function oe(e){let{times:t,series:o,metadata:n,type:r,className:l,timeZone:s,options:i,tooltip:u,colors:a,tooltipAppearance:m,sortByValues:d=!1,unit:p,fill:c=!1}=e,{layout:f,format:h,hideAttributeKey:b,hideAttributes:T,hideMetric:C}=u||{},g=It(null),w=ee(),S=V(),v=a||S.appearance.colors;return Nt(()=>{if(!o||o.length===0){console.warn("No series provided");return}let A=[t],y=p;o.forEach(q=>{let O=n[q.metric];p||(y=Ae(y,O)),A.push(q.values)});let x=r==="bar"||r==="area",P=Le(A,!x),k=g.current,D=null;if(k){let O=window.getComputedStyle(k).fontFamily,H=Se(k,n,y,o,r,x,w,v,c,O,d,s,m,!1,h,f,b,T,C);H.bands=P.bands,D=new Dt({...H,...i},P.data,k);let j=new ResizeObserver(()=>{D?.setSize({width:k.clientWidth,height:k.clientHeight})});return j.observe(k),()=>{D?.destroy(),j.disconnect()}}},[o,t,r,w,n,s,m,v,c,d,p,h,f,b,T,C]),Ot("div",{ref:g,className:"ub-chart-container"+(l?` ${l}`:"")})}import{jsx as I}from"react/jsx-runtime";function Vt({metrics:e,operator:t,attributes:o,groupBy:n,interval:r,type:l="line",className:s,appearance:i,unit:u}){let a=V(),m=r??a.interval,d=o??a.attributes,p=n??a.groupBy,c=t??a.operator,f=i?.colors??a.appearance.colors,h=typeof i?.sortByValues=="boolean"?i?.sortByValues:a.appearance.sortByValues,{isLoading:b,data:T,hasError:C}=Z({queries:(Array.isArray(e)?e:[e]).map(y=>({metrics:[y],operator:c,attributes:d,groupBy:p})),timeRange:a.timeRange,startTime:a.startTime,endTime:a.endTime,interval:m}),{series:g,times:w,metadata:S}=T,v=g.every(y=>y.isEmpty),A=`ub-chart-container${s?` ${s}`:""}`;if(b){let y=i?.components?.Loading??a.appearance.components.Loading;return I("div",{className:A,children:I(y,{})})}if(v){let y=i?.components?.Empty??a.appearance.components.Empty;return I("div",{className:A,children:I(y,{})})}if(C){let y=i?.components?.Error??a.appearance.components.Error;return I("div",{className:A,children:I(y,{})})}return I(oe,{times:w,series:g,metadata:S,type:l,className:A,tooltip:{layout:a.appearance.tooltip?.layout,format:a.appearance.tooltip?.format,hideAttributes:a.appearance.tooltip?.hideAttributes,hideAttributeKey:a.appearance.tooltip?.hideAttributeKey,hideMetric:a.appearance.tooltip?.hideMetric},colors:f,sortByValues:h,unit:u,fill:typeof i?.fill=="boolean"?i.fill:a.appearance.fill,tooltipAppearance:i?.components?.Tooltip??a.appearance.components.Tooltip})}export{oe as Chart,$ as Empty,W as Error,X as Loading,Vt as TimeseriesChart,Ge as UnblindProvider,J as UnblindScope,et as useLogs,Ke as useMetrics,le as useRefresh,V as useScope,ee as useTheme,Z as useTimeseries,Ye as useUsage};
1
+ import{QueryClient as Me,QueryClientProvider as rt,useQueryClient as ot}from"@tanstack/react-query";import{createContext as it,useCallback as nt,useContext as st,useMemo as Ue}from"react";import{jsx as Ee}from"react/jsx-runtime";var Ne=it(void 0);function ce({children:e,queryClient:t,queryClientConfig:r,apiBaseUrl:i="/api/unblind",fetchImpl:o}){let n=Ue(()=>{if(t)return t;let a={refetchOnWindowFocus:!1,refetchOnReconnect:!1,refetchOnMount:!1},l={defaultOptions:{queries:a}};return r?new Me({...r,defaultOptions:{...r.defaultOptions,queries:{...a,...r.defaultOptions?.queries}}}):new Me(l)},[t,r]),s=Ue(()=>({apiBaseUrl:i,fetchImpl:o}),[i,o]);return Ee(rt,{client:n,children:Ee(Ne.Provider,{value:s,children:e})})}function D(){let e=st(Ne);if(!e)throw new Error("useUnblindConfig must be used within an UnblindClientProvider. Please wrap your app or component tree with <UnblindClientProvider>.");return e}function De(){let e=ot();return nt(async()=>{await e.refetchQueries({queryKey:["unblind","timeseries"]})},[e])}import{createContext as lt,useContext as Ve,useMemo as ee}from"react";import{jsx as F,jsxs as at}from"react/jsx-runtime";function ue(){return F("div",{className:"ub-default",children:at("div",{className:"ub-empty-content",children:[F("div",{className:"ub-empty-icon-wrapper",children:F("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:"ub-icon",children:F("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"})})}),F("p",{className:"ub-empty-text","data-text":"No data available for this time range"})]})})}function pe(){return F("div",{className:"ub-default-error"})}function me(){return F("div",{className:"ub-default-loading","data-text":"Loading"})}import{jsx as ut}from"react/jsx-runtime";var de=lt(void 0);function te({children:e,timeRange:t,startTime:r,endTime:i,interval:o,attributes:n,groupBy:s,operator:a,appearance:l,tooltip:c,colors:g,fill:d,hideAxis:h,hideCursor:u,relativeTimeAxis:m,invertSort:b,disableSuggestedLabel:v}){let f=Ve(de),x=l?.components?.Loading||f?.appearance?.components?.Loading,C=l?.components?.Error||f?.appearance?.components?.Error,y=l?.components?.Tooltip||f?.appearance?.components?.Tooltip,T=l?.components?.Empty||f?.appearance?.components?.Empty,R=typeof c?.hide=="boolean"?c?.hide:f?.tooltip?.hide,k=typeof c?.visibilityLimit=="number"?c?.visibilityLimit:f?.tooltip?.visibilityLimit,S=ee(()=>({components:{...x&&{Loading:x},...C&&{Error:C},...y&&{Tooltip:y},...T&&{Empty:T}}}),[x,C,y,T]),U=ee(()=>({hide:R,visibilityLimit:k}),[R,k]),w=ee(()=>({timeRange:t??f?.timeRange,startTime:r??f?.startTime,endTime:i??f?.endTime,interval:o??f?.interval,attributes:n??f?.attributes,groupBy:s??f?.groupBy,operator:a??f?.operator,colors:g??f?.colors,relativeTimeAxis:typeof m=="boolean"?m:f?.relativeTimeAxis,fill:typeof d=="boolean"?d:f?.fill,hideAxis:typeof h=="boolean"?h:f?.hideAxis,hideCursor:typeof u=="boolean"?u:f?.hideCursor,invertSort:typeof b=="boolean"?b:f?.invertSort,disableSuggestedLabel:typeof v=="boolean"?v:f?.disableSuggestedLabel,appearance:S,tooltip:U}),[t,r,i,o,n,s,a,g,d,m,h,u,S,U,f,b,v]);return ut(de.Provider,{value:w,children:e})}var ct="6h";function V(){let e=Ve(de);return ee(()=>({...e,timeRange:e?.timeRange||ct,appearance:{components:{Loading:e?.appearance?.components?.Loading??me,Error:e?.appearance?.components?.Error??pe,Empty:e?.appearance?.components?.Empty??ue,Tooltip:e?.appearance?.components?.Tooltip}}}),[e])}import{jsx as Oe}from"react/jsx-runtime";function pt({children:e,queryClient:t,apiBaseUrl:r,fetchImpl:i,timeRange:o,startTime:n,endTime:s,interval:a,attributes:l,groupBy:c,operator:g,appearance:d,tooltip:h,colors:u,fill:m,hideAxis:b,hideCursor:v,relativeTimeAxis:f,invertSort:x,disableSuggestedLabel:C}){return Oe(ce,{queryClient:t,apiBaseUrl:r,fetchImpl:i,children:Oe(te,{timeRange:o,startTime:n,endTime:s,interval:a,attributes:l,groupBy:c,operator:g,appearance:d,tooltip:h,colors:u,fill:m,hideAxis:b,hideCursor:v,relativeTimeAxis:f,invertSort:x,disableSuggestedLabel:C,children:e})})}import{useQuery as mt}from"@tanstack/react-query";function dt(){let{apiBaseUrl:e,fetchImpl:t=fetch}=D(),r=mt({queryKey:["unblind","metrics"],queryFn:async()=>{let i=await t(`${e}/metrics`,{headers:{"Content-Type":"application/json"}});if(!i.ok)throw new Error("Error loading metrics metadata");if(i.status===200){let{data:o}=await i.json();return o}else throw new Error("Unexpected status code")}});return{metrics:r.data,isLoading:r.isLoading,hasError:r.isError,refetch:r.refetch}}import{useQuery as bt}from"@tanstack/react-query";import{useMemo as X}from"react";import ft from"ms";function Ie({scope:e,props:t}){return t.timeRange||t.startTime&&t.endTime?t:e}function ht(e){let t=Math.floor(Date.now()/1e3);return[t-Math.floor(ft(e)/1e3),t]}function Q(e,t,r){let i,o;if(typeof t=="number"&&typeof r=="number")i=t,o=r;else if(e){let[n,s]=ht(e);i=n,o=s}else throw new Error("Either timeRange or both startTime and endTime must be provided");return[i,o]}import{useMemo as gt}from"react";function $(e){let t=V(),{timeRange:r,startTime:i,endTime:o}=Ie({props:e,scope:t});return gt(()=>({timeRange:r,startTime:i,endTime:o}),[r,i,o])}function fe(e){let{apiBaseUrl:t,fetchImpl:r=fetch}=D(),{startTime:i,endTime:o,timeRange:n}=$(e),{queries:s,interval:a}=e,l=X(()=>s.map(y=>y.metrics.join(",")).join(","),[s]),c=X(()=>s.map(y=>{let T=y.attributes;if(!T)return"";let R=Object.keys(T);return R.length===0?"":R.map(k=>k+":"+T[k]?.join(",")).join(",")}).join(","),[s]),g=X(()=>s.map(y=>y.operator),[s]),d=X(()=>s.map(y=>y.groupBy).join(", "),[s]),u=bt({queryKey:["unblind","timeseries",l,c,i,o,n,a,g,d],queryFn:async()=>{if(!l)throw new Error("Missing required parameters");if(l.length===0)throw new Error("No series provided");let[y,T]=Q(n,i,o),R={queries:s,startTime:y,endTime:T,interval:a},k=await r(`${t}/tenants/timeseries`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(R)});if(!k.ok)throw new Error("Error fetching metric");let{series:S,times:U,metadata:w}=await k.json();if(!S)throw console.error("Series not found"),new Error("Series not found");return{series:S,times:U,metadata:w}},enabled:!!l&&(typeof i=="number"&&typeof o=="number"||!!n)}),{metadata:m,series:b,times:v}=X(()=>u.data?{series:u.data.series,times:u.data.times,metadata:u.data.metadata}:{series:[],times:[],metadata:{}},[u]),f=u.isLoading,x=u.isFetching,C=u.isError;return{data:{series:b,times:v,metadata:m},isLoading:f,isFetching:x,hasError:C,refetch:u.refetch}}import{useQuery as yt}from"@tanstack/react-query";import{useMemo as Tt}from"react";function vt(e){let{apiBaseUrl:t,fetchImpl:r=fetch}=D(),{startTime:i,endTime:o,timeRange:n}=$(e),a=yt({queryKey:["unblind","usage",n,i,o],queryFn:async()=>{let[d,h]=Q(n,i,o),u=`${t}/tenants/usage`,m=await r(u,{headers:{"Content-Type":"application/json"},body:JSON.stringify({startTime:d,endTime:h})});if(!m.ok)throw new Error("Error fetching usage");let{data:b}=await m.json();if(!b)throw new Error("usage not found");return b},enabled:typeof i=="number"&&typeof o=="number"||!!n}),l=Tt(()=>a.data?a.data||[]:[],[a]),c=a.isLoading||a.isRefetching,g=a.isError;return{usage:l,isLoading:c,hasError:g,refetch:a.refetch}}import{useInfiniteQuery as Ct}from"@tanstack/react-query";import{useMemo as xt}from"react";function St(e){let{apiBaseUrl:t,fetchImpl:r=fetch}=D(),{timeRange:i,startTime:o,endTime:n}=$(e),{attributes:s,body:a,severity:l,traceId:c,spanId:g,logId:d}=e,h=Ct({queryKey:["unblind","logs",i,o,n,a,l,d,JSON.stringify(s)],queryFn:async({pageParam:m})=>{let[b,v]=Q(i,o,n),f=await r(`${t}/tenants/logs`,{method:"POST",body:JSON.stringify({attributes:s,body:a,severity:l,traceId:c,spanId:g,logId:d,startTime:b,endTime:v,pagination:{page:m}}),headers:{"Content-Type":"application/json"}});if(!f.ok)throw new Error("Error fetching logs");let{data:x,nextPage:C}=await f.json();if(!x)throw new Error("data not found");return{data:x,nextPage:C}},initialPageParam:void 0,getNextPageParam:m=>m.nextPage});return{logs:xt(()=>h.data?h.data.pages.flatMap(m=>m.data||[]):[],[h.data]),isLoading:h.isLoading,hasError:h.isError,hasNextPage:h.hasNextPage??!1,fetchNextPage:h.fetchNextPage,isFetchingNextPage:h.isFetchingNextPage,refetch:h.refetch}}var Y=e=>"value"in e,re=e=>"from"in e&&"to"in e;function he(e){return typeof e=="object"&&e!==null&&typeof e.name=="string"&&typeof e.label=="string"}import{useEffect as yr,useMemo as Ae}from"react";import{useEffect as fr,useRef as hr}from"react";import gr from"uplot";import ie from"uplot";import{getValueFormat as Kt}from"@unblind/units";import{dateTimeFormat as Pt,dateTimeFormatTimeAgo as Lt,systemDateFormats as ge}from"@unblind/units";var M={millisecond:1,second:1e3,minute:6e4,hour:36e5,day:864e5,month:24192e5,year:31536e6},W={second:[1,2,5,10,15,30],minute:[1,2,5,10,15,30],hour:[1,2,3,4,6,8,12],day:[1,2,3,7,14],month:[1,2,3,6],year:[1,2,5,10,20,50,100]};function Rt(e,t,r,i){if(t>7*M.day){let o=ge.interval.year,n=Math.round(M.year/M.day)*M.day;if(Math.round(t/M.day)*M.day===n)o=ge.interval.year;else{if(t<=M.year)return e.map(a=>{let l=new Date(a);return(i==="UTC"?l.getUTCDate():l.getDate())===1?l.toLocaleDateString(void 0,{month:"short",year:"numeric",timeZone:i}):l.toLocaleDateString(void 0,{day:"numeric",month:"short",timeZone:i})});o=ge.interval.day}return e.map(a=>Pt(a,{format:o,timeZone:i}))}return e.map(o=>{let n=new Date(o),s=t<M.minute,a=t<M.second,l=n.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1,timeZone:i});return(l==="00:00"||l==="24:00")&&!s&&!a?n.toLocaleDateString(void 0,{day:"2-digit",month:"short",timeZone:i}):n.toLocaleTimeString(void 0,{hour:"2-digit",minute:"2-digit",second:s?"2-digit":void 0,fractionalSecondDigits:a?3:void 0,hour12:!1,timeZone:i})})}function kt(e){let t=[{size:M.second/1e3,increments:W.second},{size:M.minute/1e3,increments:W.minute},{size:M.hour/1e3,increments:W.hour},{size:M.day/1e3,increments:W.day},{size:M.month/1e3,increments:W.month},{size:M.year/1e3,increments:W.year}];for(let o of t)for(let n of o.increments){let s=o.size*n;if(s>=e)return{increment:s*1e3,multiplier:n}}let r=t[t.length-1],i=r.increments[r.increments.length-1];return{increment:r.size*i*1e3,multiplier:i}}function At(e,t,r){return[t,r]}function wt(e,t,r){return t.length===0?[]:t.map((i,o)=>o===0||o===t.length-1?Lt(i*1e3,{timeZone:r}):"")}function Mt(e,t,r){let i=e.scales.x,o=((i?.max??0)-(i?.min??0))*1e3,n=Math.floor(e.width/100),s=o/1e3/n,{increment:a}=kt(s),l=t.map(c=>c*1e3);return Rt(l,a,o,r)}function ze(e,t,r=!1,i=!1){let o=r?(s,a,l,c)=>At(s,l,c):void 0,n=r?(s,a)=>wt(s,a,t):(s,a)=>Mt(s,a,t);return{font:j(e),labelFont:j(e),grid:{show:!1,width:.5},ticks:{width:.5},splits:o,values:n,size:20,show:!i,align:r?2:void 0,space:(s,a,l,c,g)=>g<400?100:g<800?150:250}}import{computePosition as Ut,flip as Et,offset as Nt}from"@floating-ui/dom";import{createRoot as Dt}from"react-dom/client";var Vt=4,Ot=8,be=class{overlay=null;reactRoot=null;renderedUplot=null;initialize(){this.overlay||(this.overlay=document.createElement("div"),this.overlay.id="unblind-tooltip-overlay",this.overlay.style.display="none",this.overlay.style.position="fixed",this.overlay.style.pointerEvents="none",this.overlay.style.zIndex="9999",document.body.appendChild(this.overlay),this.reactRoot=Dt(this.overlay))}getOverlay(){return this.overlay}render(t,r){this.reactRoot?(this.reactRoot.render(r),this.renderedUplot=t):this.renderedUplot=null}show(){this.overlay&&(this.overlay.style.display="block")}hide(t){if(t!==this.renderedUplot){console.warn("Hide call plot");return}this.overlay&&(this.overlay.style.display="none"),this.render(null,null)}getRenderedUplot(){return this.renderedUplot}async positionTooltip(t){let r=this.getOverlay();if(r){let{x:i,y:o}=await Ut({getBoundingClientRect:()=>({x:t.left,y:t.top,width:0,height:0,top:t.top,left:t.left,right:t.left,bottom:t.top})},r,{placement:"top-start",strategy:"fixed",middleware:[Nt({mainAxis:Vt,crossAxis:Ot}),Et()]});r.style.left=`${i}px`,r.style.top=`${o}px`}}},E=new be;import{dateTimeFormat as qe}from"@unblind/units";import{createContext as Fe,Fragment as It,useContext as Be}from"react";import{Fragment as $t,jsx as p,jsxs as A}from"react/jsx-runtime";var zt=6,_e=Fe(null);function oe(){let e=Be(_e);if(!e)throw new Error("useTooltipSerie must be used within a SerieProvider");return e}function qt({serie:e,children:t}){return p(_e.Provider,{value:e,children:t})}var He=Fe(null);function J(){let e=Be(He);if(!e)throw new Error("useTooltipSerie must be used within a SerieProvider");return e}function ye({formattedTime:e,tooltip:t,children:r}){return p(He.Provider,{value:{formattedTime:e,disableSuggestedLabel:t.disableSuggestedLabel,invertSort:t.invertSort,visibilityLimit:t.visibilityLimit||zt},children:r})}function Te({className:e="ub-tooltip-divider",...t}){return p("hr",{role:"presentation",...t,className:e})}function Ft({unitCategory:e,tooltipSerieList:t}){let{visibilityLimit:r,formattedTime:i}=J(),o=t.slice(0,r),n=t.slice(r);return A("div",{className:"ub-tooltip ub-tooltip-multiple-metrics",children:[A(Se,{children:[p(Pe,{children:i}),p("div",{className:"ub-tooltip-header-right",children:p(Ht,{children:e})})]}),p(Te,{}),A("div",{children:[p(xe,{children:o.map(s=>A(Ce,{serie:s,children:[p(Re,{}),p(Qe,{}),p(Le,{})]},s.metric.name))}),p(ve,{series:n})]})]})}function Bt({tooltipSerieList:e}){let{visibilityLimit:t,disableSuggestedLabel:r,formattedTime:i}=J(),o=e[0],n=e.slice(0,t),s=e.slice(t);return A("div",{className:"ub-tooltip ub-tooltip-multiple-attributes",children:[A(Se,{children:[p(Pe,{children:i}),p("div",{className:"ub-tooltip-header-right",children:p("span",{className:"ub-tooltip-serie-metric",children:o?.metric.label||!r&&o?.metric.suggestedLabel||o?.metric.name})})]}),p(Te,{}),A("div",{children:[p(xe,{children:n.map((a,l)=>A(Ce,{serie:a,children:[p(Re,{}),p($e,{}),p(Le,{})]},"serie_"+l))}),p(ve,{series:s})]})]})}function _t({tooltipSerieList:e,unitCategory:t}){let{visibilityLimit:r,formattedTime:i}=J(),o=e.slice(0,r),n=e.slice(r);return A("div",{className:"ub-tooltip ub-tooltip-multiple-metrics-attributes",children:[A(Se,{children:[p(Pe,{children:i}),p("div",{className:"ub-tooltip-header-right",children:p("span",{className:"ub-tooltip-unit-category",children:t})})]}),p(Te,{}),A("div",{children:[p(xe,{children:o.map((s,a)=>A(Ce,{serie:s,children:[p(Re,{}),p(Qe,{}),p($e,{}),p(Le,{})]},"serie"+a))}),p(ve,{series:n})]})]})}function Ht(e){return p("span",{className:"ub-tooltip-unit-category",children:e.children})}function ve({series:e}){let t=e[0]?.formattedValue,r=!e.some(n=>(n.value||0)>0),i=!e.some(n=>n.value!==void 0),{invertSort:o}=J();return e.length>0?i?p("span",{className:"ub-tooltip-summary",children:A("span",{children:["+",e.length," more with no data"]})}):r?p("span",{className:"ub-tooltip-summary",children:A("span",{children:["+",e.length," more with zero values"]})}):A("span",{className:"ub-tooltip-summary",children:[A("span",{children:["+",e.length," more with "]}),p("span",{children:`${o?"\u2265":"\u2264"} ${t}`})]}):p($t,{})}function Ce(e){return p(qt,{serie:e.serie,children:p("div",{className:"ub-tooltip-serie",children:e.children})})}function xe(e){return p("div",{className:"ub-tooltip-content",children:e.children})}function Se(e){return p("div",{className:"ub-tooltip-header",children:e.children})}function Pe(e){return p("div",{className:"ub-tooltip-datetime",children:e.children})}function Qe(){let e=oe(),{disableSuggestedLabel:t}=J();return p("span",{className:"ub-tooltip-serie-metric ub-truncate",children:e.metric.label||!t&&e.metric.suggestedLabel||e.metric.name})}function Le(){let e=oe();return e.formattedValue?p("span",{className:"ub-tooltip-serie-value ub-truncate",children:e.formattedValue}):p("span",{className:"ub-tooltip-serie-value-empty",children:"\u2013"})}function Re(){let e=oe();return p("span",{style:{backgroundColor:e.color},className:"ub-tooltip-serie-color"})}function $e(){let{attributes:e}=oe();if(!e)return null;let t=Object.values(e);return p("div",{className:"ub-tooltip-serie-attributes ub-truncate",children:t.map((r,i)=>A(It,{children:[p("span",{className:"ub-tooltip-serie-attribute-value",children:r}),i<t.length-1&&p("span",{"data-text":", ",className:"ub-tooltip-serie-attribute-divider"})]},"tooltip-"+r))})}function Qt({tooltipSerieList:e,invertSort:t}){return t?e.sort((r,i)=>(Number(r.value)||0)-(Number(i.value)||0)):e.sort((r,i)=>(Number(i.value)||0)-(Number(r.value)||0))}function We({timestamp:e,tooltipSerieList:t,timeZone:r,spansMultipleDays:i,hasMultipleMetrics:o,hasAttributes:n,invertSort:s,visibilityLimit:a,disableSuggestedLabel:l}){let c=Qt({tooltipSerieList:t,invertSort:s}),g=i?qe(e*1e3,{format:"MMM DD, HH:mm",timeZone:r}):qe(e*1e3,{format:"HH:mm",timeZone:r});return n?n&&!o?p(ye,{tooltip:{invertSort:s,visibilityLimit:a,disableSuggestedLabel:l},formattedTime:g,children:p(Bt,{tooltipSerieList:c})}):p(ye,{tooltip:{invertSort:s,visibilityLimit:a,disableSuggestedLabel:l},formattedTime:g,children:p(_t,{unitCategory:"",tooltipSerieList:c})}):p(ye,{tooltip:{invertSort:s,visibilityLimit:a,disableSuggestedLabel:l},formattedTime:g,children:p(Ft,{unitCategory:"",tooltipSerieList:c})})}import{jsx as je}from"react/jsx-runtime";function Wt(e,t){if(!e||e.length===0)return!1;let r=e[0],i=e[e.length-1];if(r==null||i==null)return!1;let o=new Date(r*1e3),n=new Date(i*1e3),s=a=>t==="UTC"?`${a.getUTCFullYear()}-${a.getUTCMonth()}-${a.getUTCDate()}`:a.toLocaleDateString(void 0,{timeZone:t});return s(o)!==s(n)}function jt(e,t){let r=!1;for(let o=1;o<e.series.length;o++)if(e.data[o]?.[t]!=null){r=!0;break}if(r)return t;let i=e.data[0].length;for(let o=1;t+o<i||t-o>=0;o++){let n=t-o,s=t+o;if(n>=0){for(let a=1;a<e.series.length;a++)if(e.data[a]?.[n]!=null)return n}if(s<i){for(let a=1;a<e.series.length;a++)if(e.data[a]?.[s]!=null)return s}}return t}function Gt(e,t,r,i,o,n,s){let a=[],l=e.data[0],c=new Set,g=new Set,d=!1;for(let h=1;h<e.series.length;h++){let u=e.data[h]?.[t]??null;if(i&&u!=null&&h>1){let T=e.data[h-1]?.[t]??0;u=u-T}let m=e.series[h],b=n?.[h-1];if(!b){console.warn("Original serie not found");continue}let v=o[b.metric];if(!v){console.warn("Metric metadata not found");continue}c.add(b.metric);let f=b?.attributes;if(f&&Object.keys(f).length>0){d=!0;for(let T in f)g.add(T)}let x=m?.stroke,C=typeof x=="function"?x(e,h):x??"#ffffff00",y=u==null?void 0:r?r(u):String(u);a.push({metric:v,color:C,value:u===null?void 0:u,formattedValue:y,attributes:f,serie:m})}return{tooltipSerieList:a,hasAttributes:d,hasMultipleMetrics:c.size>1,hasMultipleAttributes:g.size>1,spansMultipleDays:Wt(l,s)}}function Ge(e,t,r,i,o,n,s,a,l){let c,g,d,h=!1;function u(){let m=c.getBoundingClientRect();g=m.left,d=m.top}return{hooks:{init:m=>{E.initialize(),c=m.over,window.addEventListener("scroll",u,!0),window.addEventListener("resize",u),c.onmouseenter=()=>{h=!0,E.show()},c.onmouseleave=()=>{h=!1,E.getRenderedUplot()===m&&E.hide(m)},u()},setSize:()=>{u()},setCursor:m=>{let{left:b,top:v,idx:f}=m.cursor;if(!h||f==null){E.getRenderedUplot()===m&&E.hide(m);return}let C=jt(m,f),y=m.data[0][C];if(y===void 0)return;let{tooltipSerieList:T,hasAttributes:R,hasMultipleAttributes:k,hasMultipleMetrics:S,spansMultipleDays:U}=Gt(m,C,e,t,r,n,i);E.show();let w=o,O=w?je(w,{timestamp:y,tooltipSerieList:T,timeZone:i}):je(We,{timestamp:y,tooltipSerieList:T,timeZone:i,spansMultipleDays:U,stacked:t,hasAttributes:R,hasMultipleAttributes:k,hasMultipleMetrics:S,visibilityLimit:s,invertSort:a,disableSuggestedLabel:l});E.render(m,O),E.positionTooltip({left:(b||0)+g,top:(v||0)+d})},destroy(m){window.removeEventListener("scroll",u,!0),window.removeEventListener("resize",u),c&&(c.onmouseenter=null,c.onmouseleave=null),E.getRenderedUplot()===m&&E.hide(m)}}}}var ne=["oklch(0.70 0.24 293)","oklch(0.85 0.18 95)","oklch(0.65 0.25 255)","oklch(0.72 0.26 27)","oklch(0.70 0.22 150)","oklch(0.78 0.18 50)","oklch(0.72 0.18 215)","oklch(0.70 0.27 301)","oklch(0.75 0.20 90)","oklch(0.68 0.23 277)","oklch(0.70 0.18 193)","oklch(0.68 0.25 4)"],j=e=>`${getComputedStyle(document.documentElement).getPropertyValue("--ub-chart-font-size").trim()} ${e}`,Ke=(e,t)=>{let r=e;return t&&t.unit&&t.unit.code&&t.unit.code!=="1"&&(!r&&t.unit?r=t.unit.code:r&&t.unit.code!==r&&(r=void 0)),r};function Xt(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)&&Array.isArray(e.fill)&&Array.isArray(e.border)}function Yt(e){return Array.isArray(e)}var Jt=12,Zt=({isFilling:e,useSolid:t,index:r})=>{let i=r%Jt+1;return e?t?`--ub-chart-serie-color-${i}`:`--ub-chart-serie-fill-color-${i}`:`--ub-chart-serie-color-${i}`},Xe=(e,t,r,i,o,n)=>{let s=i==="bar"||i==="area";if(r)return Yt(r)?r[t]:Xt(r)?n?r.fill[t]:r.border[t]:r(e,t,i,n);let a=Zt({isFilling:n,useSolid:s,index:t}),l=o.getPropertyValue(a).trim();return l||(n&&s?ne[t%ne.length]?.replace(")"," / 0.4)"):ne[t%ne.length])},er=e=>{let t=ie.paths.bars({size:[.6,100],radius:0,gap:0}),r=ie.paths.linear({alignGaps:0}),i=ie.paths.spline({alignGaps:1}),o=ie.paths.stepped({alignGaps:1});switch(e){case"line":return r;case"bar":return t;case"area":return r;case"step":return o;case"spline":return i;default:return r}},tr=(e,t,r,i,o)=>Xe(e,t,r,i,o,!0),rr=(e,t)=>{switch(e){case"bar":return 1;case"line":return t?1.5:2;case"spline":return t?1.5:2;case"area":return 1;case"step":return 1.5;default:return 1}},or=(e,t,r)=>{if(t<0||r<0)return[t,r];let i=e.posToVal(t,"x"),o=e.data[0];if(!o||o.length===0)return[t,r];let n=0,s=0,a=o.length-1;for(;a-s>1;){let u=Math.floor((s+a)/2),m=o[u];m!=null&&m<i?s=u:a=u}let l=o[s],c=o[a];l!=null&&c!=null?n=Math.abs(l-i)<Math.abs(c-i)?s:a:l!=null?n=s:c!=null&&(n=a);let g=n;for(let u=n;u>=0;u--){let m=!1;for(let b=1;b<e.data.length;b++){let v=e.data[b];if(v&&v[u]!=null){m=!0;break}}if(m){g=u;break}}let d=o[g];return d==null?[t,r]:[e.valToPos(d,"x"),r]},ir=(e,t)=>{let r=t.getPropertyValue("--ub-chart-font-color").trim(),i=t.getPropertyValue("--ub-chart-grid-color").trim(),o=e.axes?.[0],n=e.axes?.[1];return o&&(o.stroke=r,o.grid?o.grid.stroke=i:o.grid={stroke:i}),n&&(n.stroke=r,n.grid?n.grid.stroke=i:n.grid={stroke:i}),e},nr=(e,t)=>e.getPropertyValue(`--ub-chart-threshold-${t}`).trim()||e.getPropertyValue("--ub-chart-threshold-default").trim(),sr=(e,t)=>e.getPropertyValue(`--ub-chart-threshold-${t}-fill`).trim()||e.getPropertyValue("--ub-chart-threshold-default-fill").trim(),ar=e=>{switch(e){case"bold":return 2;case"line":return 1;case"dashed":return 1;default:return 1}},lr=e=>e==="line"?void 0:[5,5],cr=(e,t)=>{if(t){let r=[];return t.forEach(i=>{let o={label:i.label,stroke:nr(e,i.level),width:ar(),dash:lr(i.type),points:{show:!1,size:0},spanGaps:!0,show:!0,auto:!1};Y(i)||r.push(o),r.push(o)}),r}else return[]},ur=(e,t,r,i)=>{if(!i||!i.some(n=>re(n)))return t.bands;let o=i.map((n,s)=>Y(n)?null:{series:[e.length+s*2+1,e.length+s*2+2],fill:sr(r,n.level),dir:1}).filter(n=>n!==null);return[...t.bands,...o]},pr=(e,t,r,i,o,n,s)=>{let a=rr(t,i);return[{},...e.map((l,c)=>({label:l.metric,stroke:Xe(l,c,r,t,n),width:a,points:{show:!1},spanGaps:!0,paths:er(t),fill:i||o?tr(l,c,r,t,n):void 0})),...cr(n,s)]},mr=e=>{if(typeof e=="string"){let t=String(e).toLowerCase().trim();if(t==="by")return"bytes";if(t.startsWith("{")&&t.endsWith("}"))return"short"}return e},Ye=(e,t,r,i,o,n,s,a,l,c,g,d,h,u,m,b,v,f,x,C,y)=>{let T=window.getComputedStyle(e),R=T.fontFamily,k=e?.clientWidth??1050,S=e?.clientHeight??250,U=mr(i),w=Kt(U==="1"?null:U),O=I=>{let P=w(I);return P.text+(P.suffix?.trim()||"")},_={width:k,height:S,scales:{y:{range:Je(i,m,b)}},plugins:h?[]:[Ge(O,s,t,c,g,o,x,C,y)],padding:d?[8,10,8,48]:[8,10,8,18],cursor:{y:!1,sync:{key:"_"},drag:{setScale:!0,x:!0,y:!1},move:or,show:!f},series:pr(o,n,a,l,s,T,u),bands:ur(o,r,T,u),axes:[ze(R,c,d,v),Ze(w,R,v)],legend:{show:!1}};return ir(_,T)};var et=(e,t=4)=>{let r=e/t,i=Math.pow(10,Math.floor(Math.log10(r))),o=r/i,n;return o>5?n=10*i:o>2?n=5*i:o>1?n=2*i:n=i,Math.ceil(e/n)*n},L=(e,t)=>typeof e=="number"?e:t,Je=(e,t,r)=>(i,o,n)=>{if(o===0&&n===0)return[L(t,0),L(r,100)];let s=1,a=n*(1+s),l=o<0?o*(1+s):o*(1-s);if(e==="percent"||e==="percentunit"){let d=e==="percent"?100:1;return n>d?o<0?[L(t,l),L(r,a)]:[L(t,0),L(r,a)]:o<0?[L(t,l),L(r,d)]:[L(t,0),L(r,d)]}if(n<=.9999)return o<=0?[L(t,l),L(r,1)]:[L(t,0),L(r,1)];let c=et(a),g=et(Math.abs(l));return o<0?[L(r,-g),L(r,c)]:[L(t,0),L(r,c)]},dr=(e,t,r,i)=>{let o=e.axes[r];if(i>1)return o?._size||0;let n=(o?.ticks?.size||0)+(o?.gap||0),s=(t??[]).reduce((a,l)=>l.length>a.length?l:a,"");return s!=""&&(e.ctx.font=o?.font?.[0]??e.ctx.font,n+=e.ctx.measureText(s).width/devicePixelRatio),Math.ceil(n)};function Ze(e,t,r){return{gap:0,font:j(t),labelFont:j(t),grid:{show:!0,width:.5},ticks:{width:.5},values:(i,o)=>o.map(n=>{let s=e(n);return s.text+(s.suffix?.trim()||"")}),size:dr,space:(i,o,n,s,a)=>{let l=i.height;return l<=100?30:l<=150?35:l<=200?45:l<=250?55:l<=300?60:70},show:!r}}function tt(e,t){let r=[],i=e[0],o=i.length,n=Array(o).fill(0),s=[i];if(e.forEach((a,l)=>{l!==0&&(t?s.push(a):s.push(a.map((c,g)=>n[g]=n[g]+(c||0))))}),!t)for(let a=1;a<e.length-1;a++)r.push({series:[a+1,a]});return{data:s,bands:r.filter(a=>a.series[1]>-1)}}import{jsx as br}from"react/jsx-runtime";function ke(e){let{times:t,series:r,metadata:i,type:o,className:n,timeZone:s,options:a,tooltip:l,colors:c,tooltipComponent:g,unit:d,fill:h,thresholds:u,min:m,max:b,hideAxis:v,hideCursor:f,relativeTimeAxis:x,invertSort:C,disableSuggestedLabel:y}=e,{hide:T,visibilityLimit:R}=l||{},k=hr(null),S=V(),U=typeof x=="boolean"?x:S.relativeTimeAxis,w=c??S.colors,O=typeof h=="boolean"?h:S.fill||!1,_=typeof C=="boolean"?C:S.invertSort,I=typeof y=="boolean"?y:S.disableSuggestedLabel,P=typeof v=="boolean"?v:S.hideAxis,z=typeof f=="boolean"?f:S.hideCursor,se=typeof R=="boolean"?R:S.tooltip?.visibilityLimit,q=typeof T=="boolean"?T:S.tooltip?.hide;return fr(()=>{if(!r||r.length===0){console.warn("No series provided");return}let G=[t],ae=d;r.forEach(N=>{let Z=i[N.metric];d||(ae=Ke(ae,Z)),G.push(N.values)});let we=o==="bar"||o==="area",K=tt(G,!we);u&&u.forEach(N=>{Y(N)?K.data.push(new Array(t.length).fill(N.value)):re(N)&&(K.data.push(new Array(t.length).fill(N.from)),K.data.push(new Array(t.length).fill(N.to)))});let H=k.current,le=null;if(H){let N=Ye(H,i,K,ae,r,o,we,w,O,s,g,U,q,u,m,b,P,z,se,_,I);le=new gr({...N,...a},K.data,H);let Z=new ResizeObserver(()=>{le?.setSize({width:H.clientWidth,height:H.clientHeight})});return Z.observe(H),()=>{le?.destroy(),Z.disconnect()}}},[r,t,o,i,s,g,U,w,O,d,q,u,m,b,a,P,z,_,se,I]),br("div",{ref:k,className:"ub-chart-container"+(n?` ${n}`:"")})}import{jsx as B}from"react/jsx-runtime";function Tr({metrics:e,operator:t,attributes:r,groupBy:i,interval:o,type:n="line",className:s,appearance:a,tooltip:l,onResponse:c,...g}){let d=V(),h=o??d.interval,u=r??d.attributes,m=i??d.groupBy,b=t??d.operator,v=a?.components?.Tooltip??d.appearance.components.Tooltip,f=Ae(()=>({hide:l?.hide??d.tooltip?.hide,visibilityLimit:l?.visibilityLimit??d.tooltip?.visibilityLimit}),[l?.hide,d.tooltip?.hide,l?.visibilityLimit,d.tooltip?.visibilityLimit]),{queries:x,metadataLabels:C}=Ae(()=>{let P=Array.isArray(e)?e:[e],z={};return{queries:P.map(q=>{let G=he(q)?q.name:q;return he(q)&&(z[G]=q.label),{metrics:[G],operator:b,attributes:u,groupBy:m}}),metadataLabels:z}},[e,b,u,m]),y=fe({queries:x,timeRange:d.timeRange,startTime:d.startTime,endTime:d.endTime,interval:h}),{isLoading:T,data:R,hasError:k}=y,{series:S,times:U,metadata:w}=R,O=S.every(P=>P.isEmpty),_=Ae(()=>Object.keys(C).length===0?w:Object.fromEntries(Object.entries(w).map(([P,z])=>[P,{...z,label:C[P]??z.suggestedLabel??P}])),[C,w]),I=`ub-chart-container${s?` ${s}`:""}`;if(yr(()=>{c&&c(y)},[y,c]),T){let P=a?.components?.Loading??d.appearance.components.Loading;return B("div",{className:I,children:B(P,{})})}if(k){let P=a?.components?.Error??d.appearance.components.Error;return B("div",{className:I,children:B(P,{})})}if(O){let P=a?.components?.Empty??d.appearance.components.Empty;return B("div",{className:I,children:B(P,{})})}return B(ke,{times:U,series:S,metadata:_,type:n,className:s,tooltip:f,tooltipComponent:v,...g})}export{ke as Chart,ue as Empty,pe as Error,me as Loading,te as Scope,Tr as Timeseries,pt as UnblindProvider,St as useLogs,dt as useMetrics,De as useRefresh,V as useScope,fe as useTimeseries,vt as useUsage};
2
2
  //# sourceMappingURL=index.mjs.map