@unblind/react 0.1.0-alpha.2 → 0.1.0-alpha.20

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