@unblind/react 0.1.0-alpha.15 → 0.1.0-alpha.16

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 ue,QueryClientProvider as Ve,useQueryClient as ze}from"@tanstack/react-query";import{createContext as Oe,useCallback as Fe,useContext as Be,useMemo as ce}from"react";import{jsx as pe}from"react/jsx-runtime";var me=Oe(void 0);function de({children:e,queryClient:t,queryClientConfig:r,apiBaseUrl:i="/api/unblind",fetchImpl:o}){let n=ce(()=>{if(t)return t;let a={refetchOnWindowFocus:!1,refetchOnReconnect:!1,refetchOnMount:!1},u={defaultOptions:{queries:a}};return r?new ue({...r,defaultOptions:{...r.defaultOptions,queries:{...a,...r.defaultOptions?.queries}}}):new ue(u)},[t,r]),s=ce(()=>({apiBaseUrl:i,fetchImpl:o}),[i,o]);return pe(Ve,{client:n,children:pe(me.Provider,{value:s,children:e})})}function D(){let e=Be(me);if(!e)throw new Error("useUnblindConfig must be used within an UnblindClientProvider. Please wrap your app or component tree with <UnblindClientProvider>.");return e}function he(){let e=ze();return Fe(async()=>{await e.refetchQueries({queryKey:["unblind","timeseries"]})},[e])}import{createContext as qe,useContext as fe,useMemo as Q}from"react";import{jsx as F,jsxs as Ke}from"react/jsx-runtime";function te(){return F("div",{className:"ub-default",children:Ke("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 re(){return F("div",{className:"ub-error"})}function oe(){return F("div",{className:"ub-default","data-text":"Loading"})}import{jsx as _e}from"react/jsx-runtime";var ie=qe(void 0);function ne({children:e,timeRange:t,startTime:r,endTime:i,interval:o,attributes:n,groupBy:s,operator:a,appearance:u,tooltip:c,colors:m,fill:f,sortByValues:d}){let l=fe(ie),h=u?.components?.Loading||l?.appearance?.components?.Loading,b=u?.components?.Error||l?.appearance?.components?.Error,p=u?.components?.Tooltip||l?.appearance?.components?.Tooltip,g=u?.components?.Empty||l?.appearance?.components?.Empty,T=c?.layout||l?.tooltip?.layout,y=c?.format||l?.tooltip?.format,x=typeof c?.hideAttributes=="boolean"?c?.hideAttributes:l?.tooltip?.hideAttributes,C=typeof c?.hideAttributeKey=="boolean"?c?.hideAttributeKey:l?.tooltip?.hideAttributeKey,v=typeof c?.hideMetric=="boolean"?c?.hideMetric:l?.tooltip?.hideMetric,A=Q(()=>({components:{...h&&{Loading:h},...b&&{Error:b},...p&&{Tooltip:p},...g&&{Empty:g}}}),[h,b,p,g]),R=Q(()=>({layout:T,format:y,hideAttributes:x,hideAttributeKey:C,hideMetric:v}),[T,y,x,C,v]),k=Q(()=>({timeRange:t??l?.timeRange,startTime:r??l?.startTime,endTime:i??l?.endTime,interval:o??l?.interval,attributes:n??l?.attributes,groupBy:s??l?.groupBy,operator:a??l?.operator,colors:m??l?.colors,sortByValues:typeof d=="boolean"?d:l?.sortByValues,fill:f??l?.fill,appearance:A,tooltip:R}),[t,r,i,o,n,s,a,m,d,f,A,R,l]);return _e(ie.Provider,{value:k,children:e})}var He="6h";function q(){let e=fe(ie);return Q(()=>({timeRange:e?.timeRange||He,...e,appearance:{components:{Loading:e?.appearance?.components?.Loading??oe,Error:e?.appearance?.components?.Error??re,Empty:e?.appearance?.components?.Empty??te,Tooltip:e?.appearance?.components?.Tooltip}}}),[e])}import{jsx as ge}from"react/jsx-runtime";function Ge({children:e,queryClient:t,apiBaseUrl:r,fetchImpl:i,timeRange:o,startTime:n,endTime:s,interval:a,attributes:u,groupBy:c,operator:m,appearance:f,tooltip:d,colors:l,sortByValues:h}){return ge(de,{queryClient:t,apiBaseUrl:r,fetchImpl:i,children:ge(ne,{timeRange:o,startTime:n,endTime:s,interval:a,attributes:u,groupBy:c,operator:m,appearance:f,tooltip:d,colors:l,sortByValues:h,children:e})})}import{useQuery as $e}from"@tanstack/react-query";function je(){let{apiBaseUrl:e,fetchImpl:t=fetch}=D(),r=$e({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 Xe}from"@tanstack/react-query";import{useMemo as $}from"react";import Qe from"ms";function We(e){let t=Math.floor(Date.now()/1e3);return[t-Math.floor(Qe(e)/1e3),t]}function H(e,t,r){let i,o;if(typeof t=="number"&&typeof r=="number")i=t,o=r;else if(e){let[n,s]=We(e);i=n,o=s}else throw new Error("Either timeRange or both startTime and endTime must be provided");return[i,o]}function ae({queries:e,timeRange:t,startTime:r,endTime:i,interval:o}){let{apiBaseUrl:n,fetchImpl:s=fetch}=D(),a=$(()=>e.map(y=>y.metrics.join(",")).join(","),[e]),u=$(()=>e.map(y=>{let x=y.attributes;if(!x)return"";let C=Object.keys(x);return C.length===0?"":C.map(v=>v+":"+x[v]?.join(",")).join(",")}).join(","),[e]),c=$(()=>e.map(y=>y.operator),[e]),m=$(()=>e.map(y=>y.groupBy).join(", "),[e]),d=Xe({queryKey:["unblind","timeseries",a,u,r,i,t,o,c,m],queryFn:async()=>{if(!a)throw new Error("Missing required parameters");if(a.length===0)throw new Error("No series provided");let[y,x]=H(t,r,i),C={queries:e,startTime:y,endTime:x,interval:o},v=await s(`${n}/tenants/timeseries`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(C)});if(!v.ok)throw new Error("Error fetching metric");let{series:A,times:R,metadata:k}=await v.json();if(!A)throw console.error("Series not found"),new Error("Series not found");return{series:A,times:R,metadata:k}},enabled:!!a&&(typeof r=="number"&&typeof i=="number"||!!t)}),{metadata:l,series:h,times:b}=$(()=>d.data?{series:d.data.series,times:d.data.times,metadata:d.data.metadata}:{series:[],times:[],metadata:{}},[d]),p=d.isLoading,g=d.isFetching,T=d.isError;return{data:{series:h,times:b,metadata:l},isLoading:p,isFetching:g,hasError:T,refetch:d.refetch}}import{useQuery as Ye}from"@tanstack/react-query";import{useMemo as Je}from"react";function Ze({timeRange:e,startTime:t,endTime:r}){let{apiBaseUrl:i,fetchImpl:o=fetch}=D(),s=Ye({queryKey:["unblind","usage",e,t,r],queryFn:async()=>{let[m,f]=H(e,t,r),d=`${i}/tenants/usage`,l=await o(d,{headers:{"Content-Type":"application/json"},body:JSON.stringify({startTime:m,endTime:f})});if(!l.ok)throw new Error("Error fetching usage");let{data:h}=await l.json();if(!h)throw new Error("usage not found");return h},enabled:typeof t=="number"&&typeof r=="number"||!!e}),a=Je(()=>s.data?s.data||[]:[],[s]),u=s.isLoading||s.isRefetching,c=s.isError;return{usage:a,isLoading:u,hasError:c,refetch:s.refetch}}import{useInfiniteQuery as et}from"@tanstack/react-query";import{useMemo as tt}from"react";function rt({timeRange:e,filters:t,startTime:r,endTime:i}){let{apiBaseUrl:o,fetchImpl:n=fetch}=D(),s=typeof r=="number"&&typeof i=="number"||!!e,a=et({queryKey:["unblind","logs",e,t.map(c=>c.name+":"+c.value).sort().join(",")],queryFn:async({pageParam:c})=>{let m=t.reduce((v,A)=>(v[A.name]||(v[A.name]=[]),v[A.name].push(A.value),v),{}),{body:f=[],severity:d=[],"service.name":l=[],"trace.id":h=[],"span.id":b=[],...p}=m,[g,T]=H(e,r,i),y=await n(`${o}/tenants/logs`,{method:"POST",body:JSON.stringify({filter:{attributes:p,body:f,severity:d,traceId:h,spanId:b,service:l},startTime:g,endTime:T,pagination:{page:c}}),headers:{"Content-Type":"application/json"}});if(!y.ok)throw new Error("Error fetching logs");let{data:x,next_page:C}=await y.json();if(!x)throw new Error("logs not found");return{data:x,next_page:C}},enabled:s,initialPageParam:void 0,getNextPageParam:c=>c.next_page});return{logs:tt(()=>a.data?a.data.pages.flatMap(c=>c.data||[]):[],[a.data]),isLoading:a.isLoading,hasError:a.isError,hasNextPage:a.hasNextPage??!1,fetchNextPage:a.fetchNextPage,isFetchingNextPage:a.isFetchingNextPage,refetch:a.refetch}}import{useMemo as $t}from"react";import{useEffect as qt,useRef as Ht}from"react";import _t from"uplot";var W=e=>"value"in e,j=e=>"from"in e&&"to"in e;import J from"uplot";import{getValueFormat as kt}from"@unblind/units";import{dateTimeFormat as ot,dateTimeFormatTimeAgo as it,systemDateFormats as X}from"@unblind/units";var S={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 nt(e,t,r,i){if(t>7*S.day){let o=X.interval.year,n=Math.round(S.year/S.day)*S.day;return Math.round(t/S.day)*S.day===n?o=X.interval.year:t<=S.year?o=X.interval.month:o=X.interval.day,e.map(a=>ot(a,{format:o,timeZone:i}))}return e.map(o=>{let n=new Date(o),s=t<S.minute,a=t<S.second,u=n.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1,timeZone:i});return(u==="00:00"||u==="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 be(e){let t=[{size:S.second/1e3,increments:_.second},{size:S.minute/1e3,increments:_.minute},{size:S.hour/1e3,increments:_.hour},{size:S.day/1e3,increments:_.day},{size:S.month/1e3,increments:_.month},{size:S.year/1e3,increments:_.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 st(e,t,r,i){let o=r-t,n=e.width,s=Math.floor(n/100),a=o/s,{increment:u,multiplier:c}=be(a),m=u/1e3,f=[];if(o<12*3600){let l=Math.ceil(t/m)*m;for(;l<=r;l+=m)f.push(l);return f}if(o<3*86400){if(u>=6*3600*1e3){let h=u/1e3/3600,b=new Date(t*1e3);if(i==="UTC"){let g=b.getUTCHours(),T=Math.floor(g/h)*h;b.setUTCHours(T,0,0,0)}else{let g=b.getHours(),T=Math.floor(g/h)*h;b.setHours(T,0,0,0)}let p=b.getTime()/1e3;for(p<t&&(p+=m);p<=r;)f.push(p),p+=m;return f}let l=Math.ceil(t/m)*m;for(;l<=r;l+=m)f.push(l);return f}if(u>=S.day){let l=new Date(t*1e3);i==="UTC"?(l.setUTCHours(0,0,0,0),l.getTime()/1e3<t&&l.setUTCDate(l.getUTCDate()+c)):(l.setHours(0,0,0,0),l.getTime()/1e3<t&&l.setDate(l.getDate()+c));let h=l.getTime()/1e3;for(;h<=r;)f.push(h),i==="UTC"?l.setUTCDate(l.getUTCDate()+c):l.setDate(l.getDate()+c),h=l.getTime()/1e3;return f}let d=Math.ceil(t/m)*m;for(;d<=r;d+=m)f.push(d);return f}function lt(e,t,r){return t.length===0?[]:t.map((i,o)=>o===0||o===t.length-1?it(i*1e3,{timeZone:r}):"")}function ut(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}=be(s),u=t.map(c=>c*1e3);return nt(u,a,o,r)}function ye(e,t,r=!1){let i=r?(n,s,a,u)=>at(n,a,u):(n,s,a,u)=>st(n,a,u,t),o=r?(n,s)=>lt(n,s,t):(n,s)=>ut(n,s,t);return{font:G(e),labelFont:G(e),grid:{show:!1,width:.5},ticks:{width:.5},splits:i,values:o,size:20}}import{computePosition as ct,flip as pt,offset as mt}from"@floating-ui/dom";import{createRoot as dt}from"react-dom/client";var ht=4,ft=8,se=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 ct({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:[mt({mainAxis:ht,crossAxis:ft}),pt()]});r.style.left=`${i}px`,r.style.top=`${o}px`}}},E=new se;import{dateTimeFormat as Te}from"@unblind/units";import{useMemo as ve}from"react";import{jsx as P,jsxs as O}from"react/jsx-runtime";function ke(e){return e.metric.displayName||e.metric.name||(typeof e.serie.label=="string"?e.serie.label:e.serie.label?.textContent||"Unknown")}function xe(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 Ce(e){return[...e].sort((t,r)=>(Number(r.value)||0)-(Number(t.value)||0))}function Pe(e){return[...e].sort((t,r)=>xe(t).localeCompare(xe(r)))}function gt(e){let t={};return e.forEach(r=>{let i=ke(r);t[i]||(t[i]=[]),t[i].push(r)}),t}function bt(e,t,r,i="original"){if(r==="flat")return[{label:"",items:t?Ce(e):Pe(e)}];let o=gt(e);return Object.keys(o).sort((s,a)=>s.localeCompare(a)).map(s=>{let a=o[s];if(!a)return{label:Y(s,i),items:[]};let u=t?Ce(a):Pe(a);return{label:Y(s,i),items:u}})}function Y(e,t,r){switch(t){case"suffix":{let i=e.split(/[._-]/),o=i[i.length-1]||"";return r?o:o.charAt(0).toUpperCase()+o.slice(1).toLowerCase()}case"title":return e.split(/[._-]/).map(i=>r?i:i.charAt(0).toUpperCase()+i.slice(1).toLowerCase()).join(" ");default:return e}}function yt(e,t){if(t&&t!=="auto")return t;let r=e.some(o=>o.attributes&&Object.keys(o.attributes).length>0),i=new Set(e.map(ke));return r&&i.size>=1?"group-by-metric":"flat"}function Ae({hideAttributeKey:e,attribute:t,format:r,isLastAttribute:i}){let[o,n]=t;return O("div",{className:"ub-tooltip-item-attribute-container",children:[O("div",{className:e?"ub-tooltip-item-hidden-attribute-key":"ub-tooltip-item-attribute-with-key",children:[!e&&O("span",{className:"ub-tooltip-item-attribute-key",children:[Y(o,r),":"]}),P("span",{className:"ub-tooltip-item-attribute-value",children:n})]}),!i&&e&&P("span",{"data-text":", ",className:"ub-tooltip-item-attribute-divider"})]})}function Tt({item:e,hideMetric:t,hideAttributeKey:r,hideAttributes:i,format:o}){let s=Object.entries(e.attributes||{}),a=s.length>0&&!i;return i&&t&&console.warn("Invalid configuration. Attributes and metrics are hidden."),O("div",{className:"ub-tooltip-item-row",children:[O("div",{className:"ub-tooltip-item-left"+(t?" ub-tooltip-item-hidden-metric":""),children:[O("div",{className:"ub-tooltip-item-heading",children:[P("span",{className:"ub-tooltip-item-dot",style:{backgroundColor:e.color}}),t?P("div",{className:"ub-tooltip-item-attributes",children:s.map((u,c)=>P(Ae,{hideAttributeKey:r,attribute:u,format:o,isLastAttribute:c>=s.length-1},"attr_"+u[0]))}):P("span",{className:a?"ub-tooltip-item-metric-name-label":"ub-tooltip-item-metric-name",children:Y(e.metric.name,o)})]}),a&&!t&&P("div",{className:"ub-tooltip-item-attributes",children:s.map((u,c)=>P(Ae,{hideAttributeKey:r,attribute:u,format:o,isLastAttribute:c>=s.length-1},"attr_"+u[0]))})]}),P("div",{className:"ub-tooltip-item-value",children:e.formattedValue??P("span",{className:"ub-tooltip-item-value--empty",children:"\u2014"})})]})}function vt({className:e="ub-tooltip-divider",...t}){return P("hr",{role:"presentation",...t,className:e})}function xt({group:e,groupIdx:t,hideAttributeKey:r,hideMetric:i,hideAttributes:o,format:n,hideGroupLabel:s}){return O("div",{className:"ub-tooltip-group",children:[!s&&P("div",{className:`ub-tooltip-group-header${t>0?" ub-tooltip-group-header--separator":""}`,children:e.label}),P("div",{className:"ub-tooltip-items",children:e.items.map((a,u)=>P(Tt,{item:a,format:n,hideAttributeKey:r,hideMetric:i,hideAttributes:o},`item-${t}-${u}`))})]},e.label)}function we({timestamp:e,items:t,timeZone:r,spansMultipleDays:i,sortByValues:o,format:n="original",layout:s="flat",hideAttributeKey:a,hideMetric:u,hideAttributes:c}){let m=i?Te(e*1e3,{format:"MMM DD, HH:mm",timeZone:r}):Te(e*1e3,{format:"HH:mm",timeZone:r}),f=ve(()=>yt(t,s),[t,s]),d=f==="flat",h=typeof u=="boolean"?u:f==="group-by-metric",b=typeof a=="boolean"?a:!1,p=typeof c=="boolean"?c:!1,g=ve(()=>bt(t,o,f,n),[t,o,f,n]);return O("div",{className:"ub-tooltip",children:[P("div",{className:"ub-tooltip-datetime",children:m}),P(vt,{}),g.length>0?P("div",{className:"ub-tooltip-content",children:g.map((T,y)=>P(xt,{group:T,groupIdx:y,hideAttributeKey:b,hideMetric:h,hideAttributes:p,hideGroupLabel:d,format:n},T.label))}):P("div",{className:"ub-tooltip-no-data",children:"No data available"})]})}import{jsx as Se}from"react/jsx-runtime";function Ct(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 Pt(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 At(e,t,r,i,o,n){let s=!1,a=[];for(let u=1;u<e.series.length;u++){let c=e.data[u]?.[t]??null;if(i&&c!=null&&u>1){let p=e.data[u-1]?.[t]??0;c=c-p}let m=e.series[u],f=n?.[u-1];if(!f){console.warn("Original serie not found");continue}let d=o[f.metric];if(!d){console.warn("Metric metadata not found");continue}let l=m?.stroke,h=typeof l=="function"?l(e,u):l??"#ffffff00",b=c==null?void 0:r?r(c):String(c);f?.attributes&&Object.keys(f?.attributes).length>0&&(s=!0),a.push({metric:d,color:h,value:c===null?void 0:c,formattedValue:b,attributes:f?.attributes,serie:m})}return{items:a,hasAttributes:s}}function Re(e,t,r,i,o,n,s,a,u,c,m,f){let d,l,h,b=!1;function p(){let g=d.getBoundingClientRect();l=g.left,h=g.top}return{hooks:{init:g=>{E.initialize(),d=g.over,window.addEventListener("scroll",p,!0),window.addEventListener("resize",p),d.onmouseenter=()=>{b=!0,E.show()},d.onmouseleave=()=>{b=!1,E.getRenderedUplot()===g&&E.hide(g)},p()},setSize:()=>{p()},setCursor:g=>{let{left:T,top:y,idx:x}=g.cursor;if(!b||x==null){E.getRenderedUplot()===g&&E.hide(g);return}let v=g.data[0],A=Ct(v,o),R=Pt(g,x),k=g.data[0][R];if(k===void 0)return;let{items:M}=At(g,R,e,t,r,s);E.show();let N=n,V=N?Se(N,{timestamp:k,items:M,timeZone:o}):Se(we,{timestamp:k,items:M,timeZone:o,spansMultipleDays:A,stacked:t,sortByValues:i,layout:a,format:u,hideAttributeKey:c,hideAttributes:m,hideMetric:f});E.render(g,V),E.positionTooltip({left:(T||0)+l,top:(y||0)+h})},destroy(g){window.removeEventListener("scroll",p,!0),window.removeEventListener("resize",p),d&&(d.onmouseenter=null,d.onmouseleave=null),E.getRenderedUplot()===g&&E.hide(g)}}}}var Z=["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)"],G=e=>`${getComputedStyle(document.documentElement).getPropertyValue("--ub-chart-font-size").trim()} ${e}`,Le=(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 wt(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)&&Array.isArray(e.fill)&&Array.isArray(e.border)}function St(e){return Array.isArray(e)}var Ue=(e,t,r,i,o,n)=>{if(r)return St(r)?r[t]:wt(r)?n?r.fill[t]:r.border[t]:r(e,t,i,n);let s=n?`--ub-chart-serie-color-fill-${t+1}`:`--ub-chart-serie-color-${t+1}`,a=o.getPropertyValue(s).trim();return a||(n&&(i==="step"||i==="line"||i==="spline")?`oklch(from ${Z[t%Z.length]} l c h / 0.4)`:Z[t%Z.length])},Rt=e=>{let t=J.paths.bars({size:[.6,100],radius:0,gap:0}),r=J.paths.linear({alignGaps:0}),i=J.paths.spline({alignGaps:1}),o=J.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}},Lt=(e,t,r,i,o)=>Ue(e,t,r,i,o,!0),Ut=(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,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 l=Math.floor((s+a)/2),h=o[l];h!=null&&h<i?s=l:a=l}let u=o[s],c=o[a];u!=null&&c!=null?n=Math.abs(u-i)<Math.abs(c-i)?s:a:u!=null?n=s:c!=null&&(n=a);let m=n;for(let l=n;l>=0;l--){let h=!1;for(let b=1;b<e.data.length;b++){let p=e.data[b];if(p&&p[l]!=null){h=!0;break}}if(h){m=l;break}}let f=o[m];return f==null?[t,r]:[e.valToPos(f,"x"),r]},Mt=(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},Nt=(e,t)=>e.getPropertyValue(`--ub-chart-threshold-${t}`).trim()||e.getPropertyValue("--ub-chart-threshold-default").trim(),It=(e,t)=>e.getPropertyValue(`--ub-chart-threshold-${t}-fill`).trim()||e.getPropertyValue("--ub-chart-threshold-default-fill").trim(),Dt=e=>{switch(e){case"bold":return 2;case"line":return 1;case"dashed":return 1;default:return 1}},Vt=e=>e==="line"?void 0:[5,5],zt=(e,t)=>{if(t){let r=[];return t.forEach(i=>{let o={label:i.label,stroke:Nt(e,i.level),width:Dt(),dash:Vt(i.type),points:{show:!1,size:0},spanGaps:!0,show:!0,auto:!1};W(i)||r.push(o),r.push(o)}),r}else return[]},Ot=(e,t,r,i)=>{if(!i||!i.some(n=>j(n)))return t.bands;let o=i.map((n,s)=>j(n)?{series:[e.length+s*2+1,e.length+s*2+2],fill:It(r,n.level),dir:1}:null).filter(n=>n!==null);return[...t.bands,...o]},Ft=(e,t,r,i,o,n,s)=>{let a=Ut(t,i);return[{},...e.map((u,c)=>({label:u.metric,stroke:Ue(u,c,r,t,n),width:a,points:{show:!1},spanGaps:!0,paths:Rt(t),fill:i||o?Lt(u,c,r,t,n):void 0})),...zt(n,s)]},Bt=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},Ee=(e,t,r,i,o,n,s,a,u,c,m,f,d,l,h,b,p,g,T,y,x)=>{let C=window.getComputedStyle(e),v=C.fontFamily,A=e?.clientWidth??1050,R=e?.clientHeight??250,k=Bt(i),M=kt(k==="1"?null:k),N=L=>{let z=M(L,Number.isInteger(L)?0:2);return z.text+(z.suffix?.trim()||"")},V={width:A,height:R,scales:{y:{range:Me(i,y,x)}},plugins:[Re(N,s,t,c,m,f,o,h,l,b,p,g)],padding:d?[10,15,10,15]:[8,15,8,15],cursor:{y:!1,sync:{key:"_"},drag:{setScale:!0,x:!0,y:!1},move:Et},series:Ft(o,n,a,u,s,C,T),bands:Ot(o,r,C,T),axes:[ye(v,m,d),Ne(M,v)],legend:{show:!1}};return Mt(V,C)};var Ie=(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},w=(e,t)=>typeof e=="number"?e:t,Me=(e,t,r)=>(i,o,n)=>{if(o===0&&n===0)return[w(t,0),w(r,100)];let s=1,a=n*(1+s),u=o<0?o*(1+s):o*(1-s);if(e==="percent"||e==="percentunit")return n>100?o<0?[w(t,u),w(r,a)]:[w(t,0),w(r,a)]:o<0?[w(t,u),w(r,100)]:[w(t,0),w(r,100)];if(n<=.9999)return o<=0?[w(t,u),w(r,1)]:[w(t,0),w(r,1)];let c=Ie(a),m=Ie(Math.abs(u));return o<0?[w(r,-m),w(r,c)]:[w(t,0),w(r,c)]},Kt=(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,u)=>u.length>a.length?u:a,"");return s!=""&&(e.ctx.font=o?.font?.[0]??e.ctx.font,n+=e.ctx.measureText(s).width/devicePixelRatio),Math.ceil(n)};function Ne(e,t){return{gap:0,font:G(t),labelFont:G(t),grid:{show:!0,width:.5},ticks:{width:.5},values:(r,i)=>i.map(o=>{let n=e(o);return n.text+(n.suffix?.trim()||"")}),size:Kt,space:60}}function De(e,t){let r=[],i=e[0],o=i.length,n=Array(o).fill(0),s=[i];return e.forEach((a,u)=>{u!==0&&(t?s.push(a):s.push(a.map((c,m)=>n[m]=n[m]+(c||0))))}),e.forEach((a,u)=>{u===0||t||r.push({series:[e.findIndex((c,m)=>m>u),u]})}),{data:s,bands:r.filter(a=>a.series[1]>-1)}}import{jsx as Gt}from"react/jsx-runtime";function le(e){let{times:t,series:r,metadata:i,type:o,className:n,timeZone:s,options:a,tooltip:u,colors:c,tooltipComponent:m,sortByValues:f=!1,unit:d,fill:l=!1,thresholds:h,min:b,max:p}=e,{layout:g,format:T,hideAttributeKey:y,hideAttributes:x,hideMetric:C}=u||{},v=Ht(null),A=q(),R=c||A.colors;return qt(()=>{if(!r||r.length===0){console.warn("No series provided");return}let k=[t],M=d;r.forEach(U=>{let K=i[U.metric];d||(M=Le(M,K)),k.push(U.values)}),h&&h.forEach(U=>{W(U)?k.push(new Array(t.length).fill(U.value)):j(U)&&(k.push(new Array(t.length).fill(U.from)),k.push(new Array(t.length).fill(U.to)))});let N=o==="bar"||o==="area",V=De(k,!N),L=v.current,z=null;if(L){let U=Ee(L,i,V,M,r,o,N,R,l,f,s,m,!1,T,g,y,x,C,h,b,p);z=new _t({...U,...a},V.data,L);let K=new ResizeObserver(()=>{z?.setSize({width:L.clientWidth,height:L.clientHeight})});return K.observe(L),()=>{z?.destroy(),K.disconnect()}}},[r,t,o,i,s,m,R,l,f,d,T,g,y,x,C,h,b,p,a]),Gt("div",{ref:v,className:"ub-chart-container"+(n?` ${n}`:"")})}import{jsx as B}from"react/jsx-runtime";function jt({metrics:e,operator:t,attributes:r,groupBy:i,interval:o,type:n="line",className:s,appearance:a,unit:u,thresholds:c,min:m,max:f,colors:d,tooltip:l,sortByValues:h,fill:b}){let p=q(),g=o??p.interval,T=r??p.attributes,y=i??p.groupBy,x=t??p.operator,C=d??p.colors,v=typeof h=="boolean"?h:p.sortByValues,A=typeof b=="boolean"?b:p.fill,R=a?.components?.Tooltip??p.appearance.components.Tooltip,k=$t(()=>({layout:l?.layout??p.tooltip?.layout,format:l?.format??p.tooltip?.format,hideAttributes:l?.hideAttributes??p.tooltip?.hideAttributes,hideAttributeKey:l?.hideAttributeKey??p.tooltip?.hideAttributeKey,hideMetric:l?.hideMetric??p.tooltip?.hideMetric}),[l?.layout,l?.format,l?.hideAttributes,l?.hideAttributeKey,l?.hideMetric,p.tooltip?.layout,p.tooltip?.format,p.tooltip?.hideAttributes,p.tooltip?.hideAttributeKey,p.tooltip?.hideMetric]),{isLoading:M,data:N,hasError:V}=ae({queries:(Array.isArray(e)?e:[e]).map(I=>({metrics:[I],operator:x,attributes:T,groupBy:y})),timeRange:p.timeRange,startTime:p.startTime,endTime:p.endTime,interval:g}),{series:L,times:z,metadata:U}=N,K=L.every(I=>I.isEmpty),ee=`ub-chart-container${s?` ${s}`:""}`;if(M){let I=a?.components?.Loading??p.appearance.components.Loading;return B("div",{className:ee,children:B(I,{})})}if(K){let I=a?.components?.Empty??p.appearance.components.Empty;return B("div",{className:ee,children:B(I,{})})}if(V){let I=a?.components?.Error??p.appearance.components.Error;return B("div",{className:ee,children:B(I,{})})}return B(le,{times:z,series:L,metadata:U,type:n,className:s,tooltip:k,colors:C,sortByValues:v,unit:u,fill:A,tooltipComponent:R,thresholds:c,min:m,max:f})}export{le as Chart,te as Empty,re as Error,oe as Loading,ne as Scope,jt as Timeseries,Ge as UnblindProvider,rt as useLogs,je as useMetrics,he as useRefresh,q as useScope,ae as useTimeseries,Ze as useUsage};
1
+ import{QueryClient as ue,QueryClientProvider as Ve,useQueryClient as ze}from"@tanstack/react-query";import{createContext as Oe,useCallback as Fe,useContext as Be,useMemo as ce}from"react";import{jsx as pe}from"react/jsx-runtime";var me=Oe(void 0);function de({children:e,queryClient:t,queryClientConfig:r,apiBaseUrl:i="/api/unblind",fetchImpl:o}){let n=ce(()=>{if(t)return t;let a={refetchOnWindowFocus:!1,refetchOnReconnect:!1,refetchOnMount:!1},u={defaultOptions:{queries:a}};return r?new ue({...r,defaultOptions:{...r.defaultOptions,queries:{...a,...r.defaultOptions?.queries}}}):new ue(u)},[t,r]),s=ce(()=>({apiBaseUrl:i,fetchImpl:o}),[i,o]);return pe(Ve,{client:n,children:pe(me.Provider,{value:s,children:e})})}function D(){let e=Be(me);if(!e)throw new Error("useUnblindConfig must be used within an UnblindClientProvider. Please wrap your app or component tree with <UnblindClientProvider>.");return e}function he(){let e=ze();return Fe(async()=>{await e.refetchQueries({queryKey:["unblind","timeseries"]})},[e])}import{createContext as qe,useContext as fe,useMemo as Q}from"react";import{jsx as F,jsxs as Ke}from"react/jsx-runtime";function te(){return F("div",{className:"ub-default",children:Ke("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 re(){return F("div",{className:"ub-error"})}function oe(){return F("div",{className:"ub-default","data-text":"Loading"})}import{jsx as _e}from"react/jsx-runtime";var ie=qe(void 0);function ne({children:e,timeRange:t,startTime:r,endTime:i,interval:o,attributes:n,groupBy:s,operator:a,appearance:u,tooltip:c,colors:m,fill:h,sortByValues:d}){let l=fe(ie),f=u?.components?.Loading||l?.appearance?.components?.Loading,b=u?.components?.Error||l?.appearance?.components?.Error,p=u?.components?.Tooltip||l?.appearance?.components?.Tooltip,g=u?.components?.Empty||l?.appearance?.components?.Empty,T=c?.layout||l?.tooltip?.layout,y=c?.format||l?.tooltip?.format,x=typeof c?.hideAttributes=="boolean"?c?.hideAttributes:l?.tooltip?.hideAttributes,C=typeof c?.hideAttributeKey=="boolean"?c?.hideAttributeKey:l?.tooltip?.hideAttributeKey,v=typeof c?.hideMetric=="boolean"?c?.hideMetric:l?.tooltip?.hideMetric,w=Q(()=>({components:{...f&&{Loading:f},...b&&{Error:b},...p&&{Tooltip:p},...g&&{Empty:g}}}),[f,b,p,g]),R=Q(()=>({layout:T,format:y,hideAttributes:x,hideAttributeKey:C,hideMetric:v}),[T,y,x,C,v]),A=Q(()=>({timeRange:t??l?.timeRange,startTime:r??l?.startTime,endTime:i??l?.endTime,interval:o??l?.interval,attributes:n??l?.attributes,groupBy:s??l?.groupBy,operator:a??l?.operator,colors:m??l?.colors,sortByValues:typeof d=="boolean"?d:l?.sortByValues,fill:typeof h=="boolean"?h:l?.fill,appearance:w,tooltip:R}),[t,r,i,o,n,s,a,m,d,h,w,R,l]);return _e(ie.Provider,{value:A,children:e})}var He="6h";function q(){let e=fe(ie);return Q(()=>({timeRange:e?.timeRange||He,...e,appearance:{components:{Loading:e?.appearance?.components?.Loading??oe,Error:e?.appearance?.components?.Error??re,Empty:e?.appearance?.components?.Empty??te,Tooltip:e?.appearance?.components?.Tooltip}}}),[e])}import{jsx as ge}from"react/jsx-runtime";function Ge({children:e,queryClient:t,apiBaseUrl:r,fetchImpl:i,timeRange:o,startTime:n,endTime:s,interval:a,attributes:u,groupBy:c,operator:m,appearance:h,tooltip:d,colors:l,sortByValues:f}){return ge(de,{queryClient:t,apiBaseUrl:r,fetchImpl:i,children:ge(ne,{timeRange:o,startTime:n,endTime:s,interval:a,attributes:u,groupBy:c,operator:m,appearance:h,tooltip:d,colors:l,sortByValues:f,children:e})})}import{useQuery as $e}from"@tanstack/react-query";function je(){let{apiBaseUrl:e,fetchImpl:t=fetch}=D(),r=$e({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 Xe}from"@tanstack/react-query";import{useMemo as $}from"react";import Qe from"ms";function We(e){let t=Math.floor(Date.now()/1e3);return[t-Math.floor(Qe(e)/1e3),t]}function H(e,t,r){let i,o;if(typeof t=="number"&&typeof r=="number")i=t,o=r;else if(e){let[n,s]=We(e);i=n,o=s}else throw new Error("Either timeRange or both startTime and endTime must be provided");return[i,o]}function ae({queries:e,timeRange:t,startTime:r,endTime:i,interval:o}){let{apiBaseUrl:n,fetchImpl:s=fetch}=D(),a=$(()=>e.map(y=>y.metrics.join(",")).join(","),[e]),u=$(()=>e.map(y=>{let x=y.attributes;if(!x)return"";let C=Object.keys(x);return C.length===0?"":C.map(v=>v+":"+x[v]?.join(",")).join(",")}).join(","),[e]),c=$(()=>e.map(y=>y.operator),[e]),m=$(()=>e.map(y=>y.groupBy).join(", "),[e]),d=Xe({queryKey:["unblind","timeseries",a,u,r,i,t,o,c,m],queryFn:async()=>{if(!a)throw new Error("Missing required parameters");if(a.length===0)throw new Error("No series provided");let[y,x]=H(t,r,i),C={queries:e,startTime:y,endTime:x,interval:o},v=await s(`${n}/tenants/timeseries`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(C)});if(!v.ok)throw new Error("Error fetching metric");let{series:w,times:R,metadata:A}=await v.json();if(!w)throw console.error("Series not found"),new Error("Series not found");return{series:w,times:R,metadata:A}},enabled:!!a&&(typeof r=="number"&&typeof i=="number"||!!t)}),{metadata:l,series:f,times:b}=$(()=>d.data?{series:d.data.series,times:d.data.times,metadata:d.data.metadata}:{series:[],times:[],metadata:{}},[d]),p=d.isLoading,g=d.isFetching,T=d.isError;return{data:{series:f,times:b,metadata:l},isLoading:p,isFetching:g,hasError:T,refetch:d.refetch}}import{useQuery as Ye}from"@tanstack/react-query";import{useMemo as Je}from"react";function Ze({timeRange:e,startTime:t,endTime:r}){let{apiBaseUrl:i,fetchImpl:o=fetch}=D(),s=Ye({queryKey:["unblind","usage",e,t,r],queryFn:async()=>{let[m,h]=H(e,t,r),d=`${i}/tenants/usage`,l=await o(d,{headers:{"Content-Type":"application/json"},body:JSON.stringify({startTime:m,endTime:h})});if(!l.ok)throw new Error("Error fetching usage");let{data:f}=await l.json();if(!f)throw new Error("usage not found");return f},enabled:typeof t=="number"&&typeof r=="number"||!!e}),a=Je(()=>s.data?s.data||[]:[],[s]),u=s.isLoading||s.isRefetching,c=s.isError;return{usage:a,isLoading:u,hasError:c,refetch:s.refetch}}import{useInfiniteQuery as et}from"@tanstack/react-query";import{useMemo as tt}from"react";function rt({timeRange:e,filters:t,startTime:r,endTime:i}){let{apiBaseUrl:o,fetchImpl:n=fetch}=D(),s=typeof r=="number"&&typeof i=="number"||!!e,a=et({queryKey:["unblind","logs",e,t.map(c=>c.name+":"+c.value).sort().join(",")],queryFn:async({pageParam:c})=>{let m=t.reduce((v,w)=>(v[w.name]||(v[w.name]=[]),v[w.name].push(w.value),v),{}),{body:h=[],severity:d=[],"service.name":l=[],"trace.id":f=[],"span.id":b=[],...p}=m,[g,T]=H(e,r,i),y=await n(`${o}/tenants/logs`,{method:"POST",body:JSON.stringify({filter:{attributes:p,body:h,severity:d,traceId:f,spanId:b,service:l},startTime:g,endTime:T,pagination:{page:c}}),headers:{"Content-Type":"application/json"}});if(!y.ok)throw new Error("Error fetching logs");let{data:x,next_page:C}=await y.json();if(!x)throw new Error("logs not found");return{data:x,next_page:C}},enabled:s,initialPageParam:void 0,getNextPageParam:c=>c.next_page});return{logs:tt(()=>a.data?a.data.pages.flatMap(c=>c.data||[]):[],[a.data]),isLoading:a.isLoading,hasError:a.isError,hasNextPage:a.hasNextPage??!1,fetchNextPage:a.fetchNextPage,isFetchingNextPage:a.isFetchingNextPage,refetch:a.refetch}}import{useMemo as $t}from"react";import{useEffect as qt,useRef as Ht}from"react";import _t from"uplot";var W=e=>"value"in e,j=e=>"from"in e&&"to"in e;import J from"uplot";import{getValueFormat as At}from"@unblind/units";import{dateTimeFormat as ot,dateTimeFormatTimeAgo as it,systemDateFormats as X}from"@unblind/units";var S={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 nt(e,t,r,i){if(t>7*S.day){let o=X.interval.year,n=Math.round(S.year/S.day)*S.day;return Math.round(t/S.day)*S.day===n?o=X.interval.year:t<=S.year?o=X.interval.month:o=X.interval.day,e.map(a=>ot(a,{format:o,timeZone:i}))}return e.map(o=>{let n=new Date(o),s=t<S.minute,a=t<S.second,u=n.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit",hour12:!1,timeZone:i});return(u==="00:00"||u==="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 be(e){let t=[{size:S.second/1e3,increments:_.second},{size:S.minute/1e3,increments:_.minute},{size:S.hour/1e3,increments:_.hour},{size:S.day/1e3,increments:_.day},{size:S.month/1e3,increments:_.month},{size:S.year/1e3,increments:_.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 st(e,t,r,i){let o=r-t,n=e.width,s=Math.floor(n/100),a=o/s,{increment:u,multiplier:c}=be(a),m=u/1e3,h=[];if(o<12*3600){let l=Math.ceil(t/m)*m;for(;l<=r;l+=m)h.push(l);return h}if(o<3*86400){if(u>=6*3600*1e3){let f=u/1e3/3600,b=new Date(t*1e3);if(i==="UTC"){let g=b.getUTCHours(),T=Math.floor(g/f)*f;b.setUTCHours(T,0,0,0)}else{let g=b.getHours(),T=Math.floor(g/f)*f;b.setHours(T,0,0,0)}let p=b.getTime()/1e3;for(p<t&&(p+=m);p<=r;)h.push(p),p+=m;return h}let l=Math.ceil(t/m)*m;for(;l<=r;l+=m)h.push(l);return h}if(u>=S.day){let l=new Date(t*1e3);i==="UTC"?(l.setUTCHours(0,0,0,0),l.getTime()/1e3<t&&l.setUTCDate(l.getUTCDate()+c)):(l.setHours(0,0,0,0),l.getTime()/1e3<t&&l.setDate(l.getDate()+c));let f=l.getTime()/1e3;for(;f<=r;)h.push(f),i==="UTC"?l.setUTCDate(l.getUTCDate()+c):l.setDate(l.getDate()+c),f=l.getTime()/1e3;return h}let d=Math.ceil(t/m)*m;for(;d<=r;d+=m)h.push(d);return h}function lt(e,t,r){return t.length===0?[]:t.map((i,o)=>o===0||o===t.length-1?it(i*1e3,{timeZone:r}):"")}function ut(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}=be(s),u=t.map(c=>c*1e3);return nt(u,a,o,r)}function ye(e,t,r=!1){let i=r?(n,s,a,u)=>at(n,a,u):(n,s,a,u)=>st(n,a,u,t),o=r?(n,s)=>lt(n,s,t):(n,s)=>ut(n,s,t);return{font:G(e),labelFont:G(e),grid:{show:!1,width:.5},ticks:{width:.5},splits:i,values:o,size:20}}import{computePosition as ct,flip as pt,offset as mt}from"@floating-ui/dom";import{createRoot as dt}from"react-dom/client";var ht=4,ft=8,se=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 ct({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:[mt({mainAxis:ht,crossAxis:ft}),pt()]});r.style.left=`${i}px`,r.style.top=`${o}px`}}},E=new se;import{dateTimeFormat as Te}from"@unblind/units";import{useMemo as ve}from"react";import{jsx as P,jsxs as O}from"react/jsx-runtime";function Ae(e){return e.metric.displayName||e.metric.name||(typeof e.serie.label=="string"?e.serie.label:e.serie.label?.textContent||"Unknown")}function xe(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 Ce(e){return[...e].sort((t,r)=>(Number(r.value)||0)-(Number(t.value)||0))}function Pe(e){return[...e].sort((t,r)=>xe(t).localeCompare(xe(r)))}function gt(e){let t={};return e.forEach(r=>{let i=Ae(r);t[i]||(t[i]=[]),t[i].push(r)}),t}function bt(e,t,r,i="original"){if(r==="flat")return[{label:"",items:t?Ce(e):Pe(e)}];let o=gt(e);return Object.keys(o).sort((s,a)=>s.localeCompare(a)).map(s=>{let a=o[s];if(!a)return{label:Y(s,i),items:[]};let u=t?Ce(a):Pe(a);return{label:Y(s,i),items:u}})}function Y(e,t,r){switch(t){case"suffix":{let i=e.split(/[._-]/),o=i[i.length-1]||"";return r?o:o.charAt(0).toUpperCase()+o.slice(1).toLowerCase()}case"title":return e.split(/[._-]/).map(i=>r?i:i.charAt(0).toUpperCase()+i.slice(1).toLowerCase()).join(" ");default:return e}}function yt(e,t){if(t&&t!=="auto")return t;let r=e.some(o=>o.attributes&&Object.keys(o.attributes).length>0),i=new Set(e.map(Ae));return r&&i.size>=1?"group-by-metric":"flat"}function we({hideAttributeKey:e,attribute:t,format:r,isLastAttribute:i}){let[o,n]=t;return O("div",{className:"ub-tooltip-item-attribute-container",children:[O("div",{className:"ub-truncate"+(e?" ub-tooltip-item-hidden-attribute-key":" ub-tooltip-item-attribute-with-key"),children:[!e&&O("span",{className:"ub-tooltip-item-attribute-key",children:[Y(o,r),":"]}),P("span",{className:"ub-tooltip-item-attribute-value ub-truncate",children:n})]}),!i&&e&&P("span",{"data-text":", ",className:"ub-tooltip-item-attribute-divider"})]})}function Tt({item:e,hideMetric:t,hideAttributeKey:r,hideAttributes:i,format:o}){let s=Object.entries(e.attributes||{}),a=s.length>0&&!i;return i&&t&&console.warn("Invalid configuration. Attributes and metrics are hidden."),O("div",{className:"ub-tooltip-item-row",children:[O("div",{className:"ub-tooltip-item-left"+(t?" ub-tooltip-item-hidden-metric":""),children:[O("div",{className:"ub-tooltip-item-heading",children:[P("span",{className:"ub-tooltip-item-dot",style:{backgroundColor:e.color}}),t?P("div",{className:"ub-tooltip-item-attributes",children:s.map((u,c)=>P(we,{hideAttributeKey:r,attribute:u,format:o,isLastAttribute:c>=s.length-1},"attr_"+u[0]))}):P("span",{className:"ub-truncate"+(a?" ub-tooltip-item-metric-name-label":" ub-tooltip-item-metric-name"),children:Y(e.metric.name,o)})]}),a&&!t&&P("div",{className:"ub-tooltip-item-attributes",children:s.map((u,c)=>P(we,{hideAttributeKey:r,attribute:u,format:o,isLastAttribute:c>=s.length-1},"attr_"+u[0]))})]}),P("div",{className:"ub-tooltip-item-value ub-truncate",children:e.formattedValue??P("span",{className:"ub-tooltip-item-value--empty",children:"\u2014"})})]})}function vt({className:e="ub-tooltip-divider",...t}){return P("hr",{role:"presentation",...t,className:e})}function xt({group:e,groupIdx:t,hideAttributeKey:r,hideMetric:i,hideAttributes:o,format:n,hideGroupLabel:s}){return O("div",{className:"ub-tooltip-group",children:[!s&&P("div",{className:`ub-tooltip-group-header ub-truncate${t>0?" ub-tooltip-group-header--separator":""}`,children:e.label}),P("div",{className:"ub-tooltip-items",children:e.items.map((a,u)=>P(Tt,{item:a,format:n,hideAttributeKey:r,hideMetric:i,hideAttributes:o},`item-${t}-${u}`))})]},e.label)}function ke({timestamp:e,items:t,timeZone:r,spansMultipleDays:i,sortByValues:o,format:n="original",layout:s="flat",hideAttributeKey:a,hideMetric:u,hideAttributes:c}){let m=i?Te(e*1e3,{format:"MMM DD, HH:mm",timeZone:r}):Te(e*1e3,{format:"HH:mm",timeZone:r}),h=ve(()=>yt(t,s),[t,s]),d=h==="flat",f=typeof u=="boolean"?u:h==="group-by-metric",b=typeof a=="boolean"?a:!1,p=typeof c=="boolean"?c:!1,g=ve(()=>bt(t,o,h,n),[t,o,h,n]);return O("div",{className:"ub-tooltip",children:[P("div",{className:"ub-tooltip-datetime",children:m}),P(vt,{}),g.length>0?P("div",{className:"ub-tooltip-content",children:g.map((T,y)=>P(xt,{group:T,groupIdx:y,hideAttributeKey:b,hideMetric:f,hideAttributes:p,hideGroupLabel:d,format:n},T.label))}):P("div",{className:"ub-tooltip-no-data",children:"No data available"})]})}import{jsx as Se}from"react/jsx-runtime";function Ct(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 Pt(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 wt(e,t,r,i,o,n){let s=!1,a=[];for(let u=1;u<e.series.length;u++){let c=e.data[u]?.[t]??null;if(i&&c!=null&&u>1){let p=e.data[u-1]?.[t]??0;c=c-p}let m=e.series[u],h=n?.[u-1];if(!h){console.warn("Original serie not found");continue}let d=o[h.metric];if(!d){console.warn("Metric metadata not found");continue}let l=m?.stroke,f=typeof l=="function"?l(e,u):l??"#ffffff00",b=c==null?void 0:r?r(c):String(c);h?.attributes&&Object.keys(h?.attributes).length>0&&(s=!0),a.push({metric:d,color:f,value:c===null?void 0:c,formattedValue:b,attributes:h?.attributes,serie:m})}return{items:a,hasAttributes:s}}function Re(e,t,r,i,o,n,s,a,u,c,m,h){let d,l,f,b=!1;function p(){let g=d.getBoundingClientRect();l=g.left,f=g.top}return{hooks:{init:g=>{E.initialize(),d=g.over,window.addEventListener("scroll",p,!0),window.addEventListener("resize",p),d.onmouseenter=()=>{b=!0,E.show()},d.onmouseleave=()=>{b=!1,E.getRenderedUplot()===g&&E.hide(g)},p()},setSize:()=>{p()},setCursor:g=>{let{left:T,top:y,idx:x}=g.cursor;if(!b||x==null){E.getRenderedUplot()===g&&E.hide(g);return}let v=g.data[0],w=Ct(v,o),R=Pt(g,x),A=g.data[0][R];if(A===void 0)return;let{items:M}=wt(g,R,e,t,r,s);E.show();let N=n,V=N?Se(N,{timestamp:A,items:M,timeZone:o}):Se(ke,{timestamp:A,items:M,timeZone:o,spansMultipleDays:w,stacked:t,sortByValues:i,layout:a,format:u,hideAttributeKey:c,hideAttributes:m,hideMetric:h});E.render(g,V),E.positionTooltip({left:(T||0)+l,top:(y||0)+f})},destroy(g){window.removeEventListener("scroll",p,!0),window.removeEventListener("resize",p),d&&(d.onmouseenter=null,d.onmouseleave=null),E.getRenderedUplot()===g&&E.hide(g)}}}}var Z=["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)"],G=e=>`${getComputedStyle(document.documentElement).getPropertyValue("--ub-chart-font-size").trim()} ${e}`,Le=(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 kt(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)&&Array.isArray(e.fill)&&Array.isArray(e.border)}function St(e){return Array.isArray(e)}var Ue=(e,t,r,i,o,n)=>{if(r)return St(r)?r[t]:kt(r)?n?r.fill[t]:r.border[t]:r(e,t,i,n);let s=n?`--ub-chart-serie-color-fill-${t+1}`:`--ub-chart-serie-color-${t+1}`,a=o.getPropertyValue(s).trim();return a||(n&&(i==="step"||i==="line"||i==="spline")?`oklch(from ${Z[t%Z.length]} l c h / 0.4)`:Z[t%Z.length])},Rt=e=>{let t=J.paths.bars({size:[.6,100],radius:0,gap:0}),r=J.paths.linear({alignGaps:0}),i=J.paths.spline({alignGaps:1}),o=J.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}},Lt=(e,t,r,i,o)=>Ue(e,t,r,i,o,!0),Ut=(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,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 l=Math.floor((s+a)/2),f=o[l];f!=null&&f<i?s=l:a=l}let u=o[s],c=o[a];u!=null&&c!=null?n=Math.abs(u-i)<Math.abs(c-i)?s:a:u!=null?n=s:c!=null&&(n=a);let m=n;for(let l=n;l>=0;l--){let f=!1;for(let b=1;b<e.data.length;b++){let p=e.data[b];if(p&&p[l]!=null){f=!0;break}}if(f){m=l;break}}let h=o[m];return h==null?[t,r]:[e.valToPos(h,"x"),r]},Mt=(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},Nt=(e,t)=>e.getPropertyValue(`--ub-chart-threshold-${t}`).trim()||e.getPropertyValue("--ub-chart-threshold-default").trim(),It=(e,t)=>e.getPropertyValue(`--ub-chart-threshold-${t}-fill`).trim()||e.getPropertyValue("--ub-chart-threshold-default-fill").trim(),Dt=e=>{switch(e){case"bold":return 2;case"line":return 1;case"dashed":return 1;default:return 1}},Vt=e=>e==="line"?void 0:[5,5],zt=(e,t)=>{if(t){let r=[];return t.forEach(i=>{let o={label:i.label,stroke:Nt(e,i.level),width:Dt(),dash:Vt(i.type),points:{show:!1,size:0},spanGaps:!0,show:!0,auto:!1};W(i)||r.push(o),r.push(o)}),r}else return[]},Ot=(e,t,r,i)=>{if(!i||!i.some(n=>j(n)))return t.bands;let o=i.map((n,s)=>j(n)?{series:[e.length+s*2+1,e.length+s*2+2],fill:It(r,n.level),dir:1}:null).filter(n=>n!==null);return[...t.bands,...o]},Ft=(e,t,r,i,o,n,s)=>{let a=Ut(t,i);return[{},...e.map((u,c)=>({label:u.metric,stroke:Ue(u,c,r,t,n),width:a,points:{show:!1},spanGaps:!0,paths:Rt(t),fill:i||o?Lt(u,c,r,t,n):void 0})),...zt(n,s)]},Bt=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},Ee=(e,t,r,i,o,n,s,a,u,c,m,h,d,l,f,b,p,g,T,y,x)=>{let C=window.getComputedStyle(e),v=C.fontFamily,w=e?.clientWidth??1050,R=e?.clientHeight??250,A=Bt(i),M=At(A==="1"?null:A),N=L=>{let z=M(L,Number.isInteger(L)?0:2);return z.text+(z.suffix?.trim()||"")},V={width:w,height:R,scales:{y:{range:Me(i,y,x)}},plugins:[Re(N,s,t,c,m,h,o,f,l,b,p,g)],padding:d?[10,15,10,15]:[8,15,8,15],cursor:{y:!1,sync:{key:"_"},drag:{setScale:!0,x:!0,y:!1},move:Et},series:Ft(o,n,a,u,s,C,T),bands:Ot(o,r,C,T),axes:[ye(v,m,d),Ne(M,v)],legend:{show:!1}};return Mt(V,C)};var Ie=(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},k=(e,t)=>typeof e=="number"?e:t,Me=(e,t,r)=>(i,o,n)=>{if(o===0&&n===0)return[k(t,0),k(r,100)];let s=1,a=n*(1+s),u=o<0?o*(1+s):o*(1-s);if(e==="percent"||e==="percentunit")return n>100?o<0?[k(t,u),k(r,a)]:[k(t,0),k(r,a)]:o<0?[k(t,u),k(r,100)]:[k(t,0),k(r,100)];if(n<=.9999)return o<=0?[k(t,u),k(r,1)]:[k(t,0),k(r,1)];let c=Ie(a),m=Ie(Math.abs(u));return o<0?[k(r,-m),k(r,c)]:[k(t,0),k(r,c)]},Kt=(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,u)=>u.length>a.length?u:a,"");return s!=""&&(e.ctx.font=o?.font?.[0]??e.ctx.font,n+=e.ctx.measureText(s).width/devicePixelRatio),Math.ceil(n)};function Ne(e,t){return{gap:0,font:G(t),labelFont:G(t),grid:{show:!0,width:.5},ticks:{width:.5},values:(r,i)=>i.map(o=>{let n=e(o);return n.text+(n.suffix?.trim()||"")}),size:Kt,space:60}}function De(e,t){let r=[],i=e[0],o=i.length,n=Array(o).fill(0),s=[i];return e.forEach((a,u)=>{u!==0&&(t?s.push(a):s.push(a.map((c,m)=>n[m]=n[m]+(c||0))))}),e.forEach((a,u)=>{u===0||t||r.push({series:[e.findIndex((c,m)=>m>u),u]})}),{data:s,bands:r.filter(a=>a.series[1]>-1)}}import{jsx as Gt}from"react/jsx-runtime";function le(e){let{times:t,series:r,metadata:i,type:o,className:n,timeZone:s,options:a,tooltip:u,colors:c,tooltipComponent:m,sortByValues:h=!1,unit:d,fill:l=!1,thresholds:f,min:b,max:p}=e,{layout:g,format:T,hideAttributeKey:y,hideAttributes:x,hideMetric:C}=u||{},v=Ht(null),w=q(),R=c||w.colors;return qt(()=>{if(!r||r.length===0){console.warn("No series provided");return}let A=[t],M=d;r.forEach(U=>{let K=i[U.metric];d||(M=Le(M,K)),A.push(U.values)}),f&&f.forEach(U=>{W(U)?A.push(new Array(t.length).fill(U.value)):j(U)&&(A.push(new Array(t.length).fill(U.from)),A.push(new Array(t.length).fill(U.to)))});let N=o==="bar"||o==="area",V=De(A,!N),L=v.current,z=null;if(L){let U=Ee(L,i,V,M,r,o,N,R,l,h,s,m,!1,T,g,y,x,C,f,b,p);z=new _t({...U,...a},V.data,L);let K=new ResizeObserver(()=>{z?.setSize({width:L.clientWidth,height:L.clientHeight})});return K.observe(L),()=>{z?.destroy(),K.disconnect()}}},[r,t,o,i,s,m,R,l,h,d,T,g,y,x,C,f,b,p,a]),Gt("div",{ref:v,className:"ub-chart-container"+(n?` ${n}`:"")})}import{jsx as B}from"react/jsx-runtime";function jt({metrics:e,operator:t,attributes:r,groupBy:i,interval:o,type:n="line",className:s,appearance:a,unit:u,thresholds:c,min:m,max:h,colors:d,tooltip:l,sortByValues:f,fill:b}){let p=q(),g=o??p.interval,T=r??p.attributes,y=i??p.groupBy,x=t??p.operator,C=d??p.colors,v=typeof f=="boolean"?f:p.sortByValues,w=typeof b=="boolean"?b:p.fill,R=a?.components?.Tooltip??p.appearance.components.Tooltip,A=$t(()=>({layout:l?.layout??p.tooltip?.layout,format:l?.format??p.tooltip?.format,hideAttributes:l?.hideAttributes??p.tooltip?.hideAttributes,hideAttributeKey:l?.hideAttributeKey??p.tooltip?.hideAttributeKey,hideMetric:l?.hideMetric??p.tooltip?.hideMetric}),[l?.layout,l?.format,l?.hideAttributes,l?.hideAttributeKey,l?.hideMetric,p.tooltip?.layout,p.tooltip?.format,p.tooltip?.hideAttributes,p.tooltip?.hideAttributeKey,p.tooltip?.hideMetric]),{isLoading:M,data:N,hasError:V}=ae({queries:(Array.isArray(e)?e:[e]).map(I=>({metrics:[I],operator:x,attributes:T,groupBy:y})),timeRange:p.timeRange,startTime:p.startTime,endTime:p.endTime,interval:g}),{series:L,times:z,metadata:U}=N,K=L.every(I=>I.isEmpty),ee=`ub-chart-container${s?` ${s}`:""}`;if(M){let I=a?.components?.Loading??p.appearance.components.Loading;return B("div",{className:ee,children:B(I,{})})}if(K){let I=a?.components?.Empty??p.appearance.components.Empty;return B("div",{className:ee,children:B(I,{})})}if(V){let I=a?.components?.Error??p.appearance.components.Error;return B("div",{className:ee,children:B(I,{})})}return B(le,{times:z,series:L,metadata:U,type:n,className:s,tooltip:A,colors:C,sortByValues:v,unit:u,fill:w,tooltipComponent:R,thresholds:c,min:m,max:h})}export{le as Chart,te as Empty,re as Error,oe as Loading,ne as Scope,jt as Timeseries,Ge as UnblindProvider,rt as useLogs,je as useMetrics,he as useRefresh,q as useScope,ae as useTimeseries,Ze as useUsage};
2
2
  //# sourceMappingURL=index.mjs.map