web-mojo 2.1.529 → 2.1.531

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.
Files changed (57) hide show
  1. package/dist/admin.cjs.js +1 -1
  2. package/dist/admin.es.js +10 -10
  3. package/dist/auth.cjs.js +1 -1
  4. package/dist/auth.cjs.js.map +1 -1
  5. package/dist/auth.es.js +3 -3
  6. package/dist/auth.es.js.map +1 -1
  7. package/dist/charts.cjs.js +1 -1
  8. package/dist/charts.cjs.js.map +1 -1
  9. package/dist/charts.es.js +48 -156
  10. package/dist/charts.es.js.map +1 -1
  11. package/dist/chunks/{ChatView-5DP7NWav.js → ChatView-BwazIhTw.js} +6 -6
  12. package/dist/chunks/{ChatView-5DP7NWav.js.map → ChatView-BwazIhTw.js.map} +1 -1
  13. package/dist/chunks/{ChatView-D0uBPb-J.js → ChatView-siPKtjEy.js} +2 -2
  14. package/dist/chunks/{ChatView-D0uBPb-J.js.map → ChatView-siPKtjEy.js.map} +1 -1
  15. package/dist/chunks/{ContextMenu-C_0Ufmea.js → ContextMenu-BJlCv6JA.js} +2 -2
  16. package/dist/chunks/{ContextMenu-C_0Ufmea.js.map → ContextMenu-BJlCv6JA.js.map} +1 -1
  17. package/dist/chunks/{ContextMenu-D7PRlvcY.js → ContextMenu-DmPpGvRg.js} +2 -2
  18. package/dist/chunks/{ContextMenu-D7PRlvcY.js.map → ContextMenu-DmPpGvRg.js.map} +1 -1
  19. package/dist/chunks/{DataView-T7wmnYqr.js → DataView-DIJNkBzQ.js} +2 -2
  20. package/dist/chunks/{DataView-T7wmnYqr.js.map → DataView-DIJNkBzQ.js.map} +1 -1
  21. package/dist/chunks/{DataView-COb1gukO.js → DataView-DohifQcG.js} +2 -2
  22. package/dist/chunks/{DataView-COb1gukO.js.map → DataView-DohifQcG.js.map} +1 -1
  23. package/dist/chunks/{Dialog-BX09s8EF.js → Dialog-CcCWITnV.js} +2 -2
  24. package/dist/chunks/{Dialog-BX09s8EF.js.map → Dialog-CcCWITnV.js.map} +1 -1
  25. package/dist/chunks/{Dialog-dm5fTLiY.js → Dialog-CqJQlXoj.js} +5 -5
  26. package/dist/chunks/{Dialog-dm5fTLiY.js.map → Dialog-CqJQlXoj.js.map} +1 -1
  27. package/dist/chunks/{FormView-5PM8GJfG.js → FormView-CMdyHmf3.js} +2 -2
  28. package/dist/chunks/{FormView-5PM8GJfG.js.map → FormView-CMdyHmf3.js.map} +1 -1
  29. package/dist/chunks/{FormView--Wybw8OP.js → FormView-zxAz97lg.js} +2 -2
  30. package/dist/chunks/{FormView--Wybw8OP.js.map → FormView-zxAz97lg.js.map} +1 -1
  31. package/dist/chunks/{MetricsChart-fDEOs6eG.js → MetricsChart-Bbn-L_9C.js} +3 -3
  32. package/dist/chunks/{MetricsChart-fDEOs6eG.js.map → MetricsChart-Bbn-L_9C.js.map} +1 -1
  33. package/dist/chunks/{MetricsChart-BWQ1YAJP.js → MetricsChart-BfeD0WY-.js} +2 -2
  34. package/dist/chunks/{MetricsChart-BWQ1YAJP.js.map → MetricsChart-BfeD0WY-.js.map} +1 -1
  35. package/dist/chunks/{PDFViewer-BbYyy42P.js → PDFViewer-BUAS2Hkr.js} +3 -3
  36. package/dist/chunks/{PDFViewer-BbYyy42P.js.map → PDFViewer-BUAS2Hkr.js.map} +1 -1
  37. package/dist/chunks/{PDFViewer-DPhlBTFr.js → PDFViewer-DQvqJVD2.js} +2 -2
  38. package/dist/chunks/{PDFViewer-DPhlBTFr.js.map → PDFViewer-DQvqJVD2.js.map} +1 -1
  39. package/dist/chunks/{Page-CcIMnuov.js → Page-BZA8Inm2.js} +2 -2
  40. package/dist/chunks/{Page-CcIMnuov.js.map → Page-BZA8Inm2.js.map} +1 -1
  41. package/dist/chunks/{Page-B7v6uh02.js → Page-BvVfjiCv.js} +2 -2
  42. package/dist/chunks/{Page-B7v6uh02.js.map → Page-BvVfjiCv.js.map} +1 -1
  43. package/dist/chunks/{TopNav-BC51rpEJ.js → TopNav-BjPDz8n_.js} +2 -2
  44. package/dist/chunks/{TopNav-BC51rpEJ.js.map → TopNav-BjPDz8n_.js.map} +1 -1
  45. package/dist/chunks/{TopNav-CudazPzU.js → TopNav-ChmlxQ5s.js} +2 -2
  46. package/dist/chunks/{TopNav-CudazPzU.js.map → TopNav-ChmlxQ5s.js.map} +1 -1
  47. package/dist/chunks/{WebApp-C5V1vLhz.js → WebApp-KZbQxSrZ.js} +2 -2
  48. package/dist/chunks/{WebApp-C5V1vLhz.js.map → WebApp-KZbQxSrZ.js.map} +1 -1
  49. package/dist/chunks/{WebApp-tr4cjBu1.js → WebApp-zyQ4x8MK.js} +13 -13
  50. package/dist/chunks/{WebApp-tr4cjBu1.js.map → WebApp-zyQ4x8MK.js.map} +1 -1
  51. package/dist/docit.cjs.js +1 -1
  52. package/dist/docit.es.js +5 -5
  53. package/dist/index.cjs.js +1 -1
  54. package/dist/index.es.js +11 -11
  55. package/dist/lightbox.cjs.js +1 -1
  56. package/dist/lightbox.es.js +4 -4
  57. package/package.json +1 -1
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./chunks/MetricsChart-BWQ1YAJP.js"),e=require("./chunks/WebApp-C5V1vLhz.js");class MiniChart extends e.View{constructor(t={}){super({className:"mini-chart",...t}),this.chartType=t.chartType||"line",this.data=t.data||[],this.width=t.width||"100%",this.height=t.height||30,this.maintainAspectRatio=t.maintainAspectRatio||!1,this.color=t.color||"rgba(54, 162, 235, 1)",this.fillColor=t.fillColor||"rgba(54, 162, 235, 0.1)",this.strokeWidth=t.strokeWidth||2,this.barGap=t.barGap||2,this.fill=!1!==t.fill,this.smoothing=t.smoothing||.3,this.padding=t.padding||2,this.minValue=t.minValue,this.maxValue=t.maxValue,this.showDots=t.showDots||!1,this.dotRadius=t.dotRadius||2,this.animate=!1!==t.animate,this.animationDuration=t.animationDuration||300,this.showTooltip=!1!==t.showTooltip,this.tooltipFormatter=t.tooltipFormatter||null,this.showCrosshair=!1!==t.showCrosshair,this.crosshairColor=t.crosshairColor||"rgba(0, 0, 0, 0.2)",this.crosshairWidth=t.crosshairWidth||1,this.tooltip=null,this.crosshair=null,this.hoveredIndex=-1}getTemplate(){const t="number"==typeof this.width?`${this.width}px`:this.width,e="number"==typeof this.height?`${this.height}px`:this.height,i=this.maintainAspectRatio?"xMidYMid meet":"none";return`\n <div class="mini-chart-wrapper" style="position: relative; display: block; width: ${t}; height: ${e};">\n <svg \n class="mini-chart-svg" \n width="100%" \n height="100%"\n viewBox="0 0 100 ${this.height}"\n preserveAspectRatio="${i}"\n style="display: block;">\n </svg>\n ${this.showTooltip?'<div class="mini-chart-tooltip" style="display: none;"></div>':""}\n </div>\n `}async onAfterRender(){this.svg=this.element.querySelector(".mini-chart-svg"),this.tooltip=this.element.querySelector(".mini-chart-tooltip"),this.updateDimensions(),this.data&&this.data.length>0&&this.renderChart(),this.showTooltip&&this.svg&&this.setupTooltip(),this.setupResizeObserver()}updateDimensions(){if(!this.svg)return;const t=this.svg.getBoundingClientRect();this.actualWidth=t.width||100,this.actualHeight=t.height||this.height,this.svg.setAttribute("viewBox",`0 0 ${this.actualWidth} ${this.actualHeight}`)}setupResizeObserver(){"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver(()=>{this.updateDimensions(),this.data&&this.data.length>0&&this.renderChart()}),this.svg&&this.resizeObserver.observe(this.svg))}renderChart(){if(!this.svg||!this.data||0===this.data.length)return;this.svg.innerHTML="";const{min:t,max:e}=this.calculateBounds();if("line"===this.chartType?this.renderLine(t,e):"bar"===this.chartType&&this.renderBar(t,e),this.showCrosshair){const t=this.getActualHeight();this.crosshair=this.createSVGElement("line",{x1:0,y1:0,x2:0,y2:t,stroke:this.crosshairColor,"stroke-width":this.crosshairWidth,"stroke-dasharray":"3,3",style:"display: none; pointer-events: none;"}),this.svg.appendChild(this.crosshair)}this.showTooltip&&this.tooltip&&this.setupTooltip(),this.animate&&this.applyAnimation()}calculateBounds(){const t=this.data.map(t=>"object"==typeof t?t.value:t);let e=void 0!==this.minValue?this.minValue:Math.min(...t),i=void 0!==this.maxValue?this.maxValue:Math.max(...t);return 0===i-e&&(e-=1,i+=1),{min:e,max:i}}getActualWidth(){return this.actualWidth||this.width||100}getActualHeight(){return this.actualHeight||this.height||30}renderLine(t,e){const i=this.data.map(t=>"object"==typeof t?t.value:t),s=this.calculatePoints(i,t,e);if(this.fill){const t=this.createAreaPath(s),e=this.createSVGElement("path",{d:t,fill:this.fillColor,stroke:"none"});this.svg.appendChild(e)}const a=this.smoothing>0?this.createSmoothPath(s):this.createLinePath(s),r=this.createSVGElement("path",{d:a,fill:"none",stroke:this.color,"stroke-width":this.strokeWidth,"stroke-linecap":"round","stroke-linejoin":"round"});this.svg.appendChild(r),this.showDots&&s.forEach(t=>{const e=this.createSVGElement("circle",{cx:t.x,cy:t.y,r:this.dotRadius,fill:this.color});this.svg.appendChild(e)})}renderBar(t,e){const i=this.data.map(t=>"object"==typeof t?t.value:t),s=this.calculatePoints(i,t,e),a=this.getActualWidth(),r=this.getActualHeight(),h=(a-2*this.padding-this.barGap*(i.length-1))/i.length;s.forEach((t,e)=>{const i=r-2*this.padding-t.y+this.padding,s=t.x-h/2,a=t.y,n=this.createSVGElement("rect",{x:s,y:a,width:h,height:i,fill:this.color,rx:1,"data-bar-index":e,class:"mini-chart-bar"});this.svg.appendChild(n)})}calculatePoints(t,e,i){const s=i-e,a=this.getActualWidth(),r=this.getActualHeight(),h=(a-2*this.padding)/(t.length-1||1),n=(r-2*this.padding)/s;return t.map((t,i)=>({x:this.padding+i*h,y:r-this.padding-(t-e)*n}))}createLinePath(t){if(0===t.length)return"";let e=`M ${t[0].x},${t[0].y}`;for(let i=1;i<t.length;i++)e+=` L ${t[i].x},${t[i].y}`;return e}createSmoothPath(t){if(t.length<2)return this.createLinePath(t);let e=`M ${t[0].x},${t[0].y}`;for(let i=0;i<t.length-1;i++){const s=t[i],a=t[i+1];e+=` C ${s.x+(a.x-s.x)*this.smoothing},${s.y} ${a.x-(a.x-s.x)*this.smoothing},${a.y} ${a.x},${a.y}`}return e}createAreaPath(t){if(0===t.length)return"";const e=this.smoothing>0?this.createSmoothPath(t):this.createLinePath(t),i=t[t.length-1],s=t[0],a=this.getActualHeight();return`${e} L ${i.x},${a-this.padding} L ${s.x},${a-this.padding} Z`}createSVGElement(t,e={}){const i=document.createElementNS("http://www.w3.org/2000/svg",t);return Object.entries(e).forEach(([t,e])=>{i.setAttribute(t,e)}),i}applyAnimation(){this.svg.querySelectorAll("path").forEach(t=>{const e=t.getTotalLength();t.style.strokeDasharray=e,t.style.strokeDashoffset=e,t.style.animation=`mini-chart-draw ${this.animationDuration}ms ease-out forwards`}),this.svg.querySelectorAll("rect").forEach((t,e)=>{t.style.transformOrigin="bottom",t.style.animation=`mini-chart-bar-grow ${this.animationDuration}ms ease-out ${20*e}ms forwards`,t.style.transform="scaleY(0)"})}setupTooltip(){if(!this.svg||!this.tooltip)return;const t=this.data.map(t=>"object"==typeof t?t.value:t),e=this.calculatePoints(t,...Object.values(this.calculateBounds())),i=this.getActualWidth(),s=this.getActualHeight(),a=i/t.length;e.forEach((t,e)=>{const i=this.createSVGElement("rect",{x:e*a,y:0,width:a,height:s,fill:"transparent",style:"cursor: pointer;"});i.addEventListener("mouseenter",t=>{this.showTooltipAtIndex(e,t)}),i.addEventListener("mousemove",t=>{this.updateTooltipPosition(t)}),i.addEventListener("mouseleave",()=>{this.hideTooltip()}),this.svg.appendChild(i)})}showTooltipAtIndex(t,e){if(!this.tooltip)return;this.hoveredIndex=t;const i="object"==typeof this.data[t]?this.data[t].value:this.data[t],s="object"==typeof this.data[t]?this.data[t].label:null;let a=i;this.tooltipFormatter?"function"==typeof this.tooltipFormatter&&(a=this.tooltipFormatter(i,t)):a="number"==typeof i?i.toLocaleString():i;let r=`<strong>${a}</strong>`;if(s&&(r=`${s}<br>${r}`),this.tooltip.innerHTML=r,this.tooltip.style.display="block",this.updateTooltipPosition(e),"bar"===this.chartType&&this.highlightBar(t),this.crosshair&&this.showCrosshair){const e=this.getActualWidth()/this.data.length,i=t*e+e/2;this.crosshair.setAttribute("x1",i),this.crosshair.setAttribute("x2",i),this.crosshair.style.display="block"}}updateTooltipPosition(t){if(!this.tooltip||"none"===this.tooltip.style.display)return;const e=this.svg.getBoundingClientRect(),i=t.clientX-e.left,s=t.clientY-e.top;this.tooltip.style.left=`${i}px`,this.tooltip.style.top=s-10+"px",this.tooltip.style.transform="translate(-50%, -100%)"}hideTooltip(){this.tooltip&&(this.tooltip.style.display="none",this.hoveredIndex=-1),"bar"===this.chartType&&this.unhighlightBars(),this.crosshair&&(this.crosshair.style.display="none")}highlightBar(t){if(!this.svg)return;this.unhighlightBars();const e=this.svg.querySelector(`rect.mini-chart-bar[data-bar-index="${t}"]`);e&&(e.style.opacity="0.7")}unhighlightBars(){this.svg&&this.svg.querySelectorAll("rect.mini-chart-bar").forEach(t=>{t.style.opacity="1"})}setData(t){this.data=t,this.svg&&this.renderChart()}setColor(t){this.color=t,this.svg&&this.renderChart()}setType(t){["line","bar"].includes(t)&&(this.chartType=t,this.svg&&this.renderChart())}resize(t,e){this.width=t,this.height=e,this.updateDimensions(),this.svg&&this.renderChart()}async onBeforeDestroy(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null),await super.onBeforeDestroy()}}class MetricsMiniChart extends e.View{constructor(t={}){super({className:"metrics-mini-chart",...t}),this.label=t.label||"",this.value=t.value||0,this.data=t.data||[],this.trend=t.trend,this.trendValue=t.trendValue,this.chartType=t.chartType||"line",this.chartWidth=t.chartWidth||100,this.chartHeight=t.chartHeight||40,this.chartColor=t.chartColor||"rgba(54, 162, 235, 1)",this.fill=!1!==t.fill,this.smoothing=t.smoothing||.3,this.valueFormatter=t.valueFormatter||null,this.suffix=t.suffix||"",this.prefix=t.prefix||"",this.variant=t.variant||"default",this.size=t.size||"md",this.layout=t.layout||"horizontal",this.endpoint=t.endpoint||"/api/metrics/fetch",this.account=t.account||"global",this.granularity=t.granularity||"hours",this.slugs=t.slugs||null,this.category=t.category||null,this.dateStart=t.dateStart||null,this.dateEnd=t.dateEnd||null,this.defaultDateRange=t.defaultDateRange||"24h",this.isLoading=!1,this.lastFetch=null,this.refreshInterval=t.refreshInterval,this.dateStart&&this.dateEnd||this.setQuickRange(this.defaultDateRange),this.slugs&&!Array.isArray(this.slugs)&&(this.slugs=[this.slugs]),this.miniChart=null}getTemplate(){return`\n <div class="metrics-mini-chart-container metrics-mini-chart-${this.size} ${"default"!==this.variant?`metrics-mini-chart-${this.variant}`:""} metrics-mini-chart-${this.layout}">\n <div class="metrics-info">\n <div class="metrics-label">${this.escapeHtml(this.label)}</div>\n <div class="metrics-value-row">\n <div class="metrics-value" data-ref="value">\n ${this.formatValue(this.value)}\n </div>\n ${this.renderTrendBadge()}\n </div>\n </div>\n <div class="metrics-chart" data-container="chart"></div>\n </div>\n `}async onInit(){this.miniChart=new MiniChart({chartType:this.chartType,data:this.data,width:this.chartWidth,height:this.chartHeight,color:this.getChartColor(),fillColor:this.getFillColor(),fill:this.fill,smoothing:this.smoothing,animate:!0}),this.addChild(this.miniChart,"chart"),this.refreshInterval&&this.endpoint&&this.startAutoRefresh()}async onAfterRender(){await super.onAfterRender(),this.endpoint&&0===this.data.length&&await this.fetchData()}renderTrendBadge(){if(!this.trend&&void 0===this.trendValue)return"";const t=this.trend||(this.trendValue>0?"up":"down");return`\n <span class="metrics-trend ${"up"===t?"trend-up":"trend-down"}">\n <i class="bi ${"up"===t?"bi-arrow-up":"bi-arrow-down"}"></i>\n ${void 0!==this.trendValue?`${Math.abs(this.trendValue)}%`:""}\n </span>\n `}getChartColor(){return{success:"rgba(75, 192, 192, 1)",danger:"rgba(255, 99, 132, 1)",warning:"rgba(255, 206, 86, 1)",info:"rgba(54, 162, 235, 1)",default:this.chartColor}[this.variant]||this.chartColor}getFillColor(){return this.getChartColor().replace(/[\d.]+\)$/,"0.1)")}formatValue(t){let e=t;return this.valueFormatter?"function"==typeof this.valueFormatter?e=this.valueFormatter(t):this.dataFormatter&&(e=this.dataFormatter.pipe(t,this.valueFormatter)):"number"==typeof t&&(e=t.toLocaleString()),`${this.prefix}${e}${this.suffix}`}escapeHtml(t){const e=document.createElement("div");return e.textContent=t,e.innerHTML}buildApiParams(){const t={granularity:this.granularity,account:this.account,with_labels:!0};return this.slugs&&this.slugs.length>0&&this.slugs.forEach(e=>{t["slugs[]"]||(t["slugs[]"]=[]),t["slugs[]"].push(e)}),this.category&&(t.category=this.category),this.dateStart&&(t.dr_start=Math.floor(this.dateStart.getTime()/1e3)),this.dateEnd&&(t.dr_end=Math.floor(this.dateEnd.getTime()/1e3)),t._=Date.now(),t}async fetchData(){if(this.endpoint){this.isLoading=!0;try{const t=this.getApp()?.rest;if(!t)throw new Error("No REST client available");const e=this.buildApiParams(),i=await t.GET(this.endpoint,e);if(!i.success)throw new Error(i.message||"Network error");if(!i.data?.status)throw new Error(i.data?.error||"Server error");const s=i.data.data;this.processMetricsData(s),this.lastFetch=/* @__PURE__ */new Date,await this.render(),this.emit("metrics:loaded",{chart:this,data:s,params:e})}catch(t){console.error("Failed to fetch metrics:",t),this.emit("metrics:error",{chart:this,error:t})}finally{this.isLoading=!1}}}processMetricsData(t){const{data:e,labels:i}=t;if(!e)return;const s=Object.keys(e);if(0===s.length)return;const a=e[s[0]].map(t=>null==t||""===t?0:"number"==typeof t?t:parseFloat(t)||0);this.setData(a);const r=a[a.length-1]||0;if(this.setValue(r),a.length>=2){const t=a[0],e=a[a.length-1];0!==t&&(this.trendValue=parseFloat(((e-t)/t*100).toFixed(1)),this.trend=this.trendValue>=0?"up":"down")}}setQuickRange(t){const e=/* @__PURE__ */new Date;let i;switch(t){case"1h":i=new Date(e.getTime()-36e5);break;case"24h":default:i=new Date(e.getTime()-864e5);break;case"7d":i=new Date(e.getTime()-6048e5);break;case"30d":i=new Date(e.getTime()-2592e6)}this.dateStart=i,this.dateEnd=e}startAutoRefresh(){this.refreshTimer&&clearInterval(this.refreshTimer),this.refreshTimer=setInterval(()=>{this.fetchData()},this.refreshInterval)}stopAutoRefresh(){this.refreshTimer&&(clearInterval(this.refreshTimer),this.refreshTimer=null)}setValue(t){this.value=t;const e=this.element?.querySelector('[data-ref="value"]');e&&(e.textContent=this.formatValue(t))}setData(t){if(this.data=t,this.miniChart&&this.miniChart.setData(t),t.length>=2&&void 0===this.trendValue){const e="object"==typeof t[0]?t[0].value:t[0],i="object"==typeof t[t.length-1]?t[t.length-1].value:t[t.length-1];0!==e&&(this.trendValue=((i-e)/e*100).toFixed(1),this.trend=this.trendValue>0?"up":"down")}}setLabel(t){this.label=t;const e=this.element?.querySelector(".metrics-label");e&&(e.textContent=t)}setVariant(t){this.element&&(this.element.querySelector(".metrics-mini-chart-container")?.classList.remove(`metrics-mini-chart-${this.variant}`),this.element.querySelector(".metrics-mini-chart-container")?.classList.add(`metrics-mini-chart-${t}`)),this.variant=t,this.miniChart&&this.miniChart.setColor(this.getChartColor())}refresh(){return this.fetchData()}async onBeforeDestroy(){this.stopAutoRefresh(),await super.onBeforeDestroy()}}exports.BaseChart=t.BaseChart,exports.MetricsChart=t.MetricsChart,exports.PieChart=t.PieChart,exports.SeriesChart=t.SeriesChart,exports.BUILD_TIME=e.BUILD_TIME,exports.VERSION=e.VERSION,exports.VERSION_INFO=e.VERSION_INFO,exports.VERSION_MAJOR=e.VERSION_MAJOR,exports.VERSION_MINOR=e.VERSION_MINOR,exports.VERSION_REVISION=e.VERSION_REVISION,exports.WebApp=e.WebApp,exports.MetricsMiniChart=MetricsMiniChart,exports.MiniChart=MiniChart;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./chunks/MetricsChart-BfeD0WY-.js"),s=require("./chunks/WebApp-KZbQxSrZ.js");class MiniChart extends s.View{constructor(t={}){super({className:"mini-chart",...t}),this.chartType=t.chartType||"line",this.data=t.data||[],this.width=t.width||"100%",this.height=t.height||30,this.maintainAspectRatio=t.maintainAspectRatio||!1,this.color=t.color||"rgba(54, 162, 235, 1)",this.fillColor=t.fillColor||"rgba(54, 162, 235, 0.1)",this.strokeWidth=t.strokeWidth||2,this.barGap=t.barGap||2,this.fill=!1!==t.fill,this.smoothing=t.smoothing||.3,this.padding=t.padding||2,this.minValue=t.minValue,this.maxValue=t.maxValue,this.showDots=t.showDots||!1,this.dotRadius=t.dotRadius||2,this.animate=!1!==t.animate,this.animationDuration=t.animationDuration||300,this.showTooltip=!1!==t.showTooltip,this.tooltipFormatter=t.tooltipFormatter||null,this.showCrosshair=!1!==t.showCrosshair,this.crosshairColor=t.crosshairColor||"rgba(0, 0, 0, 0.2)",this.crosshairWidth=t.crosshairWidth||1,this.showXAxis=t.showXAxis||!1,this.xAxisColor=t.xAxisColor||this.color,this.xAxisWidth=t.xAxisWidth||1,this.xAxisDashed=!1!==t.xAxisDashed,this.tooltip=null,this.crosshair=null,this.hoveredIndex=-1}getTemplate(){const t="number"==typeof this.width?`${this.width}px`:this.width,s="number"==typeof this.height?`${this.height}px`:this.height,e=this.maintainAspectRatio?"xMidYMid meet":"none";return`\n <div class="mini-chart-wrapper" style="position: relative; display: block; width: ${t}; height: ${s};">\n <svg \n class="mini-chart-svg" \n width="100%" \n height="100%"\n viewBox="0 0 100 ${this.height}"\n preserveAspectRatio="${e}"\n style="display: block;">\n </svg>\n ${this.showTooltip?'<div class="mini-chart-tooltip" style="display: none;"></div>':""}\n </div>\n `}async onAfterRender(){this.svg=this.element.querySelector(".mini-chart-svg"),this.tooltip=this.element.querySelector(".mini-chart-tooltip"),this.updateDimensions(),this.data&&this.data.length>0&&this.renderChart(),this.showTooltip&&this.svg&&this.setupTooltip(),this.setupResizeObserver()}updateDimensions(){if(!this.svg)return;const t=this.svg.getBoundingClientRect();this.actualWidth=t.width||100,this.actualHeight=t.height||this.height,this.svg.setAttribute("viewBox",`0 0 ${this.actualWidth} ${this.actualHeight}`)}setupResizeObserver(){"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver(()=>{this.updateDimensions(),this.data&&this.data.length>0&&this.renderChart()}),this.svg&&this.resizeObserver.observe(this.svg))}renderChart(){if(!this.svg||!this.data||0===this.data.length)return;this.svg.innerHTML="";const{min:t,max:s}=this.calculateBounds();if(this.showXAxis&&this.renderXAxis(t,s),"line"===this.chartType?this.renderLine(t,s):"bar"===this.chartType&&this.renderBar(t,s),this.showCrosshair){const t=this.getActualHeight();this.crosshair=this.createSVGElement("line",{x1:0,y1:0,x2:0,y2:t,stroke:this.crosshairColor,"stroke-width":this.crosshairWidth,"stroke-dasharray":"3,3",style:"display: none; pointer-events: none;"}),this.svg.appendChild(this.crosshair)}this.showTooltip&&this.tooltip&&this.setupTooltip(),this.animate&&this.applyAnimation()}renderXAxis(t,s){const e=this.getActualWidth(),i=this.getActualHeight();let h;if(t<=0&&s>=0){const e=s-t,a=(i-2*this.padding)/e;h=i-this.padding-(0-t)*a}else h=i-this.padding;const a=this.createSVGElement("line",{x1:this.padding,y1:h,x2:e-this.padding,y2:h,stroke:this.xAxisColor,"stroke-width":this.xAxisWidth,"stroke-dasharray":this.xAxisDashed?"2,2":"none","stroke-opacity":"0.5"});this.svg.appendChild(a)}calculateBounds(){const t=this.data.map(t=>"object"==typeof t?t.value:t);let s=void 0!==this.minValue?this.minValue:Math.min(...t),e=void 0!==this.maxValue?this.maxValue:Math.max(...t);return 0===e-s&&(s-=1,e+=1),{min:s,max:e}}getActualWidth(){return this.actualWidth||this.width||100}getActualHeight(){return this.actualHeight||this.height||30}renderLine(t,s){const e=this.data.map(t=>"object"==typeof t?t.value:t),i=this.calculatePoints(e,t,s);if(this.fill){const t=this.createAreaPath(i),s=this.createSVGElement("path",{d:t,fill:this.fillColor,stroke:"none"});this.svg.appendChild(s)}const h=this.smoothing>0?this.createSmoothPath(i):this.createLinePath(i),a=this.createSVGElement("path",{d:h,fill:"none",stroke:this.color,"stroke-width":this.strokeWidth,"stroke-linecap":"round","stroke-linejoin":"round"});this.svg.appendChild(a),this.showDots&&i.forEach(t=>{const s=this.createSVGElement("circle",{cx:t.x,cy:t.y,r:this.dotRadius,fill:this.color});this.svg.appendChild(s)})}renderBar(t,s){const e=this.data.map(t=>"object"==typeof t?t.value:t),i=this.calculatePoints(e,t,s),h=this.getActualWidth(),a=this.getActualHeight(),r=(h-2*this.padding-this.barGap*(e.length-1))/e.length;i.forEach((t,s)=>{const e=a-2*this.padding-t.y+this.padding,i=t.x-r/2,h=t.y,o=this.createSVGElement("rect",{x:i,y:h,width:r,height:e,fill:this.color,rx:1,"data-bar-index":s,class:"mini-chart-bar"});this.svg.appendChild(o)})}calculatePoints(t,s,e){const i=e-s,h=this.getActualWidth(),a=this.getActualHeight(),r=(h-2*this.padding)/(t.length-1||1),o=(a-2*this.padding)/i;return t.map((t,e)=>({x:this.padding+e*r,y:a-this.padding-(t-s)*o}))}createLinePath(t){if(0===t.length)return"";let s=`M ${t[0].x},${t[0].y}`;for(let e=1;e<t.length;e++)s+=` L ${t[e].x},${t[e].y}`;return s}createSmoothPath(t){if(t.length<2)return this.createLinePath(t);let s=`M ${t[0].x},${t[0].y}`;for(let e=0;e<t.length-1;e++){const i=t[e],h=t[e+1];s+=` C ${i.x+(h.x-i.x)*this.smoothing},${i.y} ${h.x-(h.x-i.x)*this.smoothing},${h.y} ${h.x},${h.y}`}return s}createAreaPath(t){if(0===t.length)return"";const s=this.smoothing>0?this.createSmoothPath(t):this.createLinePath(t),e=t[t.length-1],i=t[0],h=this.getActualHeight();return`${s} L ${e.x},${h-this.padding} L ${i.x},${h-this.padding} Z`}createSVGElement(t,s={}){const e=document.createElementNS("http://www.w3.org/2000/svg",t);return Object.entries(s).forEach(([t,s])=>{e.setAttribute(t,s)}),e}applyAnimation(){this.svg.querySelectorAll("path").forEach(t=>{const s=t.getTotalLength();t.style.strokeDasharray=s,t.style.strokeDashoffset=s,t.style.animation=`mini-chart-draw ${this.animationDuration}ms ease-out forwards`}),this.svg.querySelectorAll("rect").forEach((t,s)=>{t.style.transformOrigin="bottom",t.style.animation=`mini-chart-bar-grow ${this.animationDuration}ms ease-out ${20*s}ms forwards`,t.style.transform="scaleY(0)"})}setupTooltip(){if(!this.svg||!this.tooltip)return;const t=this.data.map(t=>"object"==typeof t?t.value:t),s=this.calculatePoints(t,...Object.values(this.calculateBounds())),e=this.getActualWidth(),i=this.getActualHeight(),h=e/t.length;s.forEach((t,s)=>{const e=this.createSVGElement("rect",{x:s*h,y:0,width:h,height:i,fill:"transparent",style:"cursor: pointer;"});e.addEventListener("mouseenter",t=>{this.showTooltipAtIndex(s,t)}),e.addEventListener("mousemove",t=>{this.updateTooltipPosition(t)}),e.addEventListener("mouseleave",()=>{this.hideTooltip()}),this.svg.appendChild(e)})}showTooltipAtIndex(t,s){if(!this.tooltip)return;this.hoveredIndex=t;const e="object"==typeof this.data[t]?this.data[t].value:this.data[t],i="object"==typeof this.data[t]?this.data[t].label:null;let h=e;this.tooltipFormatter?"function"==typeof this.tooltipFormatter&&(h=this.tooltipFormatter(e,t)):h="number"==typeof e?e.toLocaleString():e;let a=`<strong>${h}</strong>`;if(i&&(a=`${i}<br>${a}`),this.tooltip.innerHTML=a,this.tooltip.style.display="block",this.updateTooltipPosition(s),"bar"===this.chartType&&this.highlightBar(t),this.crosshair&&this.showCrosshair){const s=this.getActualWidth()/this.data.length,e=t*s+s/2;this.crosshair.setAttribute("x1",e),this.crosshair.setAttribute("x2",e),this.crosshair.style.display="block"}}updateTooltipPosition(t){if(!this.tooltip||"none"===this.tooltip.style.display)return;const s=this.svg.getBoundingClientRect(),e=t.clientX-s.left,i=t.clientY-s.top;this.tooltip.style.left=`${e}px`,this.tooltip.style.top=i-10+"px",this.tooltip.style.transform="translate(-50%, -100%)"}hideTooltip(){this.tooltip&&(this.tooltip.style.display="none",this.hoveredIndex=-1),"bar"===this.chartType&&this.unhighlightBars(),this.crosshair&&(this.crosshair.style.display="none")}highlightBar(t){if(!this.svg)return;this.unhighlightBars();const s=this.svg.querySelector(`rect.mini-chart-bar[data-bar-index="${t}"]`);s&&(s.style.opacity="0.7")}unhighlightBars(){this.svg&&this.svg.querySelectorAll("rect.mini-chart-bar").forEach(t=>{t.style.opacity="1"})}setData(t){this.data=t,this.svg&&this.renderChart()}setColor(t){this.color=t,this.svg&&this.renderChart()}setType(t){["line","bar"].includes(t)&&(this.chartType=t,this.svg&&this.renderChart())}resize(t,s){this.width=t,this.height=s,this.updateDimensions(),this.svg&&this.renderChart()}async onBeforeDestroy(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null),await super.onBeforeDestroy()}}exports.BaseChart=t.BaseChart,exports.MetricsChart=t.MetricsChart,exports.PieChart=t.PieChart,exports.SeriesChart=t.SeriesChart,exports.BUILD_TIME=s.BUILD_TIME,exports.VERSION=s.VERSION,exports.VERSION_INFO=s.VERSION_INFO,exports.VERSION_MAJOR=s.VERSION_MAJOR,exports.VERSION_MINOR=s.VERSION_MINOR,exports.VERSION_REVISION=s.VERSION_REVISION,exports.WebApp=s.WebApp,exports.MetricsMiniChart=class extends MiniChart{constructor(t={}){super(t),this.endpoint=t.endpoint||"/api/metrics/fetch",this.account=t.account||"global",this.granularity=t.granularity||"hours",this.slugs=t.slugs||null,this.category=t.category||null,this.dateStart=t.dateStart||null,this.dateEnd=t.dateEnd||null,this.defaultDateRange=t.defaultDateRange||"24h",this.isLoading=!1,this.lastFetch=null,this.refreshInterval=t.refreshInterval,this.dateStart&&this.dateEnd||this.setQuickRange(this.defaultDateRange),this.slugs&&!Array.isArray(this.slugs)&&(this.slugs=[this.slugs])}async onAfterRender(){await super.onAfterRender(),!this.endpoint||this.data&&0!==this.data.length||await this.fetchData(),this.refreshInterval&&this.endpoint&&this.startAutoRefresh()}buildApiParams(){const t={granularity:this.granularity,account:this.account,with_labels:!0};return this.slugs&&this.slugs.length>0&&this.slugs.forEach(s=>{t["slugs[]"]||(t["slugs[]"]=[]),t["slugs[]"].push(s)}),this.category&&(t.category=this.category),this.dateStart&&(t.dr_start=Math.floor(this.dateStart.getTime()/1e3)),this.dateEnd&&(t.dr_end=Math.floor(this.dateEnd.getTime()/1e3)),t._=Date.now(),t}async fetchData(){if(this.endpoint){this.isLoading=!0;try{const t=this.getApp()?.rest;if(!t)throw new Error("No REST client available");const s=this.buildApiParams(),e=await t.GET(this.endpoint,s);if(!e.success)throw new Error(e.message||"Network error");if(!e.data?.status)throw new Error(e.data?.error||"Server error");const i=e.data.data;this.processMetricsData(i),this.lastFetch=/* @__PURE__ */new Date,await this.render(),this.emit("metrics:loaded",{chart:this,data:i,params:s})}catch(t){console.error("Failed to fetch metrics:",t),this.emit("metrics:error",{chart:this,error:t})}finally{this.isLoading=!1}}}processMetricsData(t){const{data:s,labels:e}=t;if(!s)return;const i=Object.keys(s);if(0===i.length)return;const h=s[i[0]].map(t=>null==t||""===t?0:"number"==typeof t?t:parseFloat(t)||0);this.setData(h)}setQuickRange(t){const s=/* @__PURE__ */new Date;let e;switch(t){case"1h":e=new Date(s.getTime()-36e5);break;case"24h":default:e=new Date(s.getTime()-864e5);break;case"7d":e=new Date(s.getTime()-6048e5);break;case"30d":e=new Date(s.getTime()-2592e6)}this.dateStart=e,this.dateEnd=s}startAutoRefresh(){this.refreshTimer&&clearInterval(this.refreshTimer),this.refreshTimer=setInterval(()=>{this.fetchData()},this.refreshInterval)}stopAutoRefresh(){this.refreshTimer&&(clearInterval(this.refreshTimer),this.refreshTimer=null)}setGranularity(t){return this.granularity=t,this.fetchData()}setDateRange(t,s){return this.dateStart=new Date(t),this.dateEnd=new Date(s),this.fetchData()}setMetrics(t){return this.slugs=Array.isArray(t)?t:[t],this.fetchData()}refresh(){return this.fetchData()}async onBeforeDestroy(){this.stopAutoRefresh(),await super.onBeforeDestroy()}},exports.MiniChart=MiniChart;
2
2
  //# sourceMappingURL=charts.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"charts.cjs.js","sources":["../src/extensions/charts/MiniChart.js","../src/extensions/charts/MetricsMiniChart.js"],"sourcesContent":["/**\n * MiniChart - Lightweight sparkline chart component\n * Renders simple line or bar charts with minimal configuration\n * Uses SVG for crisp rendering at any size\n */\n\nimport View from '@core/View.js';\n\nexport default class MiniChart extends View {\n constructor(options = {}) {\n super({\n className: 'mini-chart',\n ...options\n });\n\n // Chart type: 'line' or 'bar'\n this.chartType = options.chartType || 'line';\n \n // Data\n this.data = options.data || [];\n \n // Dimensions\n this.width = options.width || '100%'; // Support both number and '100%'\n this.height = options.height || 30;\n this.maintainAspectRatio = options.maintainAspectRatio || false;\n \n // Styling\n this.color = options.color || 'rgba(54, 162, 235, 1)'; // Primary blue\n this.fillColor = options.fillColor || 'rgba(54, 162, 235, 0.1)'; // Light fill\n this.strokeWidth = options.strokeWidth || 2;\n this.barGap = options.barGap || 2;\n \n // Fill area under line\n this.fill = options.fill !== false; // Default true\n \n // Curve smoothing (0 = straight lines, 1 = very smooth)\n this.smoothing = options.smoothing || 0.3;\n \n // Padding\n this.padding = options.padding || 2;\n \n // Min/Max values (auto-calculated if not provided)\n this.minValue = options.minValue;\n this.maxValue = options.maxValue;\n \n // Show dots on line chart\n this.showDots = options.showDots || false;\n this.dotRadius = options.dotRadius || 2;\n \n // Animation\n this.animate = options.animate !== false;\n this.animationDuration = options.animationDuration || 300;\n \n // Tooltip\n this.showTooltip = options.showTooltip !== false;\n this.tooltipFormatter = options.tooltipFormatter || null;\n \n // Crosshair\n this.showCrosshair = options.showCrosshair !== false;\n this.crosshairColor = options.crosshairColor || 'rgba(0, 0, 0, 0.2)';\n this.crosshairWidth = options.crosshairWidth || 1;\n \n // Tooltip state\n this.tooltip = null;\n this.crosshair = null;\n this.hoveredIndex = -1;\n }\n\n getTemplate() {\n const widthStyle = typeof this.width === 'number' ? `${this.width}px` : this.width;\n const heightStyle = typeof this.height === 'number' ? `${this.height}px` : this.height;\n const preserveAspectRatio = this.maintainAspectRatio ? 'xMidYMid meet' : 'none';\n \n return `\n <div class=\"mini-chart-wrapper\" style=\"position: relative; display: block; width: ${widthStyle}; height: ${heightStyle};\">\n <svg \n class=\"mini-chart-svg\" \n width=\"100%\" \n height=\"100%\"\n viewBox=\"0 0 100 ${this.height}\"\n preserveAspectRatio=\"${preserveAspectRatio}\"\n style=\"display: block;\">\n </svg>\n ${this.showTooltip ? '<div class=\"mini-chart-tooltip\" style=\"display: none;\"></div>' : ''}\n </div>\n `;\n }\n\n async onAfterRender() {\n this.svg = this.element.querySelector('.mini-chart-svg');\n this.tooltip = this.element.querySelector('.mini-chart-tooltip');\n \n // Get actual rendered dimensions\n this.updateDimensions();\n \n if (this.data && this.data.length > 0) {\n this.renderChart();\n }\n \n // Setup hover interactions if tooltip enabled\n if (this.showTooltip && this.svg) {\n this.setupTooltip();\n }\n \n // Setup resize observer for responsive behavior\n this.setupResizeObserver();\n }\n\n updateDimensions() {\n if (!this.svg) return;\n \n const rect = this.svg.getBoundingClientRect();\n this.actualWidth = rect.width || 100;\n this.actualHeight = rect.height || this.height;\n \n // Update viewBox to match aspect ratio\n this.svg.setAttribute('viewBox', `0 0 ${this.actualWidth} ${this.actualHeight}`);\n }\n\n setupResizeObserver() {\n if (typeof ResizeObserver === 'undefined') return;\n \n this.resizeObserver = new ResizeObserver(() => {\n this.updateDimensions();\n if (this.data && this.data.length > 0) {\n this.renderChart();\n }\n });\n \n if (this.svg) {\n this.resizeObserver.observe(this.svg);\n }\n }\n\n renderChart() {\n if (!this.svg || !this.data || this.data.length === 0) return;\n\n // Clear previous content\n this.svg.innerHTML = '';\n\n // Calculate bounds\n const { min, max } = this.calculateBounds();\n \n if (this.chartType === 'line') {\n this.renderLine(min, max);\n } else if (this.chartType === 'bar') {\n this.renderBar(min, max);\n }\n\n // Add crosshair line (initially hidden)\n if (this.showCrosshair) {\n const height = this.getActualHeight();\n this.crosshair = this.createSVGElement('line', {\n x1: 0,\n y1: 0,\n x2: 0,\n y2: height,\n stroke: this.crosshairColor,\n 'stroke-width': this.crosshairWidth,\n 'stroke-dasharray': '3,3',\n style: 'display: none; pointer-events: none;'\n });\n this.svg.appendChild(this.crosshair);\n }\n\n // Setup tooltip hit areas after rendering chart\n if (this.showTooltip && this.tooltip) {\n this.setupTooltip();\n }\n\n // Apply animation if enabled\n if (this.animate) {\n this.applyAnimation();\n }\n }\n\n calculateBounds() {\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n \n let min = this.minValue !== undefined ? this.minValue : Math.min(...values);\n let max = this.maxValue !== undefined ? this.maxValue : Math.max(...values);\n \n // Add padding to range\n const range = max - min;\n if (range === 0) {\n min = min - 1;\n max = max + 1;\n }\n \n return { min, max };\n }\n\n getActualWidth() {\n return this.actualWidth || this.width || 100;\n }\n\n getActualHeight() {\n return this.actualHeight || this.height || 30;\n }\n\n renderLine(min, max) {\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n const points = this.calculatePoints(values, min, max);\n \n // Create filled area under line\n if (this.fill) {\n const areaPath = this.createAreaPath(points);\n const area = this.createSVGElement('path', {\n d: areaPath,\n fill: this.fillColor,\n stroke: 'none'\n });\n this.svg.appendChild(area);\n }\n \n // Create line path\n const linePath = this.smoothing > 0 \n ? this.createSmoothPath(points) \n : this.createLinePath(points);\n \n const line = this.createSVGElement('path', {\n d: linePath,\n fill: 'none',\n stroke: this.color,\n 'stroke-width': this.strokeWidth,\n 'stroke-linecap': 'round',\n 'stroke-linejoin': 'round'\n });\n this.svg.appendChild(line);\n \n // Add dots if enabled\n if (this.showDots) {\n points.forEach(point => {\n const dot = this.createSVGElement('circle', {\n cx: point.x,\n cy: point.y,\n r: this.dotRadius,\n fill: this.color\n });\n this.svg.appendChild(dot);\n });\n }\n }\n\n renderBar(min, max) {\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n const points = this.calculatePoints(values, min, max);\n \n const width = this.getActualWidth();\n const height = this.getActualHeight();\n const barWidth = (width - this.padding * 2 - (this.barGap * (values.length - 1))) / values.length;\n \n points.forEach((point, index) => {\n const barHeight = height - this.padding * 2 - point.y + this.padding;\n const x = point.x - barWidth / 2;\n const y = point.y;\n \n const bar = this.createSVGElement('rect', {\n x: x,\n y: y,\n width: barWidth,\n height: barHeight,\n fill: this.color,\n rx: 1, // Slight rounding\n 'data-bar-index': index,\n class: 'mini-chart-bar'\n });\n this.svg.appendChild(bar);\n });\n }\n\n calculatePoints(values, min, max) {\n const range = max - min;\n const width = this.getActualWidth();\n const height = this.getActualHeight();\n const xStep = (width - this.padding * 2) / (values.length - 1 || 1);\n const yScale = (height - this.padding * 2) / range;\n \n return values.map((value, index) => ({\n x: this.padding + (index * xStep),\n y: height - this.padding - ((value - min) * yScale)\n }));\n }\n\n createLinePath(points) {\n if (points.length === 0) return '';\n \n let path = `M ${points[0].x},${points[0].y}`;\n for (let i = 1; i < points.length; i++) {\n path += ` L ${points[i].x},${points[i].y}`;\n }\n return path;\n }\n\n createSmoothPath(points) {\n if (points.length < 2) return this.createLinePath(points);\n \n let path = `M ${points[0].x},${points[0].y}`;\n \n for (let i = 0; i < points.length - 1; i++) {\n const current = points[i];\n const next = points[i + 1];\n \n // Calculate control points for cubic bezier curve\n const cp1x = current.x + (next.x - current.x) * this.smoothing;\n const cp1y = current.y;\n const cp2x = next.x - (next.x - current.x) * this.smoothing;\n const cp2y = next.y;\n \n path += ` C ${cp1x},${cp1y} ${cp2x},${cp2y} ${next.x},${next.y}`;\n }\n \n return path;\n }\n\n createAreaPath(points) {\n if (points.length === 0) return '';\n \n const linePath = this.smoothing > 0 \n ? this.createSmoothPath(points) \n : this.createLinePath(points);\n \n // Close the path along the bottom\n const lastPoint = points[points.length - 1];\n const firstPoint = points[0];\n const height = this.getActualHeight();\n \n return `${linePath} L ${lastPoint.x},${height - this.padding} L ${firstPoint.x},${height - this.padding} Z`;\n }\n\n createSVGElement(tag, attributes = {}) {\n const element = document.createElementNS('http://www.w3.org/2000/svg', tag);\n Object.entries(attributes).forEach(([key, value]) => {\n element.setAttribute(key, value);\n });\n return element;\n }\n\n applyAnimation() {\n const paths = this.svg.querySelectorAll('path');\n paths.forEach(path => {\n const length = path.getTotalLength();\n path.style.strokeDasharray = length;\n path.style.strokeDashoffset = length;\n path.style.animation = `mini-chart-draw ${this.animationDuration}ms ease-out forwards`;\n });\n \n const bars = this.svg.querySelectorAll('rect');\n bars.forEach((bar, index) => {\n bar.style.transformOrigin = 'bottom';\n bar.style.animation = `mini-chart-bar-grow ${this.animationDuration}ms ease-out ${index * 20}ms forwards`;\n bar.style.transform = 'scaleY(0)';\n });\n }\n\n setupTooltip() {\n if (!this.svg || !this.tooltip) return;\n \n // Create invisible overlay rects for hover detection\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n const points = this.calculatePoints(values, ...Object.values(this.calculateBounds()));\n \n const width = this.getActualWidth();\n const height = this.getActualHeight();\n const barWidth = width / values.length;\n \n points.forEach((point, index) => {\n const hitArea = this.createSVGElement('rect', {\n x: index * barWidth,\n y: 0,\n width: barWidth,\n height: height,\n fill: 'transparent',\n style: 'cursor: pointer;'\n });\n \n hitArea.addEventListener('mouseenter', (e) => {\n this.showTooltipAtIndex(index, e);\n });\n \n hitArea.addEventListener('mousemove', (e) => {\n this.updateTooltipPosition(e);\n });\n \n hitArea.addEventListener('mouseleave', () => {\n this.hideTooltip();\n });\n \n this.svg.appendChild(hitArea);\n });\n }\n\n showTooltipAtIndex(index, event) {\n if (!this.tooltip) return;\n \n this.hoveredIndex = index;\n const value = typeof this.data[index] === 'object' ? this.data[index].value : this.data[index];\n const label = typeof this.data[index] === 'object' ? this.data[index].label : null;\n \n // Format the value\n let displayValue = value;\n if (this.tooltipFormatter) {\n if (typeof this.tooltipFormatter === 'function') {\n displayValue = this.tooltipFormatter(value, index);\n }\n } else {\n displayValue = typeof value === 'number' ? value.toLocaleString() : value;\n }\n \n // Build tooltip content\n let content = `<strong>${displayValue}</strong>`;\n if (label) {\n content = `${label}<br>${content}`;\n }\n \n this.tooltip.innerHTML = content;\n this.tooltip.style.display = 'block';\n this.updateTooltipPosition(event);\n \n // Highlight bar if in bar chart mode\n if (this.chartType === 'bar') {\n this.highlightBar(index);\n }\n \n // Show crosshair at the hovered position\n if (this.crosshair && this.showCrosshair) {\n const width = this.getActualWidth();\n const barWidth = width / this.data.length;\n const x = (index * barWidth) + (barWidth / 2);\n this.crosshair.setAttribute('x1', x);\n this.crosshair.setAttribute('x2', x);\n this.crosshair.style.display = 'block';\n }\n }\n\n updateTooltipPosition(event) {\n if (!this.tooltip || this.tooltip.style.display === 'none') return;\n \n const rect = this.svg.getBoundingClientRect();\n const x = event.clientX - rect.left;\n const y = event.clientY - rect.top;\n \n // Position tooltip above cursor\n this.tooltip.style.left = `${x}px`;\n this.tooltip.style.top = `${y - 10}px`;\n this.tooltip.style.transform = 'translate(-50%, -100%)';\n }\n\n hideTooltip() {\n if (this.tooltip) {\n this.tooltip.style.display = 'none';\n this.hoveredIndex = -1;\n }\n \n // Remove bar highlight\n if (this.chartType === 'bar') {\n this.unhighlightBars();\n }\n \n // Hide crosshair\n if (this.crosshair) {\n this.crosshair.style.display = 'none';\n }\n }\n\n highlightBar(index) {\n if (!this.svg) return;\n \n // Remove previous highlights\n this.unhighlightBars();\n \n // Highlight the hovered bar\n const bar = this.svg.querySelector(`rect.mini-chart-bar[data-bar-index=\"${index}\"]`);\n if (bar) {\n bar.style.opacity = '0.7';\n }\n }\n\n unhighlightBars() {\n if (!this.svg) return;\n \n const bars = this.svg.querySelectorAll('rect.mini-chart-bar');\n bars.forEach(bar => {\n bar.style.opacity = '1';\n });\n }\n\n // Public API\n setData(data) {\n this.data = data;\n if (this.svg) {\n this.renderChart();\n }\n }\n\n setColor(color) {\n this.color = color;\n if (this.svg) {\n this.renderChart();\n }\n }\n\n setType(type) {\n if (['line', 'bar'].includes(type)) {\n this.chartType = type;\n if (this.svg) {\n this.renderChart();\n }\n }\n }\n\n resize(width, height) {\n this.width = width;\n this.height = height;\n this.updateDimensions();\n if (this.svg) {\n this.renderChart();\n }\n }\n\n async onBeforeDestroy() {\n // Clean up resize observer\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n this.resizeObserver = null;\n }\n await super.onBeforeDestroy();\n }\n}\n","/**\n * MetricsMiniChart - Metrics display with integrated mini sparkline\n * Shows a metric value with label and a small trend chart\n * Supports the same /api/metrics/fetch API as MetricsChart\n */\n\nimport View from '@core/View.js';\nimport MiniChart from './MiniChart.js';\n\nexport default class MetricsMiniChart extends View {\n constructor(options = {}) {\n super({\n className: 'metrics-mini-chart',\n ...options\n });\n\n // Metric data\n this.label = options.label || '';\n this.value = options.value || 0;\n this.data = options.data || [];\n this.trend = options.trend; // 'up', 'down', or auto-calculate\n this.trendValue = options.trendValue; // Percentage change\n \n // Chart configuration\n this.chartType = options.chartType || 'line';\n this.chartWidth = options.chartWidth || 100;\n this.chartHeight = options.chartHeight || 40;\n this.chartColor = options.chartColor || 'rgba(54, 162, 235, 1)';\n this.fill = options.fill !== false;\n this.smoothing = options.smoothing || 0.3;\n \n // Formatting\n this.valueFormatter = options.valueFormatter || null;\n this.suffix = options.suffix || '';\n this.prefix = options.prefix || '';\n \n // Styling\n this.variant = options.variant || 'default'; // 'default', 'success', 'danger', 'warning', 'info'\n this.size = options.size || 'md'; // 'sm', 'md', 'lg'\n \n // Layout\n this.layout = options.layout || 'horizontal'; // 'horizontal' or 'vertical'\n \n // API configuration (matching MetricsChart)\n this.endpoint = options.endpoint || '/api/metrics/fetch';\n this.account = options.account || 'global';\n this.granularity = options.granularity || 'hours';\n this.slugs = options.slugs || null; // Single slug or array of slugs\n this.category = options.category || null;\n this.dateStart = options.dateStart || null;\n this.dateEnd = options.dateEnd || null;\n this.defaultDateRange = options.defaultDateRange || '24h';\n \n // State\n this.isLoading = false;\n this.lastFetch = null;\n this.refreshInterval = options.refreshInterval;\n \n // Initialize date range if missing\n if (!this.dateStart || !this.dateEnd) {\n this.setQuickRange(this.defaultDateRange);\n }\n \n // Normalize slugs to array\n if (this.slugs && !Array.isArray(this.slugs)) {\n this.slugs = [this.slugs];\n }\n \n // Create mini chart instance\n this.miniChart = null;\n }\n\n getTemplate() {\n const sizeClass = `metrics-mini-chart-${this.size}`;\n const variantClass = this.variant !== 'default' ? `metrics-mini-chart-${this.variant}` : '';\n const layoutClass = `metrics-mini-chart-${this.layout}`;\n \n return `\n <div class=\"metrics-mini-chart-container ${sizeClass} ${variantClass} ${layoutClass}\">\n <div class=\"metrics-info\">\n <div class=\"metrics-label\">${this.escapeHtml(this.label)}</div>\n <div class=\"metrics-value-row\">\n <div class=\"metrics-value\" data-ref=\"value\">\n ${this.formatValue(this.value)}\n </div>\n ${this.renderTrendBadge()}\n </div>\n </div>\n <div class=\"metrics-chart\" data-container=\"chart\"></div>\n </div>\n `;\n }\n\n async onInit() {\n // Create mini chart\n this.miniChart = new MiniChart({\n chartType: this.chartType,\n data: this.data,\n width: this.chartWidth,\n height: this.chartHeight,\n color: this.getChartColor(),\n fillColor: this.getFillColor(),\n fill: this.fill,\n smoothing: this.smoothing,\n animate: true\n });\n \n this.addChild(this.miniChart, 'chart');\n \n // Setup auto-refresh if configured\n if (this.refreshInterval && this.endpoint) {\n this.startAutoRefresh();\n }\n }\n\n async onAfterRender() {\n await super.onAfterRender();\n \n // Fetch initial data if endpoint provided\n if (this.endpoint && this.data.length === 0) {\n await this.fetchData();\n }\n }\n\n renderTrendBadge() {\n if (!this.trend && this.trendValue === undefined) {\n return '';\n }\n \n const trend = this.trend || (this.trendValue > 0 ? 'up' : 'down');\n const trendIcon = trend === 'up' ? 'bi-arrow-up' : 'bi-arrow-down';\n const trendClass = trend === 'up' ? 'trend-up' : 'trend-down';\n const trendValueStr = this.trendValue !== undefined \n ? `${Math.abs(this.trendValue)}%` \n : '';\n \n return `\n <span class=\"metrics-trend ${trendClass}\">\n <i class=\"bi ${trendIcon}\"></i>\n ${trendValueStr}\n </span>\n `;\n }\n\n getChartColor() {\n // Return color based on variant\n const colorMap = {\n success: 'rgba(75, 192, 192, 1)',\n danger: 'rgba(255, 99, 132, 1)',\n warning: 'rgba(255, 206, 86, 1)',\n info: 'rgba(54, 162, 235, 1)',\n default: this.chartColor\n };\n \n return colorMap[this.variant] || this.chartColor;\n }\n\n getFillColor() {\n const color = this.getChartColor();\n // Convert to fill with low opacity\n return color.replace(/[\\d.]+\\)$/, '0.1)');\n }\n\n formatValue(value) {\n let formatted = value;\n \n if (this.valueFormatter) {\n // Use custom formatter\n if (typeof this.valueFormatter === 'function') {\n formatted = this.valueFormatter(value);\n } else if (this.dataFormatter) {\n formatted = this.dataFormatter.pipe(value, this.valueFormatter);\n }\n } else {\n // Default formatting\n if (typeof value === 'number') {\n formatted = value.toLocaleString();\n }\n }\n \n return `${this.prefix}${formatted}${this.suffix}`;\n }\n\n escapeHtml(text) {\n const div = document.createElement('div');\n div.textContent = text;\n return div.innerHTML;\n }\n\n buildApiParams() {\n const params = {\n granularity: this.granularity,\n account: this.account,\n with_labels: true\n };\n\n // Add slugs\n if (this.slugs && this.slugs.length > 0) {\n this.slugs.forEach(slug => {\n if (!params['slugs[]']) params['slugs[]'] = [];\n params['slugs[]'].push(slug);\n });\n }\n\n if (this.category) {\n params.category = this.category;\n }\n\n // Date range\n if (this.dateStart) {\n params.dr_start = Math.floor(this.dateStart.getTime() / 1000);\n }\n if (this.dateEnd) {\n params.dr_end = Math.floor(this.dateEnd.getTime() / 1000);\n }\n\n // Cache buster\n params._ = Date.now();\n\n return params;\n }\n\n async fetchData() {\n if (!this.endpoint) return;\n \n this.isLoading = true;\n \n try {\n const rest = this.getApp()?.rest;\n if (!rest) {\n throw new Error('No REST client available');\n }\n \n const params = this.buildApiParams();\n const response = await rest.GET(this.endpoint, params);\n \n // Handle Rest standardized response\n if (!response.success) {\n throw new Error(response.message || 'Network error');\n }\n if (!response.data?.status) {\n throw new Error(response.data?.error || 'Server error');\n }\n \n const metricsData = response.data.data;\n this.processMetricsData(metricsData);\n this.lastFetch = new Date();\n \n // Re-render to show updated values\n await this.render();\n \n this.emit('metrics:loaded', { chart: this, data: metricsData, params });\n \n } catch (error) {\n console.error('Failed to fetch metrics:', error);\n this.emit('metrics:error', { chart: this, error });\n } finally {\n this.isLoading = false;\n }\n }\n\n processMetricsData(metricsData) {\n // Expecting: { labels: [...], data: { metric_slug: [values...] } }\n const { data: metrics, labels } = metricsData;\n \n if (!metrics) return;\n \n // Get the first (or only) metric's data\n const metricKeys = Object.keys(metrics);\n if (metricKeys.length === 0) return;\n \n const metricSlug = metricKeys[0];\n const values = metrics[metricSlug];\n \n // Sanitize values\n const sanitizedValues = values.map(val => {\n if (val === null || val === undefined || val === '') return 0;\n return typeof val === 'number' ? val : (parseFloat(val) || 0);\n });\n \n // Update chart data\n this.setData(sanitizedValues);\n \n // Calculate current value (latest data point)\n const currentValue = sanitizedValues[sanitizedValues.length - 1] || 0;\n this.setValue(currentValue);\n \n // Auto-calculate trend if we have at least 2 data points\n if (sanitizedValues.length >= 2) {\n const firstValue = sanitizedValues[0];\n const lastValue = sanitizedValues[sanitizedValues.length - 1];\n \n if (firstValue !== 0) {\n this.trendValue = parseFloat(((lastValue - firstValue) / firstValue * 100).toFixed(1));\n this.trend = this.trendValue >= 0 ? 'up' : 'down';\n }\n }\n }\n\n setQuickRange(range) {\n const now = new Date();\n let startDate;\n\n switch (range) {\n case '1h':\n startDate = new Date(now.getTime() - (60 * 60 * 1000));\n break;\n case '24h':\n startDate = new Date(now.getTime() - (24 * 60 * 60 * 1000));\n break;\n case '7d':\n startDate = new Date(now.getTime() - (7 * 24 * 60 * 60 * 1000));\n break;\n case '30d':\n startDate = new Date(now.getTime() - (30 * 24 * 60 * 60 * 1000));\n break;\n default:\n startDate = new Date(now.getTime() - (24 * 60 * 60 * 1000));\n }\n\n this.dateStart = startDate;\n this.dateEnd = now;\n }\n\n startAutoRefresh() {\n if (this.refreshTimer) {\n clearInterval(this.refreshTimer);\n }\n \n this.refreshTimer = setInterval(() => {\n this.fetchData();\n }, this.refreshInterval);\n }\n\n stopAutoRefresh() {\n if (this.refreshTimer) {\n clearInterval(this.refreshTimer);\n this.refreshTimer = null;\n }\n }\n\n // Public API\n setValue(value) {\n this.value = value;\n const valueElement = this.element?.querySelector('[data-ref=\"value\"]');\n if (valueElement) {\n valueElement.textContent = this.formatValue(value);\n }\n }\n\n setData(data) {\n this.data = data;\n if (this.miniChart) {\n this.miniChart.setData(data);\n }\n \n // Auto-calculate trend if not set\n if (data.length >= 2 && this.trendValue === undefined) {\n const first = typeof data[0] === 'object' ? data[0].value : data[0];\n const last = typeof data[data.length - 1] === 'object' ? data[data.length - 1].value : data[data.length - 1];\n \n if (first !== 0) {\n this.trendValue = ((last - first) / first * 100).toFixed(1);\n this.trend = this.trendValue > 0 ? 'up' : 'down';\n }\n }\n }\n\n setLabel(label) {\n this.label = label;\n const labelElement = this.element?.querySelector('.metrics-label');\n if (labelElement) {\n labelElement.textContent = label;\n }\n }\n\n setVariant(variant) {\n if (this.element) {\n this.element.querySelector('.metrics-mini-chart-container')\n ?.classList.remove(`metrics-mini-chart-${this.variant}`);\n this.element.querySelector('.metrics-mini-chart-container')\n ?.classList.add(`metrics-mini-chart-${variant}`);\n }\n this.variant = variant;\n \n if (this.miniChart) {\n this.miniChart.setColor(this.getChartColor());\n }\n }\n\n refresh() {\n return this.fetchData();\n }\n\n async onBeforeDestroy() {\n this.stopAutoRefresh();\n await super.onBeforeDestroy();\n }\n}\n"],"names":["MiniChart","View","constructor","options","super","className","this","chartType","data","width","height","maintainAspectRatio","color","fillColor","strokeWidth","barGap","fill","smoothing","padding","minValue","maxValue","showDots","dotRadius","animate","animationDuration","showTooltip","tooltipFormatter","showCrosshair","crosshairColor","crosshairWidth","tooltip","crosshair","hoveredIndex","getTemplate","widthStyle","heightStyle","preserveAspectRatio","onAfterRender","svg","element","querySelector","updateDimensions","length","renderChart","setupTooltip","setupResizeObserver","rect","getBoundingClientRect","actualWidth","actualHeight","setAttribute","ResizeObserver","resizeObserver","observe","innerHTML","min","max","calculateBounds","renderLine","renderBar","getActualHeight","createSVGElement","x1","y1","x2","y2","stroke","style","appendChild","applyAnimation","values","map","d","value","Math","getActualWidth","points","calculatePoints","areaPath","createAreaPath","area","linePath","createSmoothPath","createLinePath","line","forEach","point","dot","cx","x","cy","y","r","barWidth","index","barHeight","bar","rx","class","range","xStep","yScale","path","i","current","next","lastPoint","firstPoint","tag","attributes","document","createElementNS","Object","entries","key","querySelectorAll","getTotalLength","strokeDasharray","strokeDashoffset","animation","transformOrigin","transform","hitArea","addEventListener","e","showTooltipAtIndex","updateTooltipPosition","hideTooltip","event","label","displayValue","toLocaleString","content","display","highlightBar","clientX","left","clientY","top","unhighlightBars","opacity","setData","setColor","setType","type","includes","resize","onBeforeDestroy","disconnect","MetricsMiniChart","trend","trendValue","chartWidth","chartHeight","chartColor","valueFormatter","suffix","prefix","variant","size","layout","endpoint","account","granularity","slugs","category","dateStart","dateEnd","defaultDateRange","isLoading","lastFetch","refreshInterval","setQuickRange","Array","isArray","miniChart","escapeHtml","formatValue","renderTrendBadge","onInit","getChartColor","getFillColor","addChild","startAutoRefresh","fetchData","abs","success","danger","warning","info","default","replace","formatted","dataFormatter","pipe","text","div","createElement","textContent","buildApiParams","params","with_labels","slug","push","dr_start","floor","getTime","dr_end","_","Date","now","rest","getApp","Error","response","GET","message","status","error","metricsData","processMetricsData","render","emit","chart","console","metrics","labels","metricKeys","keys","sanitizedValues","val","parseFloat","currentValue","setValue","firstValue","lastValue","toFixed","startDate","refreshTimer","clearInterval","setInterval","stopAutoRefresh","valueElement","first","last","setLabel","labelElement","setVariant","classList","remove","add","refresh"],"mappings":"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"}
1
+ {"version":3,"file":"charts.cjs.js","sources":["../src/extensions/charts/MiniChart.js","../src/extensions/charts/MetricsMiniChart.js"],"sourcesContent":["/**\n * MiniChart - Lightweight sparkline chart component\n * Renders simple line or bar charts with minimal configuration\n * Uses SVG for crisp rendering at any size\n */\n\nimport View from '@core/View.js';\n\nexport default class MiniChart extends View {\n constructor(options = {}) {\n super({\n className: 'mini-chart',\n ...options\n });\n\n // Chart type: 'line' or 'bar'\n this.chartType = options.chartType || 'line';\n \n // Data\n this.data = options.data || [];\n \n // Dimensions\n this.width = options.width || '100%'; // Support both number and '100%'\n this.height = options.height || 30;\n this.maintainAspectRatio = options.maintainAspectRatio || false;\n \n // Styling\n this.color = options.color || 'rgba(54, 162, 235, 1)'; // Primary blue\n this.fillColor = options.fillColor || 'rgba(54, 162, 235, 0.1)'; // Light fill\n this.strokeWidth = options.strokeWidth || 2;\n this.barGap = options.barGap || 2;\n \n // Fill area under line\n this.fill = options.fill !== false; // Default true\n \n // Curve smoothing (0 = straight lines, 1 = very smooth)\n this.smoothing = options.smoothing || 0.3;\n \n // Padding\n this.padding = options.padding || 2;\n \n // Min/Max values (auto-calculated if not provided)\n this.minValue = options.minValue;\n this.maxValue = options.maxValue;\n \n // Show dots on line chart\n this.showDots = options.showDots || false;\n this.dotRadius = options.dotRadius || 2;\n \n // Animation\n this.animate = options.animate !== false;\n this.animationDuration = options.animationDuration || 300;\n \n // Tooltip\n this.showTooltip = options.showTooltip !== false;\n this.tooltipFormatter = options.tooltipFormatter || null;\n \n // Crosshair\n this.showCrosshair = options.showCrosshair !== false;\n this.crosshairColor = options.crosshairColor || 'rgba(0, 0, 0, 0.2)';\n this.crosshairWidth = options.crosshairWidth || 1;\n \n // X-axis\n this.showXAxis = options.showXAxis || false;\n this.xAxisColor = options.xAxisColor || this.color;\n this.xAxisWidth = options.xAxisWidth || 1;\n this.xAxisDashed = options.xAxisDashed !== false;\n \n // Tooltip state\n this.tooltip = null;\n this.crosshair = null;\n this.hoveredIndex = -1;\n }\n\n getTemplate() {\n const widthStyle = typeof this.width === 'number' ? `${this.width}px` : this.width;\n const heightStyle = typeof this.height === 'number' ? `${this.height}px` : this.height;\n const preserveAspectRatio = this.maintainAspectRatio ? 'xMidYMid meet' : 'none';\n \n return `\n <div class=\"mini-chart-wrapper\" style=\"position: relative; display: block; width: ${widthStyle}; height: ${heightStyle};\">\n <svg \n class=\"mini-chart-svg\" \n width=\"100%\" \n height=\"100%\"\n viewBox=\"0 0 100 ${this.height}\"\n preserveAspectRatio=\"${preserveAspectRatio}\"\n style=\"display: block;\">\n </svg>\n ${this.showTooltip ? '<div class=\"mini-chart-tooltip\" style=\"display: none;\"></div>' : ''}\n </div>\n `;\n }\n\n async onAfterRender() {\n this.svg = this.element.querySelector('.mini-chart-svg');\n this.tooltip = this.element.querySelector('.mini-chart-tooltip');\n \n // Get actual rendered dimensions\n this.updateDimensions();\n \n if (this.data && this.data.length > 0) {\n this.renderChart();\n }\n \n // Setup hover interactions if tooltip enabled\n if (this.showTooltip && this.svg) {\n this.setupTooltip();\n }\n \n // Setup resize observer for responsive behavior\n this.setupResizeObserver();\n }\n\n updateDimensions() {\n if (!this.svg) return;\n \n const rect = this.svg.getBoundingClientRect();\n this.actualWidth = rect.width || 100;\n this.actualHeight = rect.height || this.height;\n \n // Update viewBox to match aspect ratio\n this.svg.setAttribute('viewBox', `0 0 ${this.actualWidth} ${this.actualHeight}`);\n }\n\n setupResizeObserver() {\n if (typeof ResizeObserver === 'undefined') return;\n \n this.resizeObserver = new ResizeObserver(() => {\n this.updateDimensions();\n if (this.data && this.data.length > 0) {\n this.renderChart();\n }\n });\n \n if (this.svg) {\n this.resizeObserver.observe(this.svg);\n }\n }\n\n renderChart() {\n if (!this.svg || !this.data || this.data.length === 0) return;\n\n // Clear previous content\n this.svg.innerHTML = '';\n\n // Calculate bounds\n const { min, max } = this.calculateBounds();\n \n // Add x-axis line if enabled (render first so it's behind chart)\n if (this.showXAxis) {\n this.renderXAxis(min, max);\n }\n \n if (this.chartType === 'line') {\n this.renderLine(min, max);\n } else if (this.chartType === 'bar') {\n this.renderBar(min, max);\n }\n\n // Add crosshair line (initially hidden)\n if (this.showCrosshair) {\n const height = this.getActualHeight();\n this.crosshair = this.createSVGElement('line', {\n x1: 0,\n y1: 0,\n x2: 0,\n y2: height,\n stroke: this.crosshairColor,\n 'stroke-width': this.crosshairWidth,\n 'stroke-dasharray': '3,3',\n style: 'display: none; pointer-events: none;'\n });\n this.svg.appendChild(this.crosshair);\n }\n\n // Setup tooltip hit areas after rendering chart\n if (this.showTooltip && this.tooltip) {\n this.setupTooltip();\n }\n\n // Apply animation if enabled\n if (this.animate) {\n this.applyAnimation();\n }\n }\n\n renderXAxis(min, max) {\n const width = this.getActualWidth();\n const height = this.getActualHeight();\n \n // Calculate y position for x-axis (at zero if data crosses zero, otherwise at bottom)\n let yPos;\n if (min <= 0 && max >= 0) {\n // Data crosses zero, place axis at zero\n const range = max - min;\n const yScale = (height - this.padding * 2) / range;\n yPos = height - this.padding - ((0 - min) * yScale);\n } else {\n // Place at bottom\n yPos = height - this.padding;\n }\n \n const xAxis = this.createSVGElement('line', {\n x1: this.padding,\n y1: yPos,\n x2: width - this.padding,\n y2: yPos,\n stroke: this.xAxisColor,\n 'stroke-width': this.xAxisWidth,\n 'stroke-dasharray': this.xAxisDashed ? '2,2' : 'none',\n 'stroke-opacity': '0.5'\n });\n \n this.svg.appendChild(xAxis);\n }\n\n calculateBounds() {\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n \n let min = this.minValue !== undefined ? this.minValue : Math.min(...values);\n let max = this.maxValue !== undefined ? this.maxValue : Math.max(...values);\n \n // Add padding to range\n const range = max - min;\n if (range === 0) {\n min = min - 1;\n max = max + 1;\n }\n \n return { min, max };\n }\n\n getActualWidth() {\n return this.actualWidth || this.width || 100;\n }\n\n getActualHeight() {\n return this.actualHeight || this.height || 30;\n }\n\n renderLine(min, max) {\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n const points = this.calculatePoints(values, min, max);\n \n // Create filled area under line\n if (this.fill) {\n const areaPath = this.createAreaPath(points);\n const area = this.createSVGElement('path', {\n d: areaPath,\n fill: this.fillColor,\n stroke: 'none'\n });\n this.svg.appendChild(area);\n }\n \n // Create line path\n const linePath = this.smoothing > 0 \n ? this.createSmoothPath(points) \n : this.createLinePath(points);\n \n const line = this.createSVGElement('path', {\n d: linePath,\n fill: 'none',\n stroke: this.color,\n 'stroke-width': this.strokeWidth,\n 'stroke-linecap': 'round',\n 'stroke-linejoin': 'round'\n });\n this.svg.appendChild(line);\n \n // Add dots if enabled\n if (this.showDots) {\n points.forEach(point => {\n const dot = this.createSVGElement('circle', {\n cx: point.x,\n cy: point.y,\n r: this.dotRadius,\n fill: this.color\n });\n this.svg.appendChild(dot);\n });\n }\n }\n\n renderBar(min, max) {\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n const points = this.calculatePoints(values, min, max);\n \n const width = this.getActualWidth();\n const height = this.getActualHeight();\n const barWidth = (width - this.padding * 2 - (this.barGap * (values.length - 1))) / values.length;\n \n points.forEach((point, index) => {\n const barHeight = height - this.padding * 2 - point.y + this.padding;\n const x = point.x - barWidth / 2;\n const y = point.y;\n \n const bar = this.createSVGElement('rect', {\n x: x,\n y: y,\n width: barWidth,\n height: barHeight,\n fill: this.color,\n rx: 1, // Slight rounding\n 'data-bar-index': index,\n class: 'mini-chart-bar'\n });\n this.svg.appendChild(bar);\n });\n }\n\n calculatePoints(values, min, max) {\n const range = max - min;\n const width = this.getActualWidth();\n const height = this.getActualHeight();\n const xStep = (width - this.padding * 2) / (values.length - 1 || 1);\n const yScale = (height - this.padding * 2) / range;\n \n return values.map((value, index) => ({\n x: this.padding + (index * xStep),\n y: height - this.padding - ((value - min) * yScale)\n }));\n }\n\n createLinePath(points) {\n if (points.length === 0) return '';\n \n let path = `M ${points[0].x},${points[0].y}`;\n for (let i = 1; i < points.length; i++) {\n path += ` L ${points[i].x},${points[i].y}`;\n }\n return path;\n }\n\n createSmoothPath(points) {\n if (points.length < 2) return this.createLinePath(points);\n \n let path = `M ${points[0].x},${points[0].y}`;\n \n for (let i = 0; i < points.length - 1; i++) {\n const current = points[i];\n const next = points[i + 1];\n \n // Calculate control points for cubic bezier curve\n const cp1x = current.x + (next.x - current.x) * this.smoothing;\n const cp1y = current.y;\n const cp2x = next.x - (next.x - current.x) * this.smoothing;\n const cp2y = next.y;\n \n path += ` C ${cp1x},${cp1y} ${cp2x},${cp2y} ${next.x},${next.y}`;\n }\n \n return path;\n }\n\n createAreaPath(points) {\n if (points.length === 0) return '';\n \n const linePath = this.smoothing > 0 \n ? this.createSmoothPath(points) \n : this.createLinePath(points);\n \n // Close the path along the bottom\n const lastPoint = points[points.length - 1];\n const firstPoint = points[0];\n const height = this.getActualHeight();\n \n return `${linePath} L ${lastPoint.x},${height - this.padding} L ${firstPoint.x},${height - this.padding} Z`;\n }\n\n createSVGElement(tag, attributes = {}) {\n const element = document.createElementNS('http://www.w3.org/2000/svg', tag);\n Object.entries(attributes).forEach(([key, value]) => {\n element.setAttribute(key, value);\n });\n return element;\n }\n\n applyAnimation() {\n const paths = this.svg.querySelectorAll('path');\n paths.forEach(path => {\n const length = path.getTotalLength();\n path.style.strokeDasharray = length;\n path.style.strokeDashoffset = length;\n path.style.animation = `mini-chart-draw ${this.animationDuration}ms ease-out forwards`;\n });\n \n const bars = this.svg.querySelectorAll('rect');\n bars.forEach((bar, index) => {\n bar.style.transformOrigin = 'bottom';\n bar.style.animation = `mini-chart-bar-grow ${this.animationDuration}ms ease-out ${index * 20}ms forwards`;\n bar.style.transform = 'scaleY(0)';\n });\n }\n\n setupTooltip() {\n if (!this.svg || !this.tooltip) return;\n \n // Create invisible overlay rects for hover detection\n const values = this.data.map(d => typeof d === 'object' ? d.value : d);\n const points = this.calculatePoints(values, ...Object.values(this.calculateBounds()));\n \n const width = this.getActualWidth();\n const height = this.getActualHeight();\n const barWidth = width / values.length;\n \n points.forEach((point, index) => {\n const hitArea = this.createSVGElement('rect', {\n x: index * barWidth,\n y: 0,\n width: barWidth,\n height: height,\n fill: 'transparent',\n style: 'cursor: pointer;'\n });\n \n hitArea.addEventListener('mouseenter', (e) => {\n this.showTooltipAtIndex(index, e);\n });\n \n hitArea.addEventListener('mousemove', (e) => {\n this.updateTooltipPosition(e);\n });\n \n hitArea.addEventListener('mouseleave', () => {\n this.hideTooltip();\n });\n \n this.svg.appendChild(hitArea);\n });\n }\n\n showTooltipAtIndex(index, event) {\n if (!this.tooltip) return;\n \n this.hoveredIndex = index;\n const value = typeof this.data[index] === 'object' ? this.data[index].value : this.data[index];\n const label = typeof this.data[index] === 'object' ? this.data[index].label : null;\n \n // Format the value\n let displayValue = value;\n if (this.tooltipFormatter) {\n if (typeof this.tooltipFormatter === 'function') {\n displayValue = this.tooltipFormatter(value, index);\n }\n } else {\n displayValue = typeof value === 'number' ? value.toLocaleString() : value;\n }\n \n // Build tooltip content\n let content = `<strong>${displayValue}</strong>`;\n if (label) {\n content = `${label}<br>${content}`;\n }\n \n this.tooltip.innerHTML = content;\n this.tooltip.style.display = 'block';\n this.updateTooltipPosition(event);\n \n // Highlight bar if in bar chart mode\n if (this.chartType === 'bar') {\n this.highlightBar(index);\n }\n \n // Show crosshair at the hovered position\n if (this.crosshair && this.showCrosshair) {\n const width = this.getActualWidth();\n const barWidth = width / this.data.length;\n const x = (index * barWidth) + (barWidth / 2);\n this.crosshair.setAttribute('x1', x);\n this.crosshair.setAttribute('x2', x);\n this.crosshair.style.display = 'block';\n }\n }\n\n updateTooltipPosition(event) {\n if (!this.tooltip || this.tooltip.style.display === 'none') return;\n \n const rect = this.svg.getBoundingClientRect();\n const x = event.clientX - rect.left;\n const y = event.clientY - rect.top;\n \n // Position tooltip above cursor\n this.tooltip.style.left = `${x}px`;\n this.tooltip.style.top = `${y - 10}px`;\n this.tooltip.style.transform = 'translate(-50%, -100%)';\n }\n\n hideTooltip() {\n if (this.tooltip) {\n this.tooltip.style.display = 'none';\n this.hoveredIndex = -1;\n }\n \n // Remove bar highlight\n if (this.chartType === 'bar') {\n this.unhighlightBars();\n }\n \n // Hide crosshair\n if (this.crosshair) {\n this.crosshair.style.display = 'none';\n }\n }\n\n highlightBar(index) {\n if (!this.svg) return;\n \n // Remove previous highlights\n this.unhighlightBars();\n \n // Highlight the hovered bar\n const bar = this.svg.querySelector(`rect.mini-chart-bar[data-bar-index=\"${index}\"]`);\n if (bar) {\n bar.style.opacity = '0.7';\n }\n }\n\n unhighlightBars() {\n if (!this.svg) return;\n \n const bars = this.svg.querySelectorAll('rect.mini-chart-bar');\n bars.forEach(bar => {\n bar.style.opacity = '1';\n });\n }\n\n // Public API\n setData(data) {\n this.data = data;\n if (this.svg) {\n this.renderChart();\n }\n }\n\n setColor(color) {\n this.color = color;\n if (this.svg) {\n this.renderChart();\n }\n }\n\n setType(type) {\n if (['line', 'bar'].includes(type)) {\n this.chartType = type;\n if (this.svg) {\n this.renderChart();\n }\n }\n }\n\n resize(width, height) {\n this.width = width;\n this.height = height;\n this.updateDimensions();\n if (this.svg) {\n this.renderChart();\n }\n }\n\n async onBeforeDestroy() {\n // Clean up resize observer\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n this.resizeObserver = null;\n }\n await super.onBeforeDestroy();\n }\n}\n","/**\n * MetricsMiniChart - MiniChart with API integration\n * Extends MiniChart to add /api/metrics/fetch support (same API as MetricsChart)\n */\n\nimport MiniChart from './MiniChart.js';\n\nexport default class MetricsMiniChart extends MiniChart {\n constructor(options = {}) {\n super(options);\n \n // API configuration (matching MetricsChart)\n this.endpoint = options.endpoint || '/api/metrics/fetch';\n this.account = options.account || 'global';\n this.granularity = options.granularity || 'hours';\n this.slugs = options.slugs || null; // Single slug or array of slugs\n this.category = options.category || null;\n this.dateStart = options.dateStart || null;\n this.dateEnd = options.dateEnd || null;\n this.defaultDateRange = options.defaultDateRange || '24h';\n \n // State\n this.isLoading = false;\n this.lastFetch = null;\n this.refreshInterval = options.refreshInterval;\n \n // Initialize date range if missing\n if (!this.dateStart || !this.dateEnd) {\n this.setQuickRange(this.defaultDateRange);\n }\n \n // Normalize slugs to array\n if (this.slugs && !Array.isArray(this.slugs)) {\n this.slugs = [this.slugs];\n }\n }\n\n async onAfterRender() {\n await super.onAfterRender();\n \n // Fetch initial data if endpoint provided and no data\n if (this.endpoint && (!this.data || this.data.length === 0)) {\n await this.fetchData();\n }\n \n // Setup auto-refresh if configured\n if (this.refreshInterval && this.endpoint) {\n this.startAutoRefresh();\n }\n }\n\n buildApiParams() {\n const params = {\n granularity: this.granularity,\n account: this.account,\n with_labels: true\n };\n\n // Add slugs\n if (this.slugs && this.slugs.length > 0) {\n this.slugs.forEach(slug => {\n if (!params['slugs[]']) params['slugs[]'] = [];\n params['slugs[]'].push(slug);\n });\n }\n\n if (this.category) {\n params.category = this.category;\n }\n\n // Date range\n if (this.dateStart) {\n params.dr_start = Math.floor(this.dateStart.getTime() / 1000);\n }\n if (this.dateEnd) {\n params.dr_end = Math.floor(this.dateEnd.getTime() / 1000);\n }\n\n // Cache buster\n params._ = Date.now();\n\n return params;\n }\n\n async fetchData() {\n if (!this.endpoint) return;\n \n this.isLoading = true;\n \n try {\n const rest = this.getApp()?.rest;\n if (!rest) {\n throw new Error('No REST client available');\n }\n \n const params = this.buildApiParams();\n const response = await rest.GET(this.endpoint, params);\n \n // Handle Rest standardized response\n if (!response.success) {\n throw new Error(response.message || 'Network error');\n }\n if (!response.data?.status) {\n throw new Error(response.data?.error || 'Server error');\n }\n \n const metricsData = response.data.data;\n this.processMetricsData(metricsData);\n this.lastFetch = new Date();\n \n // Re-render to show updated values\n await this.render();\n \n this.emit('metrics:loaded', { chart: this, data: metricsData, params });\n \n } catch (error) {\n console.error('Failed to fetch metrics:', error);\n this.emit('metrics:error', { chart: this, error });\n } finally {\n this.isLoading = false;\n }\n }\n\n processMetricsData(metricsData) {\n // Expecting: { labels: [...], data: { metric_slug: [values...] } }\n const { data: metrics, labels } = metricsData;\n \n if (!metrics) return;\n \n // Get the first (or only) metric's data\n const metricKeys = Object.keys(metrics);\n if (metricKeys.length === 0) return;\n \n const metricSlug = metricKeys[0];\n const values = metrics[metricSlug];\n \n // Sanitize values\n const sanitizedValues = values.map(val => {\n if (val === null || val === undefined || val === '') return 0;\n return typeof val === 'number' ? val : (parseFloat(val) || 0);\n });\n \n // Update chart data\n this.setData(sanitizedValues);\n }\n\n setQuickRange(range) {\n const now = new Date();\n let startDate;\n\n switch (range) {\n case '1h':\n startDate = new Date(now.getTime() - (60 * 60 * 1000));\n break;\n case '24h':\n startDate = new Date(now.getTime() - (24 * 60 * 60 * 1000));\n break;\n case '7d':\n startDate = new Date(now.getTime() - (7 * 24 * 60 * 60 * 1000));\n break;\n case '30d':\n startDate = new Date(now.getTime() - (30 * 24 * 60 * 60 * 1000));\n break;\n default:\n startDate = new Date(now.getTime() - (24 * 60 * 60 * 1000));\n }\n\n this.dateStart = startDate;\n this.dateEnd = now;\n }\n\n startAutoRefresh() {\n if (this.refreshTimer) {\n clearInterval(this.refreshTimer);\n }\n \n this.refreshTimer = setInterval(() => {\n this.fetchData();\n }, this.refreshInterval);\n }\n\n stopAutoRefresh() {\n if (this.refreshTimer) {\n clearInterval(this.refreshTimer);\n this.refreshTimer = null;\n }\n }\n\n // Public API\n setGranularity(granularity) {\n this.granularity = granularity;\n return this.fetchData();\n }\n\n setDateRange(startDate, endDate) {\n this.dateStart = new Date(startDate);\n this.dateEnd = new Date(endDate);\n return this.fetchData();\n }\n\n setMetrics(slugs) {\n this.slugs = Array.isArray(slugs) ? slugs : [slugs];\n return this.fetchData();\n }\n\n refresh() {\n return this.fetchData();\n }\n\n async onBeforeDestroy() {\n this.stopAutoRefresh();\n await super.onBeforeDestroy();\n }\n}\n"],"names":["MiniChart","View","constructor","options","super","className","this","chartType","data","width","height","maintainAspectRatio","color","fillColor","strokeWidth","barGap","fill","smoothing","padding","minValue","maxValue","showDots","dotRadius","animate","animationDuration","showTooltip","tooltipFormatter","showCrosshair","crosshairColor","crosshairWidth","showXAxis","xAxisColor","xAxisWidth","xAxisDashed","tooltip","crosshair","hoveredIndex","getTemplate","widthStyle","heightStyle","preserveAspectRatio","onAfterRender","svg","element","querySelector","updateDimensions","length","renderChart","setupTooltip","setupResizeObserver","rect","getBoundingClientRect","actualWidth","actualHeight","setAttribute","ResizeObserver","resizeObserver","observe","innerHTML","min","max","calculateBounds","renderXAxis","renderLine","renderBar","getActualHeight","createSVGElement","x1","y1","x2","y2","stroke","style","appendChild","applyAnimation","getActualWidth","yPos","range","yScale","xAxis","values","map","d","value","Math","points","calculatePoints","areaPath","createAreaPath","area","linePath","createSmoothPath","createLinePath","line","forEach","point","dot","cx","x","cy","y","r","barWidth","index","barHeight","bar","rx","class","xStep","path","i","current","next","lastPoint","firstPoint","tag","attributes","document","createElementNS","Object","entries","key","querySelectorAll","getTotalLength","strokeDasharray","strokeDashoffset","animation","transformOrigin","transform","hitArea","addEventListener","e","showTooltipAtIndex","updateTooltipPosition","hideTooltip","event","label","displayValue","toLocaleString","content","display","highlightBar","clientX","left","clientY","top","unhighlightBars","opacity","setData","setColor","setType","type","includes","resize","onBeforeDestroy","disconnect","endpoint","account","granularity","slugs","category","dateStart","dateEnd","defaultDateRange","isLoading","lastFetch","refreshInterval","setQuickRange","Array","isArray","fetchData","startAutoRefresh","buildApiParams","params","with_labels","slug","push","dr_start","floor","getTime","dr_end","_","Date","now","rest","getApp","Error","response","GET","success","message","status","error","metricsData","processMetricsData","render","emit","chart","console","metrics","labels","metricKeys","keys","sanitizedValues","val","parseFloat","startDate","refreshTimer","clearInterval","setInterval","stopAutoRefresh","setGranularity","setDateRange","endDate","setMetrics","refresh"],"mappings":"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"}
package/dist/charts.es.js CHANGED
@@ -1,6 +1,6 @@
1
- import { B, M, P, S } from "./chunks/MetricsChart-fDEOs6eG.js";
2
- import { V as View } from "./chunks/WebApp-tr4cjBu1.js";
3
- import { B as B2, b, a, c, e, f, W } from "./chunks/WebApp-tr4cjBu1.js";
1
+ import { B, M, P, S } from "./chunks/MetricsChart-Bbn-L_9C.js";
2
+ import { V as View } from "./chunks/WebApp-zyQ4x8MK.js";
3
+ import { B as B2, b, a, c, e, f, W } from "./chunks/WebApp-zyQ4x8MK.js";
4
4
  class MiniChart extends View {
5
5
  constructor(options = {}) {
6
6
  super({
@@ -30,6 +30,10 @@ class MiniChart extends View {
30
30
  this.showCrosshair = options.showCrosshair !== false;
31
31
  this.crosshairColor = options.crosshairColor || "rgba(0, 0, 0, 0.2)";
32
32
  this.crosshairWidth = options.crosshairWidth || 1;
33
+ this.showXAxis = options.showXAxis || false;
34
+ this.xAxisColor = options.xAxisColor || this.color;
35
+ this.xAxisWidth = options.xAxisWidth || 1;
36
+ this.xAxisDashed = options.xAxisDashed !== false;
33
37
  this.tooltip = null;
34
38
  this.crosshair = null;
35
39
  this.hoveredIndex = -1;
@@ -87,6 +91,9 @@ class MiniChart extends View {
87
91
  if (!this.svg || !this.data || this.data.length === 0) return;
88
92
  this.svg.innerHTML = "";
89
93
  const { min, max } = this.calculateBounds();
94
+ if (this.showXAxis) {
95
+ this.renderXAxis(min, max);
96
+ }
90
97
  if (this.chartType === "line") {
91
98
  this.renderLine(min, max);
92
99
  } else if (this.chartType === "bar") {
@@ -113,6 +120,29 @@ class MiniChart extends View {
113
120
  this.applyAnimation();
114
121
  }
115
122
  }
123
+ renderXAxis(min, max) {
124
+ const width = this.getActualWidth();
125
+ const height = this.getActualHeight();
126
+ let yPos;
127
+ if (min <= 0 && max >= 0) {
128
+ const range = max - min;
129
+ const yScale = (height - this.padding * 2) / range;
130
+ yPos = height - this.padding - (0 - min) * yScale;
131
+ } else {
132
+ yPos = height - this.padding;
133
+ }
134
+ const xAxis = this.createSVGElement("line", {
135
+ x1: this.padding,
136
+ y1: yPos,
137
+ x2: width - this.padding,
138
+ y2: yPos,
139
+ stroke: this.xAxisColor,
140
+ "stroke-width": this.xAxisWidth,
141
+ "stroke-dasharray": this.xAxisDashed ? "2,2" : "none",
142
+ "stroke-opacity": "0.5"
143
+ });
144
+ this.svg.appendChild(xAxis);
145
+ }
116
146
  calculateBounds() {
117
147
  const values = this.data.map((d) => typeof d === "object" ? d.value : d);
118
148
  let min = this.minValue !== void 0 ? this.minValue : Math.min(...values);
@@ -384,29 +414,9 @@ class MiniChart extends View {
384
414
  await super.onBeforeDestroy();
385
415
  }
386
416
  }
387
- class MetricsMiniChart extends View {
417
+ class MetricsMiniChart extends MiniChart {
388
418
  constructor(options = {}) {
389
- super({
390
- className: "metrics-mini-chart",
391
- ...options
392
- });
393
- this.label = options.label || "";
394
- this.value = options.value || 0;
395
- this.data = options.data || [];
396
- this.trend = options.trend;
397
- this.trendValue = options.trendValue;
398
- this.chartType = options.chartType || "line";
399
- this.chartWidth = options.chartWidth || 100;
400
- this.chartHeight = options.chartHeight || 40;
401
- this.chartColor = options.chartColor || "rgba(54, 162, 235, 1)";
402
- this.fill = options.fill !== false;
403
- this.smoothing = options.smoothing || 0.3;
404
- this.valueFormatter = options.valueFormatter || null;
405
- this.suffix = options.suffix || "";
406
- this.prefix = options.prefix || "";
407
- this.variant = options.variant || "default";
408
- this.size = options.size || "md";
409
- this.layout = options.layout || "horizontal";
419
+ super(options);
410
420
  this.endpoint = options.endpoint || "/api/metrics/fetch";
411
421
  this.account = options.account || "global";
412
422
  this.granularity = options.granularity || "hours";
@@ -424,98 +434,15 @@ class MetricsMiniChart extends View {
424
434
  if (this.slugs && !Array.isArray(this.slugs)) {
425
435
  this.slugs = [this.slugs];
426
436
  }
427
- this.miniChart = null;
428
- }
429
- getTemplate() {
430
- const sizeClass = `metrics-mini-chart-${this.size}`;
431
- const variantClass = this.variant !== "default" ? `metrics-mini-chart-${this.variant}` : "";
432
- const layoutClass = `metrics-mini-chart-${this.layout}`;
433
- return `
434
- <div class="metrics-mini-chart-container ${sizeClass} ${variantClass} ${layoutClass}">
435
- <div class="metrics-info">
436
- <div class="metrics-label">${this.escapeHtml(this.label)}</div>
437
- <div class="metrics-value-row">
438
- <div class="metrics-value" data-ref="value">
439
- ${this.formatValue(this.value)}
440
- </div>
441
- ${this.renderTrendBadge()}
442
- </div>
443
- </div>
444
- <div class="metrics-chart" data-container="chart"></div>
445
- </div>
446
- `;
447
- }
448
- async onInit() {
449
- this.miniChart = new MiniChart({
450
- chartType: this.chartType,
451
- data: this.data,
452
- width: this.chartWidth,
453
- height: this.chartHeight,
454
- color: this.getChartColor(),
455
- fillColor: this.getFillColor(),
456
- fill: this.fill,
457
- smoothing: this.smoothing,
458
- animate: true
459
- });
460
- this.addChild(this.miniChart, "chart");
461
- if (this.refreshInterval && this.endpoint) {
462
- this.startAutoRefresh();
463
- }
464
437
  }
465
438
  async onAfterRender() {
466
439
  await super.onAfterRender();
467
- if (this.endpoint && this.data.length === 0) {
440
+ if (this.endpoint && (!this.data || this.data.length === 0)) {
468
441
  await this.fetchData();
469
442
  }
470
- }
471
- renderTrendBadge() {
472
- if (!this.trend && this.trendValue === void 0) {
473
- return "";
474
- }
475
- const trend = this.trend || (this.trendValue > 0 ? "up" : "down");
476
- const trendIcon = trend === "up" ? "bi-arrow-up" : "bi-arrow-down";
477
- const trendClass = trend === "up" ? "trend-up" : "trend-down";
478
- const trendValueStr = this.trendValue !== void 0 ? `${Math.abs(this.trendValue)}%` : "";
479
- return `
480
- <span class="metrics-trend ${trendClass}">
481
- <i class="bi ${trendIcon}"></i>
482
- ${trendValueStr}
483
- </span>
484
- `;
485
- }
486
- getChartColor() {
487
- const colorMap = {
488
- success: "rgba(75, 192, 192, 1)",
489
- danger: "rgba(255, 99, 132, 1)",
490
- warning: "rgba(255, 206, 86, 1)",
491
- info: "rgba(54, 162, 235, 1)",
492
- default: this.chartColor
493
- };
494
- return colorMap[this.variant] || this.chartColor;
495
- }
496
- getFillColor() {
497
- const color = this.getChartColor();
498
- return color.replace(/[\d.]+\)$/, "0.1)");
499
- }
500
- formatValue(value) {
501
- let formatted = value;
502
- if (this.valueFormatter) {
503
- if (typeof this.valueFormatter === "function") {
504
- formatted = this.valueFormatter(value);
505
- } else if (this.dataFormatter) {
506
- formatted = this.dataFormatter.pipe(value, this.valueFormatter);
507
- }
508
- } else {
509
- if (typeof value === "number") {
510
- formatted = value.toLocaleString();
511
- }
443
+ if (this.refreshInterval && this.endpoint) {
444
+ this.startAutoRefresh();
512
445
  }
513
- return `${this.prefix}${formatted}${this.suffix}`;
514
- }
515
- escapeHtml(text) {
516
- const div = document.createElement("div");
517
- div.textContent = text;
518
- return div.innerHTML;
519
446
  }
520
447
  buildApiParams() {
521
448
  const params = {
@@ -581,16 +508,6 @@ class MetricsMiniChart extends View {
581
508
  return typeof val === "number" ? val : parseFloat(val) || 0;
582
509
  });
583
510
  this.setData(sanitizedValues);
584
- const currentValue = sanitizedValues[sanitizedValues.length - 1] || 0;
585
- this.setValue(currentValue);
586
- if (sanitizedValues.length >= 2) {
587
- const firstValue = sanitizedValues[0];
588
- const lastValue = sanitizedValues[sanitizedValues.length - 1];
589
- if (firstValue !== 0) {
590
- this.trendValue = parseFloat(((lastValue - firstValue) / firstValue * 100).toFixed(1));
591
- this.trend = this.trendValue >= 0 ? "up" : "down";
592
- }
593
- }
594
511
  }
595
512
  setQuickRange(range) {
596
513
  const now = /* @__PURE__ */ new Date();
@@ -629,43 +546,18 @@ class MetricsMiniChart extends View {
629
546
  }
630
547
  }
631
548
  // Public API
632
- setValue(value) {
633
- this.value = value;
634
- const valueElement = this.element?.querySelector('[data-ref="value"]');
635
- if (valueElement) {
636
- valueElement.textContent = this.formatValue(value);
637
- }
638
- }
639
- setData(data) {
640
- this.data = data;
641
- if (this.miniChart) {
642
- this.miniChart.setData(data);
643
- }
644
- if (data.length >= 2 && this.trendValue === void 0) {
645
- const first = typeof data[0] === "object" ? data[0].value : data[0];
646
- const last = typeof data[data.length - 1] === "object" ? data[data.length - 1].value : data[data.length - 1];
647
- if (first !== 0) {
648
- this.trendValue = ((last - first) / first * 100).toFixed(1);
649
- this.trend = this.trendValue > 0 ? "up" : "down";
650
- }
651
- }
549
+ setGranularity(granularity) {
550
+ this.granularity = granularity;
551
+ return this.fetchData();
652
552
  }
653
- setLabel(label) {
654
- this.label = label;
655
- const labelElement = this.element?.querySelector(".metrics-label");
656
- if (labelElement) {
657
- labelElement.textContent = label;
658
- }
553
+ setDateRange(startDate, endDate) {
554
+ this.dateStart = new Date(startDate);
555
+ this.dateEnd = new Date(endDate);
556
+ return this.fetchData();
659
557
  }
660
- setVariant(variant) {
661
- if (this.element) {
662
- this.element.querySelector(".metrics-mini-chart-container")?.classList.remove(`metrics-mini-chart-${this.variant}`);
663
- this.element.querySelector(".metrics-mini-chart-container")?.classList.add(`metrics-mini-chart-${variant}`);
664
- }
665
- this.variant = variant;
666
- if (this.miniChart) {
667
- this.miniChart.setColor(this.getChartColor());
668
- }
558
+ setMetrics(slugs) {
559
+ this.slugs = Array.isArray(slugs) ? slugs : [slugs];
560
+ return this.fetchData();
669
561
  }
670
562
  refresh() {
671
563
  return this.fetchData();