drizzle-cube 0.4.21 → 0.4.23

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 (102) hide show
  1. package/dist/adapters/express/index.cjs +1 -1
  2. package/dist/adapters/express/index.js +2 -2
  3. package/dist/adapters/fastify/index.cjs +1 -1
  4. package/dist/adapters/fastify/index.js +2 -2
  5. package/dist/adapters/{handler-B-tEntiU.cjs → handler-C3hT7g2W.cjs} +1 -1
  6. package/dist/adapters/{handler-9Rdn7zM2.js → handler-t7Qd1IYi.js} +1 -1
  7. package/dist/adapters/hono/index.cjs +6 -6
  8. package/dist/adapters/hono/index.d.ts +13 -6
  9. package/dist/adapters/hono/index.js +65 -65
  10. package/dist/adapters/{mcp-transport-m1X1GtwG.js → mcp-transport-B6ZudTSk.js} +7 -0
  11. package/dist/adapters/{mcp-transport-8u9G5oNa.cjs → mcp-transport-DCiSGtp1.cjs} +1 -1
  12. package/dist/adapters/nextjs/index.cjs +2 -2
  13. package/dist/adapters/nextjs/index.js +2 -2
  14. package/dist/client/charts.js +12 -12
  15. package/dist/client/chunks/{RetentionCombinedChart-CLq89aOJ.js → RetentionCombinedChart-BK3NPsHP.js} +2 -2
  16. package/dist/client/chunks/{RetentionCombinedChart-CLq89aOJ.js.map → RetentionCombinedChart-BK3NPsHP.js.map} +1 -1
  17. package/dist/client/chunks/{analysis-builder-3z9fHE2F.js → analysis-builder-DVrv9Q4n.js} +9 -9
  18. package/dist/client/chunks/{analysis-builder-3z9fHE2F.js.map → analysis-builder-DVrv9Q4n.js.map} +1 -1
  19. package/dist/client/chunks/{analysis-builder-shared-Da-vlQa_.js → analysis-builder-shared-CrENEvEk.js} +6 -6
  20. package/dist/client/chunks/{analysis-builder-shared-Da-vlQa_.js.map → analysis-builder-shared-CrENEvEk.js.map} +1 -1
  21. package/dist/client/chunks/{chart-activity-grid-CPGcTSuh.js → chart-activity-grid-OG6he4YS.js} +2 -2
  22. package/dist/client/chunks/{chart-activity-grid-CPGcTSuh.js.map → chart-activity-grid-OG6he4YS.js.map} +1 -1
  23. package/dist/client/chunks/{chart-area-ByJQ7NZd.js → chart-area-TawAd2k9.js} +3 -3
  24. package/dist/client/chunks/{chart-area-ByJQ7NZd.js.map → chart-area-TawAd2k9.js.map} +1 -1
  25. package/dist/client/chunks/{chart-bar-dj14frMt.js → chart-bar-D3vtCNQG.js} +2 -2
  26. package/dist/client/chunks/{chart-bar-dj14frMt.js.map → chart-bar-D3vtCNQG.js.map} +1 -1
  27. package/dist/client/chunks/{chart-box-plot-ZatBpatq.js → chart-box-plot-BXwN2rO5.js} +2 -2
  28. package/dist/client/chunks/{chart-box-plot-ZatBpatq.js.map → chart-box-plot-BXwN2rO5.js.map} +1 -1
  29. package/dist/client/chunks/{chart-bubble-CemotLx-.js → chart-bubble-ZfNe8t5k.js} +2 -2
  30. package/dist/client/chunks/{chart-bubble-CemotLx-.js.map → chart-bubble-ZfNe8t5k.js.map} +1 -1
  31. package/dist/client/chunks/{chart-candlestick-BIR4uGGt.js → chart-candlestick-DmF3haFu.js} +2 -2
  32. package/dist/client/chunks/{chart-candlestick-BIR4uGGt.js.map → chart-candlestick-DmF3haFu.js.map} +1 -1
  33. package/dist/client/chunks/{chart-data-table-BsAjHe7o.js → chart-data-table-DJZPkArt.js} +4 -4
  34. package/dist/client/chunks/{chart-data-table-BsAjHe7o.js.map → chart-data-table-DJZPkArt.js.map} +1 -1
  35. package/dist/client/chunks/{chart-funnel-dofnhD24.js → chart-funnel-CE9x0Io9.js} +2 -2
  36. package/dist/client/chunks/{chart-funnel-dofnhD24.js.map → chart-funnel-CE9x0Io9.js.map} +1 -1
  37. package/dist/client/chunks/{chart-gauge-CKJJ8m3b.js → chart-gauge-Djs5FWxB.js} +2 -2
  38. package/dist/client/chunks/{chart-gauge-CKJJ8m3b.js.map → chart-gauge-Djs5FWxB.js.map} +1 -1
  39. package/dist/client/chunks/{chart-heat-map-BVuPUKHT.js → chart-heat-map-CqtMkdxd.js} +2 -2
  40. package/dist/client/chunks/{chart-heat-map-BVuPUKHT.js.map → chart-heat-map-CqtMkdxd.js.map} +1 -1
  41. package/dist/client/chunks/{chart-kpi-delta-DUD3f8vL.js → chart-kpi-delta-DEzA74cL.js} +4 -4
  42. package/dist/client/chunks/{chart-kpi-delta-DUD3f8vL.js.map → chart-kpi-delta-DEzA74cL.js.map} +1 -1
  43. package/dist/client/chunks/{chart-kpi-number-iJh-PzsM.js → chart-kpi-number-Bab-BZtX.js} +3 -3
  44. package/dist/client/chunks/{chart-kpi-number-iJh-PzsM.js.map → chart-kpi-number-Bab-BZtX.js.map} +1 -1
  45. package/dist/client/chunks/{chart-kpi-text-x6pV9v9Q.js → chart-kpi-text-BkTgckDJ.js} +3 -3
  46. package/dist/client/chunks/{chart-kpi-text-x6pV9v9Q.js.map → chart-kpi-text-BkTgckDJ.js.map} +1 -1
  47. package/dist/client/chunks/{chart-line-DzyZkugh.js → chart-line-DhM-Hvu0.js} +3 -3
  48. package/dist/client/chunks/{chart-line-DzyZkugh.js.map → chart-line-DhM-Hvu0.js.map} +1 -1
  49. package/dist/client/chunks/{chart-measure-profile-C2IkBG3V.js → chart-measure-profile-4vQxFm69.js} +3 -3
  50. package/dist/client/chunks/{chart-measure-profile-C2IkBG3V.js.map → chart-measure-profile-4vQxFm69.js.map} +1 -1
  51. package/dist/client/chunks/{chart-pie-akbfRfb9.js → chart-pie-B86KRcHI.js} +2 -2
  52. package/dist/client/chunks/{chart-pie-akbfRfb9.js.map → chart-pie-B86KRcHI.js.map} +1 -1
  53. package/dist/client/chunks/{chart-radar-BaN-Kjww.js → chart-radar-BhDBmJRh.js} +2 -2
  54. package/dist/client/chunks/{chart-radar-BaN-Kjww.js.map → chart-radar-BhDBmJRh.js.map} +1 -1
  55. package/dist/client/chunks/{chart-radial-bar-DpptEL3s.js → chart-radial-bar-Brugya8X.js} +2 -2
  56. package/dist/client/chunks/{chart-radial-bar-DpptEL3s.js.map → chart-radial-bar-Brugya8X.js.map} +1 -1
  57. package/dist/client/chunks/{chart-sankey-CG-3hHmX.js → chart-sankey-D2L8ympI.js} +2 -2
  58. package/dist/client/chunks/{chart-sankey-CG-3hHmX.js.map → chart-sankey-D2L8ympI.js.map} +1 -1
  59. package/dist/client/chunks/{chart-scatter-l_yTVxF3.js → chart-scatter-CAkbBDkK.js} +2 -2
  60. package/dist/client/chunks/{chart-scatter-l_yTVxF3.js.map → chart-scatter-CAkbBDkK.js.map} +1 -1
  61. package/dist/client/chunks/{chart-sunburst-KhDcKhmZ.js → chart-sunburst-DaxJ-cob.js} +2 -2
  62. package/dist/client/chunks/{chart-sunburst-KhDcKhmZ.js.map → chart-sunburst-DaxJ-cob.js.map} +1 -1
  63. package/dist/client/chunks/{chart-tree-map-CBbiaBXV.js → chart-tree-map-CrDJAvZU.js} +2 -2
  64. package/dist/client/chunks/{chart-tree-map-CBbiaBXV.js.map → chart-tree-map-CrDJAvZU.js.map} +1 -1
  65. package/dist/client/chunks/{chart-waterfall-CX3vx_lI.js → chart-waterfall-BBwSfEKT.js} +3 -3
  66. package/dist/client/chunks/{chart-waterfall-CX3vx_lI.js.map → chart-waterfall-BBwSfEKT.js.map} +1 -1
  67. package/dist/client/chunks/{charts-core-CU9u_HtL.js → charts-core-B4Rbfdcn.js} +2 -2
  68. package/dist/client/chunks/{charts-core-CU9u_HtL.js.map → charts-core-B4Rbfdcn.js.map} +1 -1
  69. package/dist/client/chunks/{charts-loader-B3tt5oKG.js → charts-loader-DbrwgvCK.js} +25 -25
  70. package/dist/client/chunks/{charts-loader-B3tt5oKG.js.map → charts-loader-DbrwgvCK.js.map} +1 -1
  71. package/dist/client/chunks/{components-CMGGxqOB.js → components-GzooQM5J.js} +9 -9
  72. package/dist/client/chunks/{components-CMGGxqOB.js.map → components-GzooQM5J.js.map} +1 -1
  73. package/dist/client/chunks/{core-D_8mkGpQ.js → core-Y9e-sNfb.js} +2 -2
  74. package/dist/client/chunks/{core-D_8mkGpQ.js.map → core-Y9e-sNfb.js.map} +1 -1
  75. package/dist/client/chunks/{icons-M7shurcH.js → icons-DFJw-2HU.js} +6 -6
  76. package/dist/client/chunks/{icons-M7shurcH.js.map → icons-DFJw-2HU.js.map} +1 -1
  77. package/dist/client/chunks/{providers-CgxXm6Ll.js → providers-CCw8Kjlc.js} +2 -2
  78. package/dist/client/chunks/{providers-CgxXm6Ll.js.map → providers-CCw8Kjlc.js.map} +1 -1
  79. package/dist/client/chunks/{syntaxHighlighting-BQfjio-i.js → syntaxHighlighting-DAMSW_A6.js} +2 -2
  80. package/dist/client/chunks/{syntaxHighlighting-BQfjio-i.js.map → syntaxHighlighting-DAMSW_A6.js.map} +1 -1
  81. package/dist/client/chunks/{useDirtyStateTracking-Cu1HSjmo.js → useDirtyStateTracking-CjhwBXRw.js} +20 -20
  82. package/dist/client/chunks/{useDirtyStateTracking-Cu1HSjmo.js.map → useDirtyStateTracking-CjhwBXRw.js.map} +1 -1
  83. package/dist/client/chunks/useExplainAI-IiW55BaQ.js +182 -0
  84. package/dist/client/chunks/useExplainAI-IiW55BaQ.js.map +1 -0
  85. package/dist/client/chunks/{vendor-AVsJ2ni0.js → vendor-B2EH3V58.js} +7 -7
  86. package/dist/client/chunks/{vendor-AVsJ2ni0.js.map → vendor-B2EH3V58.js.map} +1 -1
  87. package/dist/client/components.js +1 -1
  88. package/dist/client/hooks/useNotebookLayout.d.ts +8 -0
  89. package/dist/client/hooks.d.ts +2 -0
  90. package/dist/client/hooks.js +51 -190
  91. package/dist/client/hooks.js.map +1 -1
  92. package/dist/client/icons.js +1 -1
  93. package/dist/client/index.js +871 -742
  94. package/dist/client/index.js.map +1 -1
  95. package/dist/client/providers.js +1 -1
  96. package/dist/client/styles.css +1 -1
  97. package/dist/client/utils.js +7 -7
  98. package/dist/client-bundle-stats.html +1 -1
  99. package/dist/server/index.cjs +1 -1
  100. package/dist/server/index.d.ts +5 -0
  101. package/dist/server/index.js +7 -0
  102. package/package.json +1 -1
@@ -1,7 +1,7 @@
1
1
  import { jsx as x, jsxs as b } from "react/jsx-runtime";
2
2
  import q, { useMemo as C } from "react";
3
3
  import { ResponsiveHeatMap as P } from "@nivo/heatmap";
4
- import { g as L, f as k, d as T } from "./charts-core-CU9u_HtL.js";
4
+ import { g as L, f as k, d as T } from "./charts-core-B4Rbfdcn.js";
5
5
  function z(i) {
6
6
  if (i.startsWith("#")) {
7
7
  const s = i.slice(1);
@@ -228,4 +228,4 @@ const G = q.memo(function({
228
228
  export {
229
229
  G as default
230
230
  };
231
- //# sourceMappingURL=chart-heat-map-BVuPUKHT.js.map
231
+ //# sourceMappingURL=chart-heat-map-CqtMkdxd.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"chart-heat-map-BVuPUKHT.js","sources":["../../../src/client/components/charts/HeatMapChart.tsx"],"sourcesContent":["/**\n * HeatMapChart Component\n *\n * Visualizes intensity across two categorical dimensions using a color matrix.\n * Uses @nivo/heatmap for rendering.\n *\n * The chart displays:\n * - Rows: Y-axis dimension values\n * - Columns: X-axis dimension values\n * - Cell color: Intensity based on measure value\n */\n\nimport React, { useMemo } from 'react'\nimport { ResponsiveHeatMap } from '@nivo/heatmap'\nimport { formatTimeValue, getFieldGranularity, formatAxisValue } from '../../utils/chartUtils'\nimport type { AxisFormatConfig } from '../../types'\nimport type { ChartProps } from '../../types'\n\n/**\n * Parse color string (hex or rgb) to RGB values\n */\nfunction parseColor(color: string): { r: number; g: number; b: number } | null {\n // Handle hex colors\n if (color.startsWith('#')) {\n const hex = color.slice(1)\n return {\n r: parseInt(hex.substring(0, 2), 16),\n g: parseInt(hex.substring(2, 4), 16),\n b: parseInt(hex.substring(4, 6), 16),\n }\n }\n\n // Handle rgb/rgba colors\n const rgbMatch = color.match(/rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)/)\n if (rgbMatch) {\n return {\n r: parseInt(rgbMatch[1], 10),\n g: parseInt(rgbMatch[2], 10),\n b: parseInt(rgbMatch[3], 10),\n }\n }\n\n return null\n}\n\n/**\n * Calculate relative luminance of a color\n * Returns value between 0 (black) and 1 (white)\n */\nfunction getLuminance(color: string): number {\n const rgb = parseColor(color)\n if (!rgb) return 0.5 // Default to mid-gray if parsing fails\n\n const r = rgb.r / 255\n const g = rgb.g / 255\n const b = rgb.b / 255\n\n // Apply gamma correction\n const rLinear = r <= 0.03928 ? r / 12.92 : Math.pow((r + 0.055) / 1.055, 2.4)\n const gLinear = g <= 0.03928 ? g / 12.92 : Math.pow((g + 0.055) / 1.055, 2.4)\n const bLinear = b <= 0.03928 ? b / 12.92 : Math.pow((b + 0.055) / 1.055, 2.4)\n\n // Calculate luminance using WCAG formula\n return 0.2126 * rLinear + 0.7152 * gLinear + 0.0722 * bLinear\n}\n\n/**\n * Get contrasting text color (white or dark) based on background color\n */\nfunction getContrastingTextColor(bgColor: string): string {\n const luminance = getLuminance(bgColor)\n // Use white text on dark backgrounds, dark text on light backgrounds\n return luminance < 0.4 ? '#ffffff' : '#1f2937'\n}\n\n/**\n * Maximum dimensions for heatmap to prevent browser lockup\n * 50x50 = 2500 cells max\n */\nconst MAX_HEATMAP_ROWS = 50\nconst MAX_HEATMAP_COLS = 50\n\n/**\n * Nivo heatmap data format\n */\ninterface HeatMapDatum {\n x: string\n y: number | null\n}\n\ninterface HeatMapSerie {\n id: string\n data: HeatMapDatum[]\n}\n\n/**\n * Result of heatmap transformation including truncation info\n */\ninterface HeatMapTransformResult {\n data: HeatMapSerie[]\n truncated: boolean\n originalRows: number\n originalCols: number\n}\n\n/**\n * Transform drizzle-cube flat query results to nivo heatmap format\n *\n * Input (drizzle-cube):\n * [\n * { \"Region.name\": \"East\", \"Product.category\": \"Electronics\", \"Sales.total\": 1500 },\n * { \"Region.name\": \"East\", \"Product.category\": \"Clothing\", \"Sales.total\": 800 },\n * ]\n *\n * Output (nivo format):\n * [\n * { id: \"East\", data: [{ x: \"Electronics\", y: 1500 }, { x: \"Clothing\", y: 800 }] }\n * ]\n *\n * Data is truncated to MAX_HEATMAP_ROWS x MAX_HEATMAP_COLS to prevent browser lockup\n */\nfunction transformToHeatMapFormat(\n data: Record<string, unknown>[],\n xAxisField: string | undefined,\n yAxisField: string | undefined,\n valueField: string | undefined,\n xGranularity?: string,\n yGranularity?: string\n): HeatMapTransformResult {\n if (!xAxisField || !yAxisField || !valueField) {\n return { data: [], truncated: false, originalRows: 0, originalCols: 0 }\n }\n\n // Group data by Y-axis dimension\n const groupedByY = new Map<string, Map<string, number>>()\n const allXValues = new Set<string>()\n // Keep original values for sorting timestamps correctly\n const xValueOriginals = new Map<string, unknown>()\n\n for (const row of data) {\n const rawYValue = row[yAxisField]\n const rawXValue = row[xAxisField]\n\n // Format time values based on granularity\n const yValue = formatTimeValue(rawYValue, yGranularity) || String(rawYValue ?? '(empty)')\n const xValue = formatTimeValue(rawXValue, xGranularity) || String(rawXValue ?? '(empty)')\n const value = Number(row[valueField]) || 0\n\n allXValues.add(xValue)\n // Store original for sorting\n if (!xValueOriginals.has(xValue)) {\n xValueOriginals.set(xValue, rawXValue)\n }\n\n if (!groupedByY.has(yValue)) {\n groupedByY.set(yValue, new Map())\n }\n groupedByY.get(yValue)!.set(xValue, value)\n }\n\n // Sort X values - try to sort by original timestamp if available\n const xValueArray = Array.from(allXValues).sort((a, b) => {\n const origA = xValueOriginals.get(a)\n const origB = xValueOriginals.get(b)\n // If both are date strings, sort chronologically\n if (typeof origA === 'string' && typeof origB === 'string' &&\n origA.match(/^\\d{4}-\\d{2}-\\d{2}/) && origB.match(/^\\d{4}-\\d{2}-\\d{2}/)) {\n return origA.localeCompare(origB)\n }\n // Otherwise sort alphabetically by formatted value\n return a.localeCompare(b)\n })\n\n // Track original dimensions for truncation warning\n const originalRows = groupedByY.size\n const originalCols = xValueArray.length\n const truncated = originalRows > MAX_HEATMAP_ROWS || originalCols > MAX_HEATMAP_COLS\n\n // Truncate X values if needed\n const limitedXValues = xValueArray.slice(0, MAX_HEATMAP_COLS)\n\n // Build result with truncation\n const result: HeatMapSerie[] = []\n let rowCount = 0\n for (const [yValue, xMap] of groupedByY) {\n if (rowCount >= MAX_HEATMAP_ROWS) break\n result.push({\n id: yValue,\n data: limitedXValues.map((x) => ({\n x,\n y: xMap.get(x) ?? null,\n })),\n })\n rowCount++\n }\n\n return { data: result, truncated, originalRows, originalCols }\n}\n\n/**\n * HeatMapChart Component\n *\n * Renders a heatmap visualization from query results.\n * Shows intensity patterns across two categorical dimensions.\n */\nconst HeatMapChart = React.memo(function HeatMapChart({\n data,\n height = '100%',\n chartConfig,\n colorPalette,\n displayConfig,\n queryObject,\n}: ChartProps) {\n // Get display config options\n const displayConfigAny = displayConfig as Record<string, unknown> | undefined\n const showLabels = (displayConfigAny?.showLabels as boolean) ?? false\n const cellShape = (displayConfigAny?.cellShape as 'rect' | 'circle') ?? 'rect'\n const showLegend = (displayConfigAny?.showLegend as boolean) ?? true\n const xAxisFormat = displayConfigAny?.xAxisFormat as AxisFormatConfig | undefined\n const yAxisFormat = displayConfigAny?.yAxisFormat as AxisFormatConfig | undefined\n const valueFormat = displayConfigAny?.valueFormat as AxisFormatConfig | undefined\n\n // Extract field names from chartConfig (handle both array and string formats)\n const xAxisField = chartConfig?.xAxis\n ? (Array.isArray(chartConfig.xAxis) ? chartConfig.xAxis[0] : chartConfig.xAxis)\n : undefined\n const yAxisField = chartConfig?.yAxis\n ? (Array.isArray(chartConfig.yAxis) ? chartConfig.yAxis[0] : chartConfig.yAxis)\n : undefined\n const valueField = chartConfig?.valueField\n ? (Array.isArray(chartConfig.valueField) ? chartConfig.valueField[0] : chartConfig.valueField)\n : undefined\n\n // Get granularity for time dimensions (only if field is defined)\n const xGranularity = xAxisField ? getFieldGranularity(queryObject, xAxisField) : undefined\n const yGranularity = yAxisField ? getFieldGranularity(queryObject, yAxisField) : undefined\n\n // Transform data to nivo format\n const { data: heatmapData, truncated, originalRows, originalCols } = useMemo(() => {\n if (!data || data.length === 0) {\n return { data: [], truncated: false, originalRows: 0, originalCols: 0 }\n }\n return transformToHeatMapFormat(\n data as Record<string, unknown>[],\n xAxisField,\n yAxisField,\n valueField,\n xGranularity,\n yGranularity\n )\n }, [data, xAxisField, yAxisField, valueField, xGranularity, yGranularity])\n\n // Handle no data or missing config\n if (!data || data.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\"\n style={{ height }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data available</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n Run a query to see heatmap visualization\n </div>\n </div>\n </div>\n )\n }\n\n if (!xAxisField || !yAxisField || !valueField) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\"\n style={{ height }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Configuration required</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n {!xAxisField && 'X-axis dimension required. '}\n {!yAxisField && 'Y-axis dimension required. '}\n {!valueField && 'Value measure required.'}\n </div>\n </div>\n </div>\n )\n }\n\n if (heatmapData.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\"\n style={{ height }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data to display</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n The query returned no results for the heatmap\n </div>\n </div>\n </div>\n )\n }\n\n // Use gradient colors from palette, or default sequential blue gradient\n // Sequential single-hue gradients are ideal for heatmaps showing magnitude/intensity\n const colors = colorPalette?.gradient || [\n '#eff3ff', // lightest blue\n '#c6dbef',\n '#9ecae1',\n '#6baed6',\n '#3182bd',\n '#08519c', // darkest blue\n ]\n\n return (\n <div className=\"dc:relative dc:w-full dc:h-full\" style={{ height }}>\n {truncated && (\n <div className=\"dc:absolute dc:top-0 dc:left-0 dc:right-0 dc:z-10 dc:px-3 dc:py-1.5 dc:text-xs bg-dc-warning-bg text-dc-warning dc:border-b border-dc-border\">\n Data truncated to {MAX_HEATMAP_ROWS}x{MAX_HEATMAP_COLS} cells (original: {originalRows}x{originalCols}). Add filters to reduce dimensions.\n </div>\n )}\n <ResponsiveHeatMap\n data={heatmapData}\n margin={{ top: truncated ? 40 : 20, right: 20, bottom: 120, left: 120 }}\n valueFormat={valueFormat ? (v) => formatAxisValue(v, valueFormat) : '>-.2s'}\n axisTop={null}\n axisRight={null}\n axisBottom={{\n tickSize: 5,\n tickPadding: 5,\n tickRotation: -45,\n legend: xAxisFormat?.label || xAxisField?.split('.').pop() || 'X Axis',\n legendPosition: 'middle',\n legendOffset: 70,\n format: xAxisFormat\n ? (v) => {\n const num = parseFloat(String(v))\n return isNaN(num) ? String(v) : formatAxisValue(num, xAxisFormat)\n }\n : undefined,\n }}\n axisLeft={{\n tickSize: 5,\n tickPadding: 5,\n tickRotation: 0,\n legend: yAxisFormat?.label || yAxisField?.split('.').pop() || 'Y Axis',\n legendPosition: 'middle',\n legendOffset: -80,\n format: yAxisFormat\n ? (v) => {\n const num = parseFloat(String(v))\n return isNaN(num) ? String(v) : formatAxisValue(num, yAxisFormat)\n }\n : undefined,\n }}\n colors={\n colors.length >= 2\n // Sequential scale needs [minColor, maxColor] tuple\n // Use first color for low values, last color for high values\n ? { type: 'sequential', colors: [colors[0], colors[colors.length - 1]] as [string, string] }\n : { type: 'sequential', scheme: 'greens' } // Fallback to built-in scheme\n }\n emptyColor=\"var(--dc-surface-tertiary)\"\n cellComponent={cellShape === 'circle' ? 'circle' : 'rect'}\n enableLabels={showLabels}\n labelTextColor={({ color }) => getContrastingTextColor(color)}\n legends={\n showLegend\n ? [\n {\n anchor: 'bottom',\n translateX: 0,\n translateY: 95,\n length: 400,\n thickness: 8,\n direction: 'row',\n tickPosition: 'after',\n tickSize: 3,\n tickSpacing: 4,\n tickOverlap: false,\n title: valueField?.split('.').pop() || 'Value',\n titleAlign: 'start',\n titleOffset: 4,\n },\n ]\n : []\n }\n annotations={[]}\n theme={{\n text: {\n fill: 'var(--dc-text)',\n },\n axis: {\n legend: {\n text: {\n fill: 'var(--dc-text)',\n },\n },\n ticks: {\n text: {\n fill: 'var(--dc-text-secondary)',\n },\n },\n },\n legends: {\n text: {\n fill: 'var(--dc-text-secondary)',\n },\n title: {\n text: {\n fill: 'var(--dc-text)',\n },\n },\n },\n tooltip: {\n container: {\n background: 'var(--dc-surface)',\n color: 'var(--dc-text)',\n borderRadius: '4px',\n boxShadow: '0 1px 2px rgba(0, 0, 0, 0.25)',\n },\n },\n }}\n />\n </div>\n )\n})\n\nexport default HeatMapChart\n"],"names":["parseColor","color","hex","rgbMatch","getLuminance","rgb","r","g","b","rLinear","gLinear","bLinear","getContrastingTextColor","bgColor","MAX_HEATMAP_ROWS","MAX_HEATMAP_COLS","transformToHeatMapFormat","data","xAxisField","yAxisField","valueField","xGranularity","yGranularity","groupedByY","allXValues","xValueOriginals","row","rawYValue","rawXValue","yValue","formatTimeValue","xValue","value","xValueArray","origA","origB","originalRows","originalCols","truncated","limitedXValues","result","rowCount","xMap","x","HeatMapChart","React","height","chartConfig","colorPalette","displayConfig","queryObject","displayConfigAny","showLabels","cellShape","showLegend","xAxisFormat","yAxisFormat","valueFormat","getFieldGranularity","heatmapData","useMemo","jsx","jsxs","colors","ResponsiveHeatMap","v","formatAxisValue","num"],"mappings":"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"}
1
+ {"version":3,"file":"chart-heat-map-CqtMkdxd.js","sources":["../../../src/client/components/charts/HeatMapChart.tsx"],"sourcesContent":["/**\n * HeatMapChart Component\n *\n * Visualizes intensity across two categorical dimensions using a color matrix.\n * Uses @nivo/heatmap for rendering.\n *\n * The chart displays:\n * - Rows: Y-axis dimension values\n * - Columns: X-axis dimension values\n * - Cell color: Intensity based on measure value\n */\n\nimport React, { useMemo } from 'react'\nimport { ResponsiveHeatMap } from '@nivo/heatmap'\nimport { formatTimeValue, getFieldGranularity, formatAxisValue } from '../../utils/chartUtils'\nimport type { AxisFormatConfig } from '../../types'\nimport type { ChartProps } from '../../types'\n\n/**\n * Parse color string (hex or rgb) to RGB values\n */\nfunction parseColor(color: string): { r: number; g: number; b: number } | null {\n // Handle hex colors\n if (color.startsWith('#')) {\n const hex = color.slice(1)\n return {\n r: parseInt(hex.substring(0, 2), 16),\n g: parseInt(hex.substring(2, 4), 16),\n b: parseInt(hex.substring(4, 6), 16),\n }\n }\n\n // Handle rgb/rgba colors\n const rgbMatch = color.match(/rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)/)\n if (rgbMatch) {\n return {\n r: parseInt(rgbMatch[1], 10),\n g: parseInt(rgbMatch[2], 10),\n b: parseInt(rgbMatch[3], 10),\n }\n }\n\n return null\n}\n\n/**\n * Calculate relative luminance of a color\n * Returns value between 0 (black) and 1 (white)\n */\nfunction getLuminance(color: string): number {\n const rgb = parseColor(color)\n if (!rgb) return 0.5 // Default to mid-gray if parsing fails\n\n const r = rgb.r / 255\n const g = rgb.g / 255\n const b = rgb.b / 255\n\n // Apply gamma correction\n const rLinear = r <= 0.03928 ? r / 12.92 : Math.pow((r + 0.055) / 1.055, 2.4)\n const gLinear = g <= 0.03928 ? g / 12.92 : Math.pow((g + 0.055) / 1.055, 2.4)\n const bLinear = b <= 0.03928 ? b / 12.92 : Math.pow((b + 0.055) / 1.055, 2.4)\n\n // Calculate luminance using WCAG formula\n return 0.2126 * rLinear + 0.7152 * gLinear + 0.0722 * bLinear\n}\n\n/**\n * Get contrasting text color (white or dark) based on background color\n */\nfunction getContrastingTextColor(bgColor: string): string {\n const luminance = getLuminance(bgColor)\n // Use white text on dark backgrounds, dark text on light backgrounds\n return luminance < 0.4 ? '#ffffff' : '#1f2937'\n}\n\n/**\n * Maximum dimensions for heatmap to prevent browser lockup\n * 50x50 = 2500 cells max\n */\nconst MAX_HEATMAP_ROWS = 50\nconst MAX_HEATMAP_COLS = 50\n\n/**\n * Nivo heatmap data format\n */\ninterface HeatMapDatum {\n x: string\n y: number | null\n}\n\ninterface HeatMapSerie {\n id: string\n data: HeatMapDatum[]\n}\n\n/**\n * Result of heatmap transformation including truncation info\n */\ninterface HeatMapTransformResult {\n data: HeatMapSerie[]\n truncated: boolean\n originalRows: number\n originalCols: number\n}\n\n/**\n * Transform drizzle-cube flat query results to nivo heatmap format\n *\n * Input (drizzle-cube):\n * [\n * { \"Region.name\": \"East\", \"Product.category\": \"Electronics\", \"Sales.total\": 1500 },\n * { \"Region.name\": \"East\", \"Product.category\": \"Clothing\", \"Sales.total\": 800 },\n * ]\n *\n * Output (nivo format):\n * [\n * { id: \"East\", data: [{ x: \"Electronics\", y: 1500 }, { x: \"Clothing\", y: 800 }] }\n * ]\n *\n * Data is truncated to MAX_HEATMAP_ROWS x MAX_HEATMAP_COLS to prevent browser lockup\n */\nfunction transformToHeatMapFormat(\n data: Record<string, unknown>[],\n xAxisField: string | undefined,\n yAxisField: string | undefined,\n valueField: string | undefined,\n xGranularity?: string,\n yGranularity?: string\n): HeatMapTransformResult {\n if (!xAxisField || !yAxisField || !valueField) {\n return { data: [], truncated: false, originalRows: 0, originalCols: 0 }\n }\n\n // Group data by Y-axis dimension\n const groupedByY = new Map<string, Map<string, number>>()\n const allXValues = new Set<string>()\n // Keep original values for sorting timestamps correctly\n const xValueOriginals = new Map<string, unknown>()\n\n for (const row of data) {\n const rawYValue = row[yAxisField]\n const rawXValue = row[xAxisField]\n\n // Format time values based on granularity\n const yValue = formatTimeValue(rawYValue, yGranularity) || String(rawYValue ?? '(empty)')\n const xValue = formatTimeValue(rawXValue, xGranularity) || String(rawXValue ?? '(empty)')\n const value = Number(row[valueField]) || 0\n\n allXValues.add(xValue)\n // Store original for sorting\n if (!xValueOriginals.has(xValue)) {\n xValueOriginals.set(xValue, rawXValue)\n }\n\n if (!groupedByY.has(yValue)) {\n groupedByY.set(yValue, new Map())\n }\n groupedByY.get(yValue)!.set(xValue, value)\n }\n\n // Sort X values - try to sort by original timestamp if available\n const xValueArray = Array.from(allXValues).sort((a, b) => {\n const origA = xValueOriginals.get(a)\n const origB = xValueOriginals.get(b)\n // If both are date strings, sort chronologically\n if (typeof origA === 'string' && typeof origB === 'string' &&\n origA.match(/^\\d{4}-\\d{2}-\\d{2}/) && origB.match(/^\\d{4}-\\d{2}-\\d{2}/)) {\n return origA.localeCompare(origB)\n }\n // Otherwise sort alphabetically by formatted value\n return a.localeCompare(b)\n })\n\n // Track original dimensions for truncation warning\n const originalRows = groupedByY.size\n const originalCols = xValueArray.length\n const truncated = originalRows > MAX_HEATMAP_ROWS || originalCols > MAX_HEATMAP_COLS\n\n // Truncate X values if needed\n const limitedXValues = xValueArray.slice(0, MAX_HEATMAP_COLS)\n\n // Build result with truncation\n const result: HeatMapSerie[] = []\n let rowCount = 0\n for (const [yValue, xMap] of groupedByY) {\n if (rowCount >= MAX_HEATMAP_ROWS) break\n result.push({\n id: yValue,\n data: limitedXValues.map((x) => ({\n x,\n y: xMap.get(x) ?? null,\n })),\n })\n rowCount++\n }\n\n return { data: result, truncated, originalRows, originalCols }\n}\n\n/**\n * HeatMapChart Component\n *\n * Renders a heatmap visualization from query results.\n * Shows intensity patterns across two categorical dimensions.\n */\nconst HeatMapChart = React.memo(function HeatMapChart({\n data,\n height = '100%',\n chartConfig,\n colorPalette,\n displayConfig,\n queryObject,\n}: ChartProps) {\n // Get display config options\n const displayConfigAny = displayConfig as Record<string, unknown> | undefined\n const showLabels = (displayConfigAny?.showLabels as boolean) ?? false\n const cellShape = (displayConfigAny?.cellShape as 'rect' | 'circle') ?? 'rect'\n const showLegend = (displayConfigAny?.showLegend as boolean) ?? true\n const xAxisFormat = displayConfigAny?.xAxisFormat as AxisFormatConfig | undefined\n const yAxisFormat = displayConfigAny?.yAxisFormat as AxisFormatConfig | undefined\n const valueFormat = displayConfigAny?.valueFormat as AxisFormatConfig | undefined\n\n // Extract field names from chartConfig (handle both array and string formats)\n const xAxisField = chartConfig?.xAxis\n ? (Array.isArray(chartConfig.xAxis) ? chartConfig.xAxis[0] : chartConfig.xAxis)\n : undefined\n const yAxisField = chartConfig?.yAxis\n ? (Array.isArray(chartConfig.yAxis) ? chartConfig.yAxis[0] : chartConfig.yAxis)\n : undefined\n const valueField = chartConfig?.valueField\n ? (Array.isArray(chartConfig.valueField) ? chartConfig.valueField[0] : chartConfig.valueField)\n : undefined\n\n // Get granularity for time dimensions (only if field is defined)\n const xGranularity = xAxisField ? getFieldGranularity(queryObject, xAxisField) : undefined\n const yGranularity = yAxisField ? getFieldGranularity(queryObject, yAxisField) : undefined\n\n // Transform data to nivo format\n const { data: heatmapData, truncated, originalRows, originalCols } = useMemo(() => {\n if (!data || data.length === 0) {\n return { data: [], truncated: false, originalRows: 0, originalCols: 0 }\n }\n return transformToHeatMapFormat(\n data as Record<string, unknown>[],\n xAxisField,\n yAxisField,\n valueField,\n xGranularity,\n yGranularity\n )\n }, [data, xAxisField, yAxisField, valueField, xGranularity, yGranularity])\n\n // Handle no data or missing config\n if (!data || data.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\"\n style={{ height }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data available</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n Run a query to see heatmap visualization\n </div>\n </div>\n </div>\n )\n }\n\n if (!xAxisField || !yAxisField || !valueField) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\"\n style={{ height }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Configuration required</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n {!xAxisField && 'X-axis dimension required. '}\n {!yAxisField && 'Y-axis dimension required. '}\n {!valueField && 'Value measure required.'}\n </div>\n </div>\n </div>\n )\n }\n\n if (heatmapData.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\"\n style={{ height }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data to display</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n The query returned no results for the heatmap\n </div>\n </div>\n </div>\n )\n }\n\n // Use gradient colors from palette, or default sequential blue gradient\n // Sequential single-hue gradients are ideal for heatmaps showing magnitude/intensity\n const colors = colorPalette?.gradient || [\n '#eff3ff', // lightest blue\n '#c6dbef',\n '#9ecae1',\n '#6baed6',\n '#3182bd',\n '#08519c', // darkest blue\n ]\n\n return (\n <div className=\"dc:relative dc:w-full dc:h-full\" style={{ height }}>\n {truncated && (\n <div className=\"dc:absolute dc:top-0 dc:left-0 dc:right-0 dc:z-10 dc:px-3 dc:py-1.5 dc:text-xs bg-dc-warning-bg text-dc-warning dc:border-b border-dc-border\">\n Data truncated to {MAX_HEATMAP_ROWS}x{MAX_HEATMAP_COLS} cells (original: {originalRows}x{originalCols}). Add filters to reduce dimensions.\n </div>\n )}\n <ResponsiveHeatMap\n data={heatmapData}\n margin={{ top: truncated ? 40 : 20, right: 20, bottom: 120, left: 120 }}\n valueFormat={valueFormat ? (v) => formatAxisValue(v, valueFormat) : '>-.2s'}\n axisTop={null}\n axisRight={null}\n axisBottom={{\n tickSize: 5,\n tickPadding: 5,\n tickRotation: -45,\n legend: xAxisFormat?.label || xAxisField?.split('.').pop() || 'X Axis',\n legendPosition: 'middle',\n legendOffset: 70,\n format: xAxisFormat\n ? (v) => {\n const num = parseFloat(String(v))\n return isNaN(num) ? String(v) : formatAxisValue(num, xAxisFormat)\n }\n : undefined,\n }}\n axisLeft={{\n tickSize: 5,\n tickPadding: 5,\n tickRotation: 0,\n legend: yAxisFormat?.label || yAxisField?.split('.').pop() || 'Y Axis',\n legendPosition: 'middle',\n legendOffset: -80,\n format: yAxisFormat\n ? (v) => {\n const num = parseFloat(String(v))\n return isNaN(num) ? String(v) : formatAxisValue(num, yAxisFormat)\n }\n : undefined,\n }}\n colors={\n colors.length >= 2\n // Sequential scale needs [minColor, maxColor] tuple\n // Use first color for low values, last color for high values\n ? { type: 'sequential', colors: [colors[0], colors[colors.length - 1]] as [string, string] }\n : { type: 'sequential', scheme: 'greens' } // Fallback to built-in scheme\n }\n emptyColor=\"var(--dc-surface-tertiary)\"\n cellComponent={cellShape === 'circle' ? 'circle' : 'rect'}\n enableLabels={showLabels}\n labelTextColor={({ color }) => getContrastingTextColor(color)}\n legends={\n showLegend\n ? [\n {\n anchor: 'bottom',\n translateX: 0,\n translateY: 95,\n length: 400,\n thickness: 8,\n direction: 'row',\n tickPosition: 'after',\n tickSize: 3,\n tickSpacing: 4,\n tickOverlap: false,\n title: valueField?.split('.').pop() || 'Value',\n titleAlign: 'start',\n titleOffset: 4,\n },\n ]\n : []\n }\n annotations={[]}\n theme={{\n text: {\n fill: 'var(--dc-text)',\n },\n axis: {\n legend: {\n text: {\n fill: 'var(--dc-text)',\n },\n },\n ticks: {\n text: {\n fill: 'var(--dc-text-secondary)',\n },\n },\n },\n legends: {\n text: {\n fill: 'var(--dc-text-secondary)',\n },\n title: {\n text: {\n fill: 'var(--dc-text)',\n },\n },\n },\n tooltip: {\n container: {\n background: 'var(--dc-surface)',\n color: 'var(--dc-text)',\n borderRadius: '4px',\n boxShadow: '0 1px 2px rgba(0, 0, 0, 0.25)',\n },\n },\n }}\n />\n </div>\n )\n})\n\nexport default HeatMapChart\n"],"names":["parseColor","color","hex","rgbMatch","getLuminance","rgb","r","g","b","rLinear","gLinear","bLinear","getContrastingTextColor","bgColor","MAX_HEATMAP_ROWS","MAX_HEATMAP_COLS","transformToHeatMapFormat","data","xAxisField","yAxisField","valueField","xGranularity","yGranularity","groupedByY","allXValues","xValueOriginals","row","rawYValue","rawXValue","yValue","formatTimeValue","xValue","value","xValueArray","origA","origB","originalRows","originalCols","truncated","limitedXValues","result","rowCount","xMap","x","HeatMapChart","React","height","chartConfig","colorPalette","displayConfig","queryObject","displayConfigAny","showLabels","cellShape","showLegend","xAxisFormat","yAxisFormat","valueFormat","getFieldGranularity","heatmapData","useMemo","jsx","jsxs","colors","ResponsiveHeatMap","v","formatAxisValue","num"],"mappings":"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"}
@@ -1,8 +1,8 @@
1
1
  import { jsx as t, jsxs as s } from "react/jsx-runtime";
2
2
  import ce, { useState as O, useRef as U, useEffect as se } from "react";
3
- import { I as de, d as ne } from "./icons-M7shurcH.js";
4
- import { u as ie } from "./charts-core-CU9u_HtL.js";
5
- import { f as re } from "./chart-kpi-number-iJh-PzsM.js";
3
+ import { I as de, d as ne } from "./icons-DFJw-2HU.js";
4
+ import { u as ie } from "./charts-core-B4Rbfdcn.js";
5
+ import { f as re } from "./chart-kpi-number-Bab-BZtX.js";
6
6
  function oe({
7
7
  values: w,
8
8
  lastValue: p,
@@ -348,4 +348,4 @@ const he = ce.memo(function({
348
348
  export {
349
349
  he as default
350
350
  };
351
- //# sourceMappingURL=chart-kpi-delta-DUD3f8vL.js.map
351
+ //# sourceMappingURL=chart-kpi-delta-DEzA74cL.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"chart-kpi-delta-DUD3f8vL.js","sources":["../../../src/client/components/charts/KpiDelta.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from \"react\";\nimport { Icon } from \"@iconify/react\";\nimport infoCircleIcon from \"@iconify-icons/tabler/info-circle\";\nimport { useCubeFieldLabel } from \"../../hooks/useCubeFieldLabel\";\nimport { filterIncompletePeriod } from \"../../utils/periodUtils\";\nimport type { ChartProps } from \"../../types\";\n\ninterface VarianceHistogramProps {\n values: number[];\n lastValue: number;\n positiveColor: string;\n negativeColor: string;\n formatValue: (value: number) => string;\n width: number;\n height: number;\n}\n\nfunction VarianceHistogram({\n values,\n lastValue,\n positiveColor,\n negativeColor,\n formatValue,\n width,\n height,\n}: VarianceHistogramProps) {\n // Limit to most recent N values to fit in the histogram\n // Calculate max bars based on width (minimum 8px per bar including gap)\n const maxBars = Math.max(10, Math.floor(width / 10));\n const limitedValues =\n values.length > maxBars\n ? values.slice(-maxBars) // Take the most recent values\n : values;\n\n // Calculate variance (difference) from current/last value for each point\n const variances = limitedValues.map((value) => value - lastValue);\n\n // Find min/max variance for scaling (include 0 as baseline)\n const minVariance = Math.min(...variances, 0);\n const maxVariance = Math.max(...variances, 0);\n const range = Math.max(Math.abs(minVariance), Math.abs(maxVariance));\n\n if (range === 0 || variances.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center bg-dc-bg-secondary dc:rounded-sm dc:border border-dc-border\"\n style={{ width: `${width}px`, height: `${height}px` }}\n >\n <span className=\"dc:text-xs text-dc-text-muted\">No variance data</span>\n </div>\n );\n }\n\n // Calculate bar dimensions\n const barGap = 2;\n const availableWidth = width - (limitedValues.length - 1) * barGap;\n const barWidth = Math.max(4, availableWidth / limitedValues.length);\n\n // Calculate where zero line should be positioned (as percentage from top)\n // If maxVariance = 67 and minVariance = -24, total range = 91\n // Zero should be at 67/91 = 73.6% from top\n const totalRange = maxVariance - minVariance;\n const zeroLinePercent =\n totalRange > 0 ? (maxVariance / totalRange) * 100 : 50;\n\n return (\n <div className=\"dc:flex dc:items-center dc:space-x-2\">\n {/* Histogram bars */}\n <div\n className=\"dc:relative\"\n style={{\n width: `${width}px`,\n height: `${height}px`,\n }}\n >\n {/* Zero line (represents current value) */}\n <div\n className=\"dc:absolute dc:left-0 dc:right-0\"\n style={{\n height: \"1px\",\n top: `${zeroLinePercent}%`,\n backgroundColor: \"var(--dc-border)\",\n zIndex: 1,\n }}\n />\n\n {/* Variance bars - oldest to newest (left to right) */}\n {variances.map((variance, index) => {\n // Calculate bar height as proportion of total range\n const normalizedHeight = Math.abs(variance) / totalRange;\n const barHeight = Math.max(2, normalizedHeight * (height - 4));\n const isPositive = variance >= 0;\n const isLastValue = index === limitedValues.length - 1;\n const color = isPositive ? positiveColor : negativeColor;\n const xPosition = index * (barWidth + barGap);\n\n return (\n <div\n key={index}\n className=\"dc:absolute rounded-xs\"\n style={{\n left: `${xPosition}px`,\n width: `${barWidth}px`,\n height: `${barHeight}px`,\n backgroundColor: color,\n opacity: isLastValue ? 1 : 0.6,\n // Position bar relative to zero line\n ...(isPositive\n ? { bottom: `${100 - zeroLinePercent}%` }\n : { top: `${zeroLinePercent}%` }),\n zIndex: 2,\n }}\n title={`${formatValue(limitedValues[index])}: ${variance >= 0 ? \"+\" : \"\"}${formatValue(variance)} vs current`}\n />\n );\n })}\n </div>\n\n {/* Variance labels on the right - show actual value difference */}\n <div\n className=\"dc:flex dc:flex-col dc:justify-between dc:text-xs text-dc-text-muted\"\n style={{ height: `${height}px` }}\n >\n <span>+{formatValue(maxVariance)}</span>\n <span>\n {minVariance < 0 ? \"\" : \"\"}\n {formatValue(minVariance)}\n </span>\n </div>\n </div>\n );\n}\n\nconst KpiDelta = React.memo(function KpiDelta({\n data,\n chartConfig,\n displayConfig = {},\n queryObject,\n height = \"100%\",\n colorPalette,\n}: ChartProps) {\n const [fontSize, setFontSize] = useState(32);\n const [textWidth, setTextWidth] = useState(250);\n const containerRef = useRef<HTMLDivElement>(null);\n const valueRef = useRef<HTMLDivElement>(null);\n // Use specialized hook to avoid re-renders from unrelated context changes\n const getFieldLabel = useCubeFieldLabel();\n\n // Calculate font size and text width based on container dimensions\n useEffect(() => {\n const updateDimensions = () => {\n if (containerRef.current) {\n const container = containerRef.current;\n const rect = container.getBoundingClientRect();\n const containerWidth = rect.width;\n const containerHeight = rect.height;\n\n if (containerWidth > 0 && containerHeight > 0) {\n const widthBasedSize = containerWidth / 4;\n const heightBasedSize = containerHeight / 4;\n const baseFontSize = Math.min(widthBasedSize, heightBasedSize);\n const clampedFontSize = Math.max(28, Math.min(baseFontSize, 140));\n setFontSize(clampedFontSize);\n\n setTimeout(() => {\n if (valueRef.current) {\n const textRect = valueRef.current.getBoundingClientRect();\n const measuredWidth = textRect.width;\n // Scale histogram width with container, accounting for labels on the right (~60px)\n const maxHistogramWidth = containerWidth - 100; // Leave room for padding and labels\n const effectiveWidth = Math.max(\n measuredWidth,\n Math.min(maxHistogramWidth, containerWidth * 0.7),\n );\n setTextWidth(Math.max(100, effectiveWidth)); // Minimum 100px\n }\n }, 10);\n }\n }\n };\n\n const timer = setTimeout(updateDimensions, 50);\n\n const resizeObserver = new ResizeObserver(() => {\n setTimeout(updateDimensions, 10);\n });\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n\n return () => {\n clearTimeout(timer);\n resizeObserver.disconnect();\n };\n }, [data, chartConfig]);\n\n if (!data || data.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n }}\n >\n <div className=\"dc:text-center text-dc-text-muted\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data available</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n No data points to display\n </div>\n </div>\n </div>\n );\n }\n\n // Extract value and dimension fields from chart config\n let valueFields: string[] = [];\n let dimensionFields: string[] = [];\n\n if (chartConfig?.yAxis) {\n valueFields = Array.isArray(chartConfig.yAxis)\n ? chartConfig.yAxis\n : [chartConfig.yAxis];\n }\n\n if (chartConfig?.xAxis) {\n dimensionFields = Array.isArray(chartConfig.xAxis)\n ? chartConfig.xAxis\n : [chartConfig.xAxis];\n }\n\n if (valueFields.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n backgroundColor: \"var(--dc-danger-bg)\",\n color: \"var(--dc-danger)\",\n borderColor: \"var(--dc-danger-border)\",\n }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Configuration Error</div>\n <div className=\"dc:text-xs\">No measure field configured</div>\n </div>\n </div>\n );\n }\n\n const valueField = valueFields[0];\n const dimensionField = dimensionFields[0]; // Optional\n\n // Sort data by dimension if available (for time series)\n let sortedData = [...data];\n if (dimensionField) {\n sortedData = sortedData.sort((a, b) => {\n const aVal = a[dimensionField];\n const bVal = b[dimensionField];\n if (aVal < bVal) return -1;\n if (aVal > bVal) return 1;\n return 0;\n });\n }\n\n // Filter out incomplete or last period if enabled\n const { useLastCompletePeriod = true, skipLastPeriod = false } =\n displayConfig;\n const {\n filteredData,\n excludedIncompletePeriod,\n skippedLastPeriod,\n granularity,\n } = filterIncompletePeriod(\n sortedData,\n dimensionField,\n queryObject,\n useLastCompletePeriod,\n skipLastPeriod,\n );\n\n // Use filtered data for calculations\n const dataToUse = filteredData;\n\n // Extract values from filtered data\n const values = dataToUse\n .map((row) => row[valueField])\n .filter((val) => val !== null && val !== undefined && !isNaN(Number(val)))\n .map((val) => Number(val));\n\n if (values.length < 2) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n backgroundColor: \"var(--dc-warning-bg)\",\n color: \"var(--dc-warning)\",\n borderColor: \"var(--dc-warning-border)\",\n }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Insufficient Data</div>\n <div className=\"dc:text-xs\">\n Delta calculation requires at least 2 data points\n </div>\n <div className=\"dc:text-xs\">Current data points: {values.length}</div>\n </div>\n </div>\n );\n }\n\n // Calculate delta between last and second-last values\n const lastValue = values[values.length - 1];\n const secondLastValue = values[values.length - 2];\n const absoluteChange = lastValue - secondLastValue;\n const percentageChange =\n secondLastValue !== 0\n ? (absoluteChange / Math.abs(secondLastValue)) * 100\n : 0;\n\n const isPositiveChange = absoluteChange >= 0;\n\n // Format number with appropriate units and decimals\n const formatNumber = (value: number | null | undefined): string => {\n // If custom formatValue is provided, use it exclusively\n if (displayConfig.formatValue) {\n return displayConfig.formatValue(value);\n }\n\n // Null handling: Show placeholder for missing data\n if (value === null || value === undefined) {\n return \"—\";\n }\n\n const decimals = displayConfig.decimals ?? 0;\n const prefix = displayConfig.prefix ?? \"\";\n\n let formattedValue: string;\n\n if (Math.abs(value) >= 1e9) {\n formattedValue = (value / 1e9).toFixed(decimals) + \"B\";\n } else if (Math.abs(value) >= 1e6) {\n formattedValue = (value / 1e6).toFixed(decimals) + \"M\";\n } else if (Math.abs(value) >= 1e3) {\n formattedValue = (value / 1e3).toFixed(decimals) + \"K\";\n } else {\n formattedValue = value.toFixed(decimals);\n }\n\n return prefix + formattedValue;\n };\n\n // Get colors from palette\n const getPositiveColor = (): string => {\n if (\n displayConfig.positiveColorIndex !== undefined &&\n colorPalette?.colors\n ) {\n const colorIndex = displayConfig.positiveColorIndex;\n if (colorIndex >= 0 && colorIndex < colorPalette.colors.length) {\n return colorPalette.colors[colorIndex];\n }\n }\n return \"#10b981\"; // Default green\n };\n\n const getNegativeColor = (): string => {\n if (\n displayConfig.negativeColorIndex !== undefined &&\n colorPalette?.colors\n ) {\n const colorIndex = displayConfig.negativeColorIndex;\n if (colorIndex >= 0 && colorIndex < colorPalette.colors.length) {\n return colorPalette.colors[colorIndex];\n }\n }\n return \"#ef4444\"; // Default red\n };\n\n const positiveColor = getPositiveColor();\n const negativeColor = getNegativeColor();\n const currentColor = isPositiveChange ? positiveColor : negativeColor;\n\n return (\n <div\n ref={containerRef}\n className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full dc:h-full dc:p-4\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n }}\n >\n {/* Field Label */}\n <div\n className=\"text-dc-text-secondary dc:font-bold dc:text-center dc:mb-2 dc:flex dc:items-center dc:justify-center dc:gap-1\"\n style={{\n fontSize: \"14px\",\n lineHeight: \"1.2\",\n }}\n >\n <span>\n {(() => {\n const label = getFieldLabel(valueField);\n return label && label.length > 1 ? label : valueField;\n })()}\n </span>\n {(excludedIncompletePeriod || skippedLastPeriod) && (\n <span\n title={\n skippedLastPeriod\n ? `Excludes last ${granularity || \"period\"}`\n : `Excludes current incomplete ${granularity}`\n }\n className=\"dc:cursor-help\"\n >\n <Icon\n icon={infoCircleIcon}\n className=\"dc:w-4 dc:h-4 text-dc-text-muted dc:opacity-70\"\n />\n </span>\n )}\n </div>\n\n {/* Main KPI Value and Delta */}\n <div className=\"dc:flex dc:items-center dc:justify-center dc:space-x-4 dc:mb-2\">\n {/* Main KPI Value */}\n <div\n ref={valueRef}\n className=\"dc:font-bold dc:leading-none\"\n style={{\n fontSize: `${fontSize}px`,\n color: \"var(--dc-text)\", // Keep main value neutral\n }}\n >\n {formatNumber(lastValue)}\n </div>\n\n {/* Delta Information */}\n <div className=\"dc:flex dc:items-center dc:space-x-1\">\n {/* Arrow */}\n <div\n className=\"dc:font-bold\"\n style={{\n color: currentColor,\n fontSize: `${fontSize * 0.35}px`,\n }}\n >\n {isPositiveChange ? \"▲\" : \"▼\"}\n </div>\n\n {/* Delta Values */}\n <div className=\"dc:text-left\">\n <div\n className=\"dc:font-bold dc:leading-tight\"\n style={{\n fontSize: `${fontSize * 0.35}px`,\n color: currentColor,\n }}\n >\n {isPositiveChange ? \"+\" : \"\"}\n {formatNumber(absoluteChange)}\n </div>\n <div\n className=\"dc:font-semibold dc:leading-tight\"\n style={{\n fontSize: `${fontSize * 0.28}px`,\n color: currentColor,\n opacity: 0.8,\n }}\n >\n {isPositiveChange ? \"+\" : \"\"}\n {percentageChange.toFixed(1)}%\n </div>\n </div>\n </div>\n </div>\n\n {/* Unit/Suffix (hidden when formatValue is provided) */}\n {displayConfig.suffix && !displayConfig.formatValue && (\n <div\n className=\"text-dc-text-muted dc:text-center dc:mb-3\"\n style={{\n fontSize: \"14px\",\n lineHeight: \"1.2\",\n opacity: 0.8,\n }}\n >\n {displayConfig.suffix}\n </div>\n )}\n\n {/* Variance Histogram */}\n {displayConfig.showHistogram !== false && values.length > 2 && (\n <div className=\"dc:mt-2 dc:w-full dc:flex dc:justify-center dc:overflow-hidden\">\n <VarianceHistogram\n values={values}\n lastValue={lastValue}\n positiveColor={positiveColor}\n negativeColor={negativeColor}\n formatValue={formatNumber}\n width={textWidth}\n height={64}\n />\n </div>\n )}\n </div>\n );\n})\n\nexport default KpiDelta\n"],"names":["VarianceHistogram","values","lastValue","positiveColor","negativeColor","formatValue","width","height","maxBars","limitedValues","variances","value","minVariance","maxVariance","jsx","barGap","availableWidth","barWidth","totalRange","zeroLinePercent","jsxs","variance","index","normalizedHeight","barHeight","isPositive","isLastValue","color","xPosition","KpiDelta","React","data","chartConfig","displayConfig","queryObject","colorPalette","fontSize","setFontSize","useState","textWidth","setTextWidth","containerRef","useRef","valueRef","getFieldLabel","useCubeFieldLabel","useEffect","updateDimensions","rect","containerWidth","containerHeight","widthBasedSize","heightBasedSize","baseFontSize","clampedFontSize","measuredWidth","maxHistogramWidth","effectiveWidth","timer","resizeObserver","valueFields","dimensionFields","valueField","dimensionField","sortedData","a","b","aVal","bVal","useLastCompletePeriod","skipLastPeriod","filteredData","excludedIncompletePeriod","skippedLastPeriod","granularity","filterIncompletePeriod","row","val","secondLastValue","absoluteChange","percentageChange","isPositiveChange","formatNumber","decimals","prefix","formattedValue","getPositiveColor","colorIndex","getNegativeColor","currentColor","label","Icon","infoCircleIcon"],"mappings":"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"}
1
+ {"version":3,"file":"chart-kpi-delta-DEzA74cL.js","sources":["../../../src/client/components/charts/KpiDelta.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from \"react\";\nimport { Icon } from \"@iconify/react\";\nimport infoCircleIcon from \"@iconify-icons/tabler/info-circle\";\nimport { useCubeFieldLabel } from \"../../hooks/useCubeFieldLabel\";\nimport { filterIncompletePeriod } from \"../../utils/periodUtils\";\nimport type { ChartProps } from \"../../types\";\n\ninterface VarianceHistogramProps {\n values: number[];\n lastValue: number;\n positiveColor: string;\n negativeColor: string;\n formatValue: (value: number) => string;\n width: number;\n height: number;\n}\n\nfunction VarianceHistogram({\n values,\n lastValue,\n positiveColor,\n negativeColor,\n formatValue,\n width,\n height,\n}: VarianceHistogramProps) {\n // Limit to most recent N values to fit in the histogram\n // Calculate max bars based on width (minimum 8px per bar including gap)\n const maxBars = Math.max(10, Math.floor(width / 10));\n const limitedValues =\n values.length > maxBars\n ? values.slice(-maxBars) // Take the most recent values\n : values;\n\n // Calculate variance (difference) from current/last value for each point\n const variances = limitedValues.map((value) => value - lastValue);\n\n // Find min/max variance for scaling (include 0 as baseline)\n const minVariance = Math.min(...variances, 0);\n const maxVariance = Math.max(...variances, 0);\n const range = Math.max(Math.abs(minVariance), Math.abs(maxVariance));\n\n if (range === 0 || variances.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center bg-dc-bg-secondary dc:rounded-sm dc:border border-dc-border\"\n style={{ width: `${width}px`, height: `${height}px` }}\n >\n <span className=\"dc:text-xs text-dc-text-muted\">No variance data</span>\n </div>\n );\n }\n\n // Calculate bar dimensions\n const barGap = 2;\n const availableWidth = width - (limitedValues.length - 1) * barGap;\n const barWidth = Math.max(4, availableWidth / limitedValues.length);\n\n // Calculate where zero line should be positioned (as percentage from top)\n // If maxVariance = 67 and minVariance = -24, total range = 91\n // Zero should be at 67/91 = 73.6% from top\n const totalRange = maxVariance - minVariance;\n const zeroLinePercent =\n totalRange > 0 ? (maxVariance / totalRange) * 100 : 50;\n\n return (\n <div className=\"dc:flex dc:items-center dc:space-x-2\">\n {/* Histogram bars */}\n <div\n className=\"dc:relative\"\n style={{\n width: `${width}px`,\n height: `${height}px`,\n }}\n >\n {/* Zero line (represents current value) */}\n <div\n className=\"dc:absolute dc:left-0 dc:right-0\"\n style={{\n height: \"1px\",\n top: `${zeroLinePercent}%`,\n backgroundColor: \"var(--dc-border)\",\n zIndex: 1,\n }}\n />\n\n {/* Variance bars - oldest to newest (left to right) */}\n {variances.map((variance, index) => {\n // Calculate bar height as proportion of total range\n const normalizedHeight = Math.abs(variance) / totalRange;\n const barHeight = Math.max(2, normalizedHeight * (height - 4));\n const isPositive = variance >= 0;\n const isLastValue = index === limitedValues.length - 1;\n const color = isPositive ? positiveColor : negativeColor;\n const xPosition = index * (barWidth + barGap);\n\n return (\n <div\n key={index}\n className=\"dc:absolute rounded-xs\"\n style={{\n left: `${xPosition}px`,\n width: `${barWidth}px`,\n height: `${barHeight}px`,\n backgroundColor: color,\n opacity: isLastValue ? 1 : 0.6,\n // Position bar relative to zero line\n ...(isPositive\n ? { bottom: `${100 - zeroLinePercent}%` }\n : { top: `${zeroLinePercent}%` }),\n zIndex: 2,\n }}\n title={`${formatValue(limitedValues[index])}: ${variance >= 0 ? \"+\" : \"\"}${formatValue(variance)} vs current`}\n />\n );\n })}\n </div>\n\n {/* Variance labels on the right - show actual value difference */}\n <div\n className=\"dc:flex dc:flex-col dc:justify-between dc:text-xs text-dc-text-muted\"\n style={{ height: `${height}px` }}\n >\n <span>+{formatValue(maxVariance)}</span>\n <span>\n {minVariance < 0 ? \"\" : \"\"}\n {formatValue(minVariance)}\n </span>\n </div>\n </div>\n );\n}\n\nconst KpiDelta = React.memo(function KpiDelta({\n data,\n chartConfig,\n displayConfig = {},\n queryObject,\n height = \"100%\",\n colorPalette,\n}: ChartProps) {\n const [fontSize, setFontSize] = useState(32);\n const [textWidth, setTextWidth] = useState(250);\n const containerRef = useRef<HTMLDivElement>(null);\n const valueRef = useRef<HTMLDivElement>(null);\n // Use specialized hook to avoid re-renders from unrelated context changes\n const getFieldLabel = useCubeFieldLabel();\n\n // Calculate font size and text width based on container dimensions\n useEffect(() => {\n const updateDimensions = () => {\n if (containerRef.current) {\n const container = containerRef.current;\n const rect = container.getBoundingClientRect();\n const containerWidth = rect.width;\n const containerHeight = rect.height;\n\n if (containerWidth > 0 && containerHeight > 0) {\n const widthBasedSize = containerWidth / 4;\n const heightBasedSize = containerHeight / 4;\n const baseFontSize = Math.min(widthBasedSize, heightBasedSize);\n const clampedFontSize = Math.max(28, Math.min(baseFontSize, 140));\n setFontSize(clampedFontSize);\n\n setTimeout(() => {\n if (valueRef.current) {\n const textRect = valueRef.current.getBoundingClientRect();\n const measuredWidth = textRect.width;\n // Scale histogram width with container, accounting for labels on the right (~60px)\n const maxHistogramWidth = containerWidth - 100; // Leave room for padding and labels\n const effectiveWidth = Math.max(\n measuredWidth,\n Math.min(maxHistogramWidth, containerWidth * 0.7),\n );\n setTextWidth(Math.max(100, effectiveWidth)); // Minimum 100px\n }\n }, 10);\n }\n }\n };\n\n const timer = setTimeout(updateDimensions, 50);\n\n const resizeObserver = new ResizeObserver(() => {\n setTimeout(updateDimensions, 10);\n });\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n\n return () => {\n clearTimeout(timer);\n resizeObserver.disconnect();\n };\n }, [data, chartConfig]);\n\n if (!data || data.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n }}\n >\n <div className=\"dc:text-center text-dc-text-muted\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data available</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">\n No data points to display\n </div>\n </div>\n </div>\n );\n }\n\n // Extract value and dimension fields from chart config\n let valueFields: string[] = [];\n let dimensionFields: string[] = [];\n\n if (chartConfig?.yAxis) {\n valueFields = Array.isArray(chartConfig.yAxis)\n ? chartConfig.yAxis\n : [chartConfig.yAxis];\n }\n\n if (chartConfig?.xAxis) {\n dimensionFields = Array.isArray(chartConfig.xAxis)\n ? chartConfig.xAxis\n : [chartConfig.xAxis];\n }\n\n if (valueFields.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n backgroundColor: \"var(--dc-danger-bg)\",\n color: \"var(--dc-danger)\",\n borderColor: \"var(--dc-danger-border)\",\n }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Configuration Error</div>\n <div className=\"dc:text-xs\">No measure field configured</div>\n </div>\n </div>\n );\n }\n\n const valueField = valueFields[0];\n const dimensionField = dimensionFields[0]; // Optional\n\n // Sort data by dimension if available (for time series)\n let sortedData = [...data];\n if (dimensionField) {\n sortedData = sortedData.sort((a, b) => {\n const aVal = a[dimensionField];\n const bVal = b[dimensionField];\n if (aVal < bVal) return -1;\n if (aVal > bVal) return 1;\n return 0;\n });\n }\n\n // Filter out incomplete or last period if enabled\n const { useLastCompletePeriod = true, skipLastPeriod = false } =\n displayConfig;\n const {\n filteredData,\n excludedIncompletePeriod,\n skippedLastPeriod,\n granularity,\n } = filterIncompletePeriod(\n sortedData,\n dimensionField,\n queryObject,\n useLastCompletePeriod,\n skipLastPeriod,\n );\n\n // Use filtered data for calculations\n const dataToUse = filteredData;\n\n // Extract values from filtered data\n const values = dataToUse\n .map((row) => row[valueField])\n .filter((val) => val !== null && val !== undefined && !isNaN(Number(val)))\n .map((val) => Number(val));\n\n if (values.length < 2) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n backgroundColor: \"var(--dc-warning-bg)\",\n color: \"var(--dc-warning)\",\n borderColor: \"var(--dc-warning-border)\",\n }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Insufficient Data</div>\n <div className=\"dc:text-xs\">\n Delta calculation requires at least 2 data points\n </div>\n <div className=\"dc:text-xs\">Current data points: {values.length}</div>\n </div>\n </div>\n );\n }\n\n // Calculate delta between last and second-last values\n const lastValue = values[values.length - 1];\n const secondLastValue = values[values.length - 2];\n const absoluteChange = lastValue - secondLastValue;\n const percentageChange =\n secondLastValue !== 0\n ? (absoluteChange / Math.abs(secondLastValue)) * 100\n : 0;\n\n const isPositiveChange = absoluteChange >= 0;\n\n // Format number with appropriate units and decimals\n const formatNumber = (value: number | null | undefined): string => {\n // If custom formatValue is provided, use it exclusively\n if (displayConfig.formatValue) {\n return displayConfig.formatValue(value);\n }\n\n // Null handling: Show placeholder for missing data\n if (value === null || value === undefined) {\n return \"—\";\n }\n\n const decimals = displayConfig.decimals ?? 0;\n const prefix = displayConfig.prefix ?? \"\";\n\n let formattedValue: string;\n\n if (Math.abs(value) >= 1e9) {\n formattedValue = (value / 1e9).toFixed(decimals) + \"B\";\n } else if (Math.abs(value) >= 1e6) {\n formattedValue = (value / 1e6).toFixed(decimals) + \"M\";\n } else if (Math.abs(value) >= 1e3) {\n formattedValue = (value / 1e3).toFixed(decimals) + \"K\";\n } else {\n formattedValue = value.toFixed(decimals);\n }\n\n return prefix + formattedValue;\n };\n\n // Get colors from palette\n const getPositiveColor = (): string => {\n if (\n displayConfig.positiveColorIndex !== undefined &&\n colorPalette?.colors\n ) {\n const colorIndex = displayConfig.positiveColorIndex;\n if (colorIndex >= 0 && colorIndex < colorPalette.colors.length) {\n return colorPalette.colors[colorIndex];\n }\n }\n return \"#10b981\"; // Default green\n };\n\n const getNegativeColor = (): string => {\n if (\n displayConfig.negativeColorIndex !== undefined &&\n colorPalette?.colors\n ) {\n const colorIndex = displayConfig.negativeColorIndex;\n if (colorIndex >= 0 && colorIndex < colorPalette.colors.length) {\n return colorPalette.colors[colorIndex];\n }\n }\n return \"#ef4444\"; // Default red\n };\n\n const positiveColor = getPositiveColor();\n const negativeColor = getNegativeColor();\n const currentColor = isPositiveChange ? positiveColor : negativeColor;\n\n return (\n <div\n ref={containerRef}\n className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full dc:h-full dc:p-4\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? \"200px\" : undefined,\n }}\n >\n {/* Field Label */}\n <div\n className=\"text-dc-text-secondary dc:font-bold dc:text-center dc:mb-2 dc:flex dc:items-center dc:justify-center dc:gap-1\"\n style={{\n fontSize: \"14px\",\n lineHeight: \"1.2\",\n }}\n >\n <span>\n {(() => {\n const label = getFieldLabel(valueField);\n return label && label.length > 1 ? label : valueField;\n })()}\n </span>\n {(excludedIncompletePeriod || skippedLastPeriod) && (\n <span\n title={\n skippedLastPeriod\n ? `Excludes last ${granularity || \"period\"}`\n : `Excludes current incomplete ${granularity}`\n }\n className=\"dc:cursor-help\"\n >\n <Icon\n icon={infoCircleIcon}\n className=\"dc:w-4 dc:h-4 text-dc-text-muted dc:opacity-70\"\n />\n </span>\n )}\n </div>\n\n {/* Main KPI Value and Delta */}\n <div className=\"dc:flex dc:items-center dc:justify-center dc:space-x-4 dc:mb-2\">\n {/* Main KPI Value */}\n <div\n ref={valueRef}\n className=\"dc:font-bold dc:leading-none\"\n style={{\n fontSize: `${fontSize}px`,\n color: \"var(--dc-text)\", // Keep main value neutral\n }}\n >\n {formatNumber(lastValue)}\n </div>\n\n {/* Delta Information */}\n <div className=\"dc:flex dc:items-center dc:space-x-1\">\n {/* Arrow */}\n <div\n className=\"dc:font-bold\"\n style={{\n color: currentColor,\n fontSize: `${fontSize * 0.35}px`,\n }}\n >\n {isPositiveChange ? \"▲\" : \"▼\"}\n </div>\n\n {/* Delta Values */}\n <div className=\"dc:text-left\">\n <div\n className=\"dc:font-bold dc:leading-tight\"\n style={{\n fontSize: `${fontSize * 0.35}px`,\n color: currentColor,\n }}\n >\n {isPositiveChange ? \"+\" : \"\"}\n {formatNumber(absoluteChange)}\n </div>\n <div\n className=\"dc:font-semibold dc:leading-tight\"\n style={{\n fontSize: `${fontSize * 0.28}px`,\n color: currentColor,\n opacity: 0.8,\n }}\n >\n {isPositiveChange ? \"+\" : \"\"}\n {percentageChange.toFixed(1)}%\n </div>\n </div>\n </div>\n </div>\n\n {/* Unit/Suffix (hidden when formatValue is provided) */}\n {displayConfig.suffix && !displayConfig.formatValue && (\n <div\n className=\"text-dc-text-muted dc:text-center dc:mb-3\"\n style={{\n fontSize: \"14px\",\n lineHeight: \"1.2\",\n opacity: 0.8,\n }}\n >\n {displayConfig.suffix}\n </div>\n )}\n\n {/* Variance Histogram */}\n {displayConfig.showHistogram !== false && values.length > 2 && (\n <div className=\"dc:mt-2 dc:w-full dc:flex dc:justify-center dc:overflow-hidden\">\n <VarianceHistogram\n values={values}\n lastValue={lastValue}\n positiveColor={positiveColor}\n negativeColor={negativeColor}\n formatValue={formatNumber}\n width={textWidth}\n height={64}\n />\n </div>\n )}\n </div>\n );\n})\n\nexport default KpiDelta\n"],"names":["VarianceHistogram","values","lastValue","positiveColor","negativeColor","formatValue","width","height","maxBars","limitedValues","variances","value","minVariance","maxVariance","jsx","barGap","availableWidth","barWidth","totalRange","zeroLinePercent","jsxs","variance","index","normalizedHeight","barHeight","isPositive","isLastValue","color","xPosition","KpiDelta","React","data","chartConfig","displayConfig","queryObject","colorPalette","fontSize","setFontSize","useState","textWidth","setTextWidth","containerRef","useRef","valueRef","getFieldLabel","useCubeFieldLabel","useEffect","updateDimensions","rect","containerWidth","containerHeight","widthBasedSize","heightBasedSize","baseFontSize","clampedFontSize","measuredWidth","maxHistogramWidth","effectiveWidth","timer","resizeObserver","valueFields","dimensionFields","valueField","dimensionField","sortedData","a","b","aVal","bVal","useLastCompletePeriod","skipLastPeriod","filteredData","excludedIncompletePeriod","skippedLastPeriod","granularity","filterIncompletePeriod","row","val","secondLastValue","absoluteChange","percentageChange","isPositiveChange","formatNumber","decimals","prefix","formattedValue","getPositiveColor","colorIndex","getNegativeColor","currentColor","label","Icon","infoCircleIcon"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  import { jsxs as x, jsx as c } from "react/jsx-runtime";
2
2
  import te, { useState as j, useRef as _, useMemo as N, useCallback as ne, useEffect as re } from "react";
3
- import { I as se, d as ce } from "./icons-M7shurcH.js";
4
- import { u as ie, p as de, j as oe, k as ae } from "./charts-core-CU9u_HtL.js";
3
+ import { I as se, d as ce } from "./icons-DFJw-2HU.js";
4
+ import { u as ie, p as de, j as oe, k as ae } from "./charts-core-B4Rbfdcn.js";
5
5
  function le(o, r) {
6
6
  const e = new Date(o);
7
7
  switch (r.toLowerCase()) {
@@ -473,4 +473,4 @@ export {
473
473
  le as g,
474
474
  ue as i
475
475
  };
476
- //# sourceMappingURL=chart-kpi-number-iJh-PzsM.js.map
476
+ //# sourceMappingURL=chart-kpi-number-Bab-BZtX.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"chart-kpi-number-iJh-PzsM.js","sources":["../../../src/client/utils/periodUtils.ts","../../../src/client/components/DataHistogram.tsx","../../../src/client/components/charts/KpiNumber.tsx"],"sourcesContent":["/**\n * Utility functions for detecting incomplete time periods in KPI charts\n */\n\n/**\n * Get the end date of a period based on granularity\n * @param date - The date within the period\n * @param granularity - The time granularity (day, week, month, quarter, year)\n * @returns The end date of the period (end of day)\n */\nexport function getPeriodEndDate(date: Date, granularity: string): Date {\n const endDate = new Date(date)\n\n switch (granularity.toLowerCase()) {\n case 'day':\n // End of the same day\n endDate.setHours(23, 59, 59, 999)\n break\n\n case 'week': {\n // End of the week (Saturday, assuming week starts Sunday)\n const dayOfWeek = endDate.getDay()\n const daysUntilSaturday = 6 - dayOfWeek\n endDate.setDate(endDate.getDate() + daysUntilSaturday)\n endDate.setHours(23, 59, 59, 999)\n break\n }\n\n case 'month':\n // Last day of the month\n endDate.setMonth(endDate.getMonth() + 1, 0) // Set to day 0 of next month = last day of current month\n endDate.setHours(23, 59, 59, 999)\n break\n\n case 'quarter': {\n // Last day of the quarter\n const currentMonth = endDate.getMonth()\n const quarterEndMonth = Math.floor(currentMonth / 3) * 3 + 2 // 0->2, 3->5, 6->8, 9->11\n endDate.setMonth(quarterEndMonth + 1, 0) // Last day of quarter end month\n endDate.setHours(23, 59, 59, 999)\n break\n }\n\n case 'year':\n // December 31st\n endDate.setMonth(11, 31) // December 31\n endDate.setHours(23, 59, 59, 999)\n break\n\n default:\n // Unknown granularity - treat as complete\n endDate.setHours(23, 59, 59, 999)\n }\n\n return endDate\n}\n\n/**\n * Check if the last period in the data is complete based on granularity\n * @param lastDataPoint - The last data point in the sorted dataset\n * @param timeDimensionField - The field name containing the time value\n * @param granularity - The time granularity\n * @returns true if the period is complete, false if it's incomplete\n */\nexport function isLastPeriodComplete(\n lastDataPoint: any,\n timeDimensionField: string,\n granularity: string\n): boolean {\n if (!lastDataPoint || !timeDimensionField || !granularity) {\n return true // Assume complete if we can't determine\n }\n\n const timeValue = lastDataPoint[timeDimensionField]\n if (!timeValue) {\n return true // Assume complete if no time value\n }\n\n // Parse the time value\n const date = new Date(timeValue)\n if (isNaN(date.getTime())) {\n return true // Assume complete if invalid date\n }\n\n // Get the end of this period\n const periodEnd = getPeriodEndDate(date, granularity)\n\n // Compare with current time\n const now = new Date()\n\n // If the period end is in the future, the period is incomplete\n return periodEnd <= now\n}\n\n/**\n * Extract granularity from a query object\n * @param queryObject - The CubeQuery object\n * @param dimensionField - Optional specific dimension field to match\n * @returns The granularity string or null if not found\n */\nexport function getQueryGranularity(\n queryObject: any,\n dimensionField?: string\n): string | null {\n if (!queryObject?.timeDimensions || queryObject.timeDimensions.length === 0) {\n return null\n }\n\n // If a specific dimension field is provided, try to find its granularity\n if (dimensionField) {\n const matchingDim = queryObject.timeDimensions.find((td: any) =>\n td.dimension === dimensionField ||\n td.dimension?.includes(dimensionField) ||\n dimensionField?.includes(td.dimension)\n )\n if (matchingDim?.granularity) {\n return matchingDim.granularity\n }\n }\n\n // Fallback to first time dimension's granularity\n const firstTimeDim = queryObject.timeDimensions[0]\n return firstTimeDim?.granularity || null\n}\n\n/**\n * Filter data to exclude incomplete or last period\n * @param data - The data array sorted by time\n * @param timeDimensionField - The field containing time values\n * @param queryObject - The query object containing timeDimensions\n * @param useLastCompletePeriod - Whether to check for incomplete periods\n * @param skipLastPeriod - Whether to always skip the last period (overrides useLastCompletePeriod)\n * @returns Object with filtered data and whether filtering was applied\n */\nexport function filterIncompletePeriod(\n data: any[],\n timeDimensionField: string | undefined,\n queryObject: any,\n useLastCompletePeriod: boolean,\n skipLastPeriod: boolean = false\n): { filteredData: any[]; excludedIncompletePeriod: boolean; skippedLastPeriod: boolean; granularity: string | null } {\n // Default return - no filtering\n const noFilter = {\n filteredData: data,\n excludedIncompletePeriod: false,\n skippedLastPeriod: false,\n granularity: null\n }\n\n // Need at least 2 data points to filter\n if (data.length < 2) {\n return noFilter\n }\n\n const granularity = getQueryGranularity(queryObject, timeDimensionField)\n\n // If skipLastPeriod is enabled, always skip the last period\n if (skipLastPeriod) {\n return {\n filteredData: data.slice(0, -1),\n excludedIncompletePeriod: false,\n skippedLastPeriod: true,\n granularity\n }\n }\n\n // Skip incomplete period check if feature is disabled\n if (!useLastCompletePeriod) {\n return { ...noFilter, granularity }\n }\n\n // Skip if no time dimension field\n if (!timeDimensionField) {\n return { ...noFilter, granularity }\n }\n\n // Skip if no time dimensions in query\n if (!queryObject?.timeDimensions || queryObject.timeDimensions.length === 0) {\n return { ...noFilter, granularity }\n }\n\n if (!granularity) {\n return noFilter\n }\n\n // Check if last period is incomplete\n const lastRow = data[data.length - 1]\n if (!isLastPeriodComplete(lastRow, timeDimensionField, granularity)) {\n return {\n filteredData: data.slice(0, -1),\n excludedIncompletePeriod: true,\n skippedLastPeriod: false,\n granularity\n }\n }\n\n return { ...noFilter, granularity }\n}\n","\ninterface DataHistogramProps {\n /** Array of numeric values to create histogram from */\n values: number[]\n /** Minimum value in the dataset */\n min: number\n /** Maximum value in the dataset */\n max: number\n /** Color for the histogram bars */\n color?: string\n /** Number of buckets/bars to create (default: 12) */\n bucketCount?: number\n /** Height of the histogram in pixels (default: 32) */\n height?: number\n /** Format function for min/max labels */\n formatValue?: (value: number) => string\n /** Width of the histogram to match text above */\n width?: number\n /** Whether to show average indicator line (default: true) */\n showAverageIndicator?: boolean\n /** Target value to show as green line */\n targetValue?: number\n}\n\n/**\n * Reusable histogram component that shows the distribution of actual data values\n */\nexport default function DataHistogram({\n values,\n min,\n max,\n color = '#1f2937',\n bucketCount = 12,\n height = 32,\n formatValue = (val) => val.toString(),\n width,\n showAverageIndicator = true,\n targetValue\n}: DataHistogramProps) {\n // Create histogram buckets from actual data\n const buckets = new Array(bucketCount).fill(0)\n const range = max - min\n \n // Distribute actual values into buckets\n values.forEach(value => {\n if (range === 0) {\n // All values are the same, put everything in middle bucket\n buckets[Math.floor(bucketCount / 2)]++\n } else {\n // Calculate which bucket this value belongs to\n let bucketIndex = Math.floor(((value - min) / range) * (bucketCount - 1))\n // Clamp to valid bucket range\n bucketIndex = Math.max(0, Math.min(bucketCount - 1, bucketIndex))\n buckets[bucketIndex]++\n }\n })\n \n // Find max bucket count for normalization\n const maxBucketCount = Math.max(...buckets)\n \n // Calculate average for indicator positioning\n const average = values.reduce((sum, val) => sum + val, 0) / values.length\n \n // Calculate average position as percentage of histogram width\n const averagePosition = range === 0 ? 50 : ((average - min) / range) * 100\n \n // Calculate target position if target value is provided\n const targetPosition = targetValue !== undefined && range > 0 \n ? ((targetValue - min) / range) * 100 \n : null\n\n return (\n <div className=\"dc:flex dc:flex-col dc:items-center\">\n {/* Horizontal bars representing actual data distribution */}\n <div \n className=\"dc:relative dc:flex dc:items-end dc:justify-center dc:space-x-0.5\" \n style={{ \n height: `${height}px`,\n width: width ? `${width}px` : '200px',\n minWidth: '200px'\n }}\n >\n {buckets.map((count, i) => {\n // Normalize height based on actual data frequency\n const normalizedHeight = maxBucketCount > 0 ? count / maxBucketCount : 0\n const minHeight = 0.1 // minimum height for empty buckets\n const displayHeight = count > 0 ? Math.max(minHeight, normalizedHeight) : minHeight\n \n return (\n <div\n key={i}\n className=\"dc:flex-1 dc:rounded-t-sm dc:transition-all dc:duration-300 dc:ease-out\"\n style={{\n height: `${displayHeight * height}px`,\n backgroundColor: color,\n opacity: count > 0 ? 0.7 + (normalizedHeight * 0.3) : 0.2 // higher opacity for buckets with data\n }}\n title={`${count} values in this range`} // tooltip showing actual count\n />\n )\n })}\n \n {/* Average indicator line */}\n {showAverageIndicator && (\n <div\n className=\"dc:absolute dc:top-0 dc:bottom-0 dc:pointer-events-none\"\n style={{\n left: `${averagePosition}%`,\n transform: 'translateX(-50%)',\n width: '2px',\n backgroundColor: '#ef4444',\n opacity: 0.8,\n zIndex: 10\n }}\n title={`Average: ${formatValue(average)}`}\n >\n {/* Small triangle at top to indicate average */}\n <div\n className=\"dc:absolute dc:-top-1\"\n style={{\n left: '50%',\n transform: 'translateX(-50%)',\n width: '0',\n height: '0',\n borderLeft: '4px solid transparent',\n borderRight: '4px solid transparent',\n borderTop: '6px solid #ef4444'\n }}\n />\n </div>\n )}\n \n {/* Target indicator line */}\n {targetPosition !== null && targetValue !== undefined && (\n <div\n className=\"dc:absolute dc:top-0 dc:bottom-0 dc:pointer-events-none\"\n style={{\n left: `${Math.max(0, Math.min(100, targetPosition))}%`,\n transform: 'translateX(-50%)',\n width: '2px',\n backgroundColor: '#10b981',\n opacity: 0.8,\n zIndex: 11\n }}\n title={`Target: ${formatValue(targetValue)}`}\n >\n {/* Small triangle at top to indicate target */}\n <div\n className=\"dc:absolute dc:-top-1\"\n style={{\n left: '50%',\n transform: 'translateX(-50%)',\n width: '0',\n height: '0',\n borderLeft: '4px solid transparent',\n borderRight: '4px solid transparent',\n borderTop: '6px solid #10b981'\n }}\n />\n </div>\n )}\n </div>\n \n {/* Min/Max values aligned with histogram width */}\n <div\n className=\"dc:flex dc:justify-between dc:mt-2 dc:text-xs text-dc-text-muted\"\n style={{\n width: width ? `${width}px` : '200px',\n minWidth: '200px'\n }}\n >\n <span>{formatValue(min)}</span>\n <span>{formatValue(max)}</span>\n </div>\n\n {/* Average indicator */}\n <div className=\"dc:text-center dc:mt-1 dc:text-xs text-dc-text-muted\">\n Average of {values.length} values\n </div>\n </div>\n )\n}","import React, { useState, useRef, useEffect, useMemo, useCallback } from 'react'\nimport { Icon } from '@iconify/react'\nimport infoCircleIcon from '@iconify-icons/tabler/info-circle'\nimport { useCubeFieldLabel } from '../../hooks/useCubeFieldLabel'\nimport DataHistogram from '../DataHistogram'\nimport { parseTargetValues, calculateVariance, formatVariance } from '../../utils/targetUtils'\nimport { filterIncompletePeriod } from '../../utils/periodUtils'\nimport type { ChartProps } from '../../types'\n\nconst KpiNumber = React.memo(function KpiNumber({\n data,\n chartConfig,\n displayConfig = {},\n queryObject,\n height = \"100%\",\n colorPalette\n}: ChartProps) {\n const [fontSize, setFontSize] = useState(32)\n const [textWidth, setTextWidth] = useState(250)\n const containerRef = useRef<HTMLDivElement>(null)\n const valueRef = useRef<HTMLDivElement>(null)\n\n // Use specialized hook to avoid re-renders from unrelated context changes\n const getFieldLabel = useCubeFieldLabel()\n\n // Extract value field from chart config - handle both string and array formats\n const valueFields = useMemo(() => {\n if (!chartConfig?.yAxis) return []\n if (typeof chartConfig.yAxis === 'string') return [chartConfig.yAxis]\n if (Array.isArray(chartConfig.yAxis)) return chartConfig.yAxis\n return []\n }, [chartConfig?.yAxis])\n\n const valueField = valueFields[0] || '' // Use first measure field\n\n // Get time dimension field if present (for incomplete period filtering)\n const timeDimensionField = queryObject?.timeDimensions?.[0]?.dimension || undefined\n\n // Memoize sorted data to prevent recalculation on every render\n const sortedData = useMemo(() => {\n if (!data || data.length === 0) return []\n let sorted = [...data]\n if (timeDimensionField) {\n sorted = sorted.sort((a, b) => {\n const aVal = a[timeDimensionField]\n const bVal = b[timeDimensionField]\n if (aVal < bVal) return -1\n if (aVal > bVal) return 1\n return 0\n })\n }\n return sorted\n }, [data, timeDimensionField])\n\n // Filter out incomplete or last period if enabled\n const { useLastCompletePeriod = true, skipLastPeriod = false } = displayConfig\n\n // Memoize filtered data\n const {\n filteredData,\n excludedIncompletePeriod,\n skippedLastPeriod,\n granularity\n } = useMemo(() => {\n if (sortedData.length === 0) {\n return { filteredData: [], excludedIncompletePeriod: false, skippedLastPeriod: false, granularity: undefined }\n }\n return filterIncompletePeriod(sortedData, timeDimensionField, queryObject, useLastCompletePeriod, skipLastPeriod)\n }, [sortedData, timeDimensionField, queryObject, useLastCompletePeriod, skipLastPeriod])\n\n // Use filtered data for calculations\n const dataToUse = filteredData\n\n // Memoize value extraction to prevent recalculation\n const values = useMemo(() => {\n if (!valueField || dataToUse.length === 0) return []\n\n const rawValues = dataToUse.map(row => {\n // Try direct field access first\n if (row[valueField] !== undefined) {\n return row[valueField]\n }\n\n // If not found, try finding the first numeric field as fallback\n const numericFields = Object.keys(row).filter(key =>\n typeof row[key] === 'number' && !isNaN(row[key])\n )\n\n if (numericFields.length > 0) {\n return row[numericFields[0]]\n }\n\n return undefined\n })\n\n return rawValues\n .filter(val => val !== null && val !== undefined && !isNaN(Number(val)))\n .map(val => Number(val))\n }, [dataToUse, valueField])\n\n // Memoize statistics calculations\n const { avg, min, max } = useMemo(() => {\n if (values.length === 0) return { avg: 0, min: 0, max: 0 }\n const sum = values.reduce((acc, val) => acc + val, 0)\n const avg = sum / values.length\n const min = Math.min(...values)\n const max = Math.max(...values)\n return { avg, min, max }\n }, [values])\n\n // Memoize format function to prevent re-creating on every render\n const formatNumber = useCallback((value: number | null | undefined): string => {\n // If custom formatValue is provided, use it exclusively\n if (displayConfig.formatValue) {\n return displayConfig.formatValue(value)\n }\n\n // Null handling: Show placeholder for missing data\n if (value === null || value === undefined) {\n return '—'\n }\n\n const decimals = displayConfig.decimals ?? 0\n const prefix = displayConfig.prefix ?? ''\n\n let formattedValue: string\n\n if (Math.abs(value) >= 1e9) {\n formattedValue = (value / 1e9).toFixed(decimals) + 'B'\n } else if (Math.abs(value) >= 1e6) {\n formattedValue = (value / 1e6).toFixed(decimals) + 'M'\n } else if (Math.abs(value) >= 1e3) {\n formattedValue = (value / 1e3).toFixed(decimals) + 'K'\n } else {\n formattedValue = value.toFixed(decimals)\n }\n\n return prefix + formattedValue\n }, [displayConfig])\n\n const mainValue = values.length === 1 ? values[0] : avg\n const showStats = values.length > 1\n\n // Memoize color calculation to prevent re-creating function on every render\n const valueColor = useMemo((): string => {\n if (displayConfig.valueColorIndex !== undefined && colorPalette?.colors) {\n const colorIndex = displayConfig.valueColorIndex\n if (colorIndex >= 0 && colorIndex < colorPalette.colors.length) {\n return colorPalette.colors[colorIndex]\n }\n }\n // Default to first color in palette if available, otherwise fallback to dark gray\n return colorPalette?.colors?.[0] || '#1f2937'\n }, [displayConfig.valueColorIndex, colorPalette?.colors])\n\n // Process target values for variance calculation\n const targetValues = useMemo(() => parseTargetValues(displayConfig?.target || ''), [displayConfig?.target])\n const targetValue = targetValues.length > 0 ? targetValues[0] : null // Use first target value\n const variance = targetValue !== null && values.length > 0 ? calculateVariance(mainValue, targetValue) : null\n\n // Memoize variance color calculation\n const varianceColor = useMemo((): string => {\n if (variance === null) return '#6B7280' // Gray for no target\n\n if (variance >= 0) {\n // Positive variance - use positive color from palette\n const positiveIndex = displayConfig.positiveColorIndex ?? 1\n return colorPalette?.colors?.[positiveIndex] || '#10B981' // Green fallback\n } else {\n // Negative variance - use negative color from palette\n const negativeIndex = displayConfig.negativeColorIndex ?? 7\n return colorPalette?.colors?.[negativeIndex] || '#EF4444' // Red fallback\n }\n }, [variance, displayConfig.positiveColorIndex, displayConfig.negativeColorIndex, colorPalette?.colors])\n\n // Calculate font size and text width based on container dimensions\n useEffect(() => {\n const updateDimensions = () => {\n if (containerRef.current) {\n const container = containerRef.current\n const rect = container.getBoundingClientRect()\n const containerWidth = rect.width\n const containerHeight = rect.height\n\n if (containerWidth > 0 && containerHeight > 0) {\n // Calculate font size based on container dimensions\n // For KPI displays, we want the text to be large and prominent\n // Reserve space for the label by using more conservative sizing\n const widthBasedSize = containerWidth / 5\n const heightBasedSize = containerHeight / 4 // More conservative to leave room for label\n const baseFontSize = Math.min(widthBasedSize, heightBasedSize)\n const clampedFontSize = Math.max(24, Math.min(baseFontSize, 120)) // Lower max to ensure label fits\n setFontSize(clampedFontSize)\n\n // Use a timeout to measure text width after font size is applied\n setTimeout(() => {\n if (valueRef.current) {\n const textRect = valueRef.current.getBoundingClientRect()\n const measuredWidth = textRect.width\n // Ensure we have a minimum width and use container width as fallback\n const effectiveWidth = Math.max(measuredWidth, Math.min(containerWidth * 0.6, 300))\n setTextWidth(effectiveWidth)\n }\n }, 10)\n }\n }\n }\n\n // Initial calculation - reduce delay for faster initial render\n const timer = setTimeout(updateDimensions, 50)\n\n const resizeObserver = new ResizeObserver(() => {\n // Debounce the resize updates\n setTimeout(updateDimensions, 10)\n })\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current)\n }\n\n return () => {\n clearTimeout(timer)\n resizeObserver.disconnect()\n }\n }, [data, chartConfig])\n\n // Early returns AFTER all hooks\n if (!data || data.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined\n }}\n >\n <div className=\"dc:text-center text-dc-text-muted\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data available</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">No data points to display</div>\n </div>\n </div>\n )\n }\n\n if (valueFields.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined,\n backgroundColor: 'var(--dc-danger-bg)',\n color: 'var(--dc-danger)',\n borderColor: 'var(--dc-danger-border)'\n }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Configuration Error</div>\n <div className=\"dc:text-xs\">No measure fields configured</div>\n </div>\n </div>\n )\n }\n\n // Null handling: If all values are null, show placeholder instead of error\n if (values.length === 0) {\n return (\n <div\n ref={containerRef}\n className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full dc:h-full dc:p-4\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined\n }}\n >\n {/* Field Label */}\n <div\n className=\"text-dc-text-secondary dc:font-bold dc:text-center dc:mb-3\"\n style={{\n fontSize: '14px',\n lineHeight: '1.2'\n }}\n >\n {getFieldLabel(valueField)}\n </div>\n\n {/* No Data Placeholder */}\n <div\n className=\"dc:font-bold dc:leading-none text-dc-text-muted\"\n style={{\n fontSize: `${fontSize}px`\n }}\n >\n —\n </div>\n\n <div className=\"dc:text-xs text-dc-text-muted dc:mt-2\">No data</div>\n </div>\n )\n }\n\n return (\n <div\n ref={containerRef}\n className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full dc:h-full dc:p-4\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined\n }}\n >\n {/* Field Label - Bolder and bigger */}\n <div\n className=\"text-dc-text-secondary dc:font-bold dc:text-center dc:mb-3 dc:flex dc:items-center dc:justify-center dc:gap-1\"\n style={{\n fontSize: '14px',\n lineHeight: '1.2'\n }}\n >\n <span>\n {(() => {\n const label = getFieldLabel(valueField)\n // Temporary fix: if label seems wrong, use the field name directly\n const displayLabel = (label && label.length > 1) ? label : valueField\n return displayLabel\n })()}\n </span>\n {(excludedIncompletePeriod || skippedLastPeriod) && (\n <span\n title={skippedLastPeriod\n ? `Excludes last ${granularity || 'period'}`\n : `Excludes current incomplete ${granularity}`}\n className=\"dc:cursor-help\"\n >\n <Icon icon={infoCircleIcon} className=\"dc:w-4 dc:h-4 text-dc-text-muted dc:opacity-70\" />\n </span>\n )}\n </div>\n\n {/* Main KPI Value and Variance - Horizontal layout */}\n <div className=\"dc:flex dc:items-center dc:justify-center dc:gap-4 dc:mb-3\">\n <div\n ref={valueRef}\n className=\"dc:font-bold dc:leading-none\"\n style={{\n fontSize: `${fontSize}px`,\n color: valueColor\n }}\n >\n {formatNumber(mainValue)}\n </div>\n\n {/* Target Variance Display - To the right of main value */}\n {targetValue !== null && variance !== null && (\n <div className=\"dc:flex dc:flex-col dc:items-start\">\n <div\n className=\"dc:font-semibold\"\n style={{\n fontSize: `${Math.max(12, fontSize * 0.3)}px`,\n color: varianceColor,\n lineHeight: '1.2'\n }}\n >\n {formatVariance(variance, 1)}\n </div>\n <div\n className=\"text-dc-text-muted dc:text-xs\"\n style={{\n opacity: 0.7,\n fontSize: `${Math.max(10, fontSize * 0.2)}px`\n }}\n >\n vs {formatNumber(targetValue)}\n </div>\n </div>\n )}\n </div>\n\n {/* Unit/Suffix - Larger, not bold (hidden when formatValue is provided) */}\n {displayConfig.suffix && !displayConfig.formatValue && (\n <div\n className=\"text-dc-text-muted dc:text-center\"\n style={{\n fontSize: '14px',\n lineHeight: '1.2',\n opacity: 0.8\n }}\n >\n {displayConfig.suffix}\n </div>\n )}\n\n {/* Data Histogram for multiple values */}\n {showStats && (\n <div className=\"dc:mt-4\">\n <DataHistogram\n values={values}\n min={min}\n max={max}\n color={valueColor}\n formatValue={formatNumber}\n height={24}\n width={textWidth}\n targetValue={targetValue || undefined}\n />\n </div>\n )}\n </div>\n )\n})\n\nexport default KpiNumber\n"],"names":["getPeriodEndDate","date","granularity","endDate","daysUntilSaturday","currentMonth","quarterEndMonth","isLastPeriodComplete","lastDataPoint","timeDimensionField","timeValue","getQueryGranularity","queryObject","dimensionField","matchingDim","td","filterIncompletePeriod","data","useLastCompletePeriod","skipLastPeriod","noFilter","lastRow","DataHistogram","values","min","max","color","bucketCount","height","formatValue","val","width","showAverageIndicator","targetValue","buckets","range","value","bucketIndex","maxBucketCount","average","sum","averagePosition","targetPosition","jsxs","count","i","normalizedHeight","minHeight","displayHeight","jsx","KpiNumber","React","chartConfig","displayConfig","colorPalette","fontSize","setFontSize","useState","textWidth","setTextWidth","containerRef","useRef","valueRef","getFieldLabel","useCubeFieldLabel","valueFields","useMemo","valueField","sortedData","sorted","a","b","aVal","bVal","filteredData","excludedIncompletePeriod","skippedLastPeriod","dataToUse","row","numericFields","key","avg","acc","formatNumber","useCallback","decimals","prefix","formattedValue","mainValue","showStats","valueColor","colorIndex","targetValues","parseTargetValues","variance","calculateVariance","varianceColor","positiveIndex","negativeIndex","useEffect","updateDimensions","rect","containerWidth","containerHeight","widthBasedSize","heightBasedSize","baseFontSize","clampedFontSize","measuredWidth","effectiveWidth","timer","resizeObserver","label","Icon","infoCircleIcon","formatVariance"],"mappings":"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"}
1
+ {"version":3,"file":"chart-kpi-number-Bab-BZtX.js","sources":["../../../src/client/utils/periodUtils.ts","../../../src/client/components/DataHistogram.tsx","../../../src/client/components/charts/KpiNumber.tsx"],"sourcesContent":["/**\n * Utility functions for detecting incomplete time periods in KPI charts\n */\n\n/**\n * Get the end date of a period based on granularity\n * @param date - The date within the period\n * @param granularity - The time granularity (day, week, month, quarter, year)\n * @returns The end date of the period (end of day)\n */\nexport function getPeriodEndDate(date: Date, granularity: string): Date {\n const endDate = new Date(date)\n\n switch (granularity.toLowerCase()) {\n case 'day':\n // End of the same day\n endDate.setHours(23, 59, 59, 999)\n break\n\n case 'week': {\n // End of the week (Saturday, assuming week starts Sunday)\n const dayOfWeek = endDate.getDay()\n const daysUntilSaturday = 6 - dayOfWeek\n endDate.setDate(endDate.getDate() + daysUntilSaturday)\n endDate.setHours(23, 59, 59, 999)\n break\n }\n\n case 'month':\n // Last day of the month\n endDate.setMonth(endDate.getMonth() + 1, 0) // Set to day 0 of next month = last day of current month\n endDate.setHours(23, 59, 59, 999)\n break\n\n case 'quarter': {\n // Last day of the quarter\n const currentMonth = endDate.getMonth()\n const quarterEndMonth = Math.floor(currentMonth / 3) * 3 + 2 // 0->2, 3->5, 6->8, 9->11\n endDate.setMonth(quarterEndMonth + 1, 0) // Last day of quarter end month\n endDate.setHours(23, 59, 59, 999)\n break\n }\n\n case 'year':\n // December 31st\n endDate.setMonth(11, 31) // December 31\n endDate.setHours(23, 59, 59, 999)\n break\n\n default:\n // Unknown granularity - treat as complete\n endDate.setHours(23, 59, 59, 999)\n }\n\n return endDate\n}\n\n/**\n * Check if the last period in the data is complete based on granularity\n * @param lastDataPoint - The last data point in the sorted dataset\n * @param timeDimensionField - The field name containing the time value\n * @param granularity - The time granularity\n * @returns true if the period is complete, false if it's incomplete\n */\nexport function isLastPeriodComplete(\n lastDataPoint: any,\n timeDimensionField: string,\n granularity: string\n): boolean {\n if (!lastDataPoint || !timeDimensionField || !granularity) {\n return true // Assume complete if we can't determine\n }\n\n const timeValue = lastDataPoint[timeDimensionField]\n if (!timeValue) {\n return true // Assume complete if no time value\n }\n\n // Parse the time value\n const date = new Date(timeValue)\n if (isNaN(date.getTime())) {\n return true // Assume complete if invalid date\n }\n\n // Get the end of this period\n const periodEnd = getPeriodEndDate(date, granularity)\n\n // Compare with current time\n const now = new Date()\n\n // If the period end is in the future, the period is incomplete\n return periodEnd <= now\n}\n\n/**\n * Extract granularity from a query object\n * @param queryObject - The CubeQuery object\n * @param dimensionField - Optional specific dimension field to match\n * @returns The granularity string or null if not found\n */\nexport function getQueryGranularity(\n queryObject: any,\n dimensionField?: string\n): string | null {\n if (!queryObject?.timeDimensions || queryObject.timeDimensions.length === 0) {\n return null\n }\n\n // If a specific dimension field is provided, try to find its granularity\n if (dimensionField) {\n const matchingDim = queryObject.timeDimensions.find((td: any) =>\n td.dimension === dimensionField ||\n td.dimension?.includes(dimensionField) ||\n dimensionField?.includes(td.dimension)\n )\n if (matchingDim?.granularity) {\n return matchingDim.granularity\n }\n }\n\n // Fallback to first time dimension's granularity\n const firstTimeDim = queryObject.timeDimensions[0]\n return firstTimeDim?.granularity || null\n}\n\n/**\n * Filter data to exclude incomplete or last period\n * @param data - The data array sorted by time\n * @param timeDimensionField - The field containing time values\n * @param queryObject - The query object containing timeDimensions\n * @param useLastCompletePeriod - Whether to check for incomplete periods\n * @param skipLastPeriod - Whether to always skip the last period (overrides useLastCompletePeriod)\n * @returns Object with filtered data and whether filtering was applied\n */\nexport function filterIncompletePeriod(\n data: any[],\n timeDimensionField: string | undefined,\n queryObject: any,\n useLastCompletePeriod: boolean,\n skipLastPeriod: boolean = false\n): { filteredData: any[]; excludedIncompletePeriod: boolean; skippedLastPeriod: boolean; granularity: string | null } {\n // Default return - no filtering\n const noFilter = {\n filteredData: data,\n excludedIncompletePeriod: false,\n skippedLastPeriod: false,\n granularity: null\n }\n\n // Need at least 2 data points to filter\n if (data.length < 2) {\n return noFilter\n }\n\n const granularity = getQueryGranularity(queryObject, timeDimensionField)\n\n // If skipLastPeriod is enabled, always skip the last period\n if (skipLastPeriod) {\n return {\n filteredData: data.slice(0, -1),\n excludedIncompletePeriod: false,\n skippedLastPeriod: true,\n granularity\n }\n }\n\n // Skip incomplete period check if feature is disabled\n if (!useLastCompletePeriod) {\n return { ...noFilter, granularity }\n }\n\n // Skip if no time dimension field\n if (!timeDimensionField) {\n return { ...noFilter, granularity }\n }\n\n // Skip if no time dimensions in query\n if (!queryObject?.timeDimensions || queryObject.timeDimensions.length === 0) {\n return { ...noFilter, granularity }\n }\n\n if (!granularity) {\n return noFilter\n }\n\n // Check if last period is incomplete\n const lastRow = data[data.length - 1]\n if (!isLastPeriodComplete(lastRow, timeDimensionField, granularity)) {\n return {\n filteredData: data.slice(0, -1),\n excludedIncompletePeriod: true,\n skippedLastPeriod: false,\n granularity\n }\n }\n\n return { ...noFilter, granularity }\n}\n","\ninterface DataHistogramProps {\n /** Array of numeric values to create histogram from */\n values: number[]\n /** Minimum value in the dataset */\n min: number\n /** Maximum value in the dataset */\n max: number\n /** Color for the histogram bars */\n color?: string\n /** Number of buckets/bars to create (default: 12) */\n bucketCount?: number\n /** Height of the histogram in pixels (default: 32) */\n height?: number\n /** Format function for min/max labels */\n formatValue?: (value: number) => string\n /** Width of the histogram to match text above */\n width?: number\n /** Whether to show average indicator line (default: true) */\n showAverageIndicator?: boolean\n /** Target value to show as green line */\n targetValue?: number\n}\n\n/**\n * Reusable histogram component that shows the distribution of actual data values\n */\nexport default function DataHistogram({\n values,\n min,\n max,\n color = '#1f2937',\n bucketCount = 12,\n height = 32,\n formatValue = (val) => val.toString(),\n width,\n showAverageIndicator = true,\n targetValue\n}: DataHistogramProps) {\n // Create histogram buckets from actual data\n const buckets = new Array(bucketCount).fill(0)\n const range = max - min\n \n // Distribute actual values into buckets\n values.forEach(value => {\n if (range === 0) {\n // All values are the same, put everything in middle bucket\n buckets[Math.floor(bucketCount / 2)]++\n } else {\n // Calculate which bucket this value belongs to\n let bucketIndex = Math.floor(((value - min) / range) * (bucketCount - 1))\n // Clamp to valid bucket range\n bucketIndex = Math.max(0, Math.min(bucketCount - 1, bucketIndex))\n buckets[bucketIndex]++\n }\n })\n \n // Find max bucket count for normalization\n const maxBucketCount = Math.max(...buckets)\n \n // Calculate average for indicator positioning\n const average = values.reduce((sum, val) => sum + val, 0) / values.length\n \n // Calculate average position as percentage of histogram width\n const averagePosition = range === 0 ? 50 : ((average - min) / range) * 100\n \n // Calculate target position if target value is provided\n const targetPosition = targetValue !== undefined && range > 0 \n ? ((targetValue - min) / range) * 100 \n : null\n\n return (\n <div className=\"dc:flex dc:flex-col dc:items-center\">\n {/* Horizontal bars representing actual data distribution */}\n <div \n className=\"dc:relative dc:flex dc:items-end dc:justify-center dc:space-x-0.5\" \n style={{ \n height: `${height}px`,\n width: width ? `${width}px` : '200px',\n minWidth: '200px'\n }}\n >\n {buckets.map((count, i) => {\n // Normalize height based on actual data frequency\n const normalizedHeight = maxBucketCount > 0 ? count / maxBucketCount : 0\n const minHeight = 0.1 // minimum height for empty buckets\n const displayHeight = count > 0 ? Math.max(minHeight, normalizedHeight) : minHeight\n \n return (\n <div\n key={i}\n className=\"dc:flex-1 dc:rounded-t-sm dc:transition-all dc:duration-300 dc:ease-out\"\n style={{\n height: `${displayHeight * height}px`,\n backgroundColor: color,\n opacity: count > 0 ? 0.7 + (normalizedHeight * 0.3) : 0.2 // higher opacity for buckets with data\n }}\n title={`${count} values in this range`} // tooltip showing actual count\n />\n )\n })}\n \n {/* Average indicator line */}\n {showAverageIndicator && (\n <div\n className=\"dc:absolute dc:top-0 dc:bottom-0 dc:pointer-events-none\"\n style={{\n left: `${averagePosition}%`,\n transform: 'translateX(-50%)',\n width: '2px',\n backgroundColor: '#ef4444',\n opacity: 0.8,\n zIndex: 10\n }}\n title={`Average: ${formatValue(average)}`}\n >\n {/* Small triangle at top to indicate average */}\n <div\n className=\"dc:absolute dc:-top-1\"\n style={{\n left: '50%',\n transform: 'translateX(-50%)',\n width: '0',\n height: '0',\n borderLeft: '4px solid transparent',\n borderRight: '4px solid transparent',\n borderTop: '6px solid #ef4444'\n }}\n />\n </div>\n )}\n \n {/* Target indicator line */}\n {targetPosition !== null && targetValue !== undefined && (\n <div\n className=\"dc:absolute dc:top-0 dc:bottom-0 dc:pointer-events-none\"\n style={{\n left: `${Math.max(0, Math.min(100, targetPosition))}%`,\n transform: 'translateX(-50%)',\n width: '2px',\n backgroundColor: '#10b981',\n opacity: 0.8,\n zIndex: 11\n }}\n title={`Target: ${formatValue(targetValue)}`}\n >\n {/* Small triangle at top to indicate target */}\n <div\n className=\"dc:absolute dc:-top-1\"\n style={{\n left: '50%',\n transform: 'translateX(-50%)',\n width: '0',\n height: '0',\n borderLeft: '4px solid transparent',\n borderRight: '4px solid transparent',\n borderTop: '6px solid #10b981'\n }}\n />\n </div>\n )}\n </div>\n \n {/* Min/Max values aligned with histogram width */}\n <div\n className=\"dc:flex dc:justify-between dc:mt-2 dc:text-xs text-dc-text-muted\"\n style={{\n width: width ? `${width}px` : '200px',\n minWidth: '200px'\n }}\n >\n <span>{formatValue(min)}</span>\n <span>{formatValue(max)}</span>\n </div>\n\n {/* Average indicator */}\n <div className=\"dc:text-center dc:mt-1 dc:text-xs text-dc-text-muted\">\n Average of {values.length} values\n </div>\n </div>\n )\n}","import React, { useState, useRef, useEffect, useMemo, useCallback } from 'react'\nimport { Icon } from '@iconify/react'\nimport infoCircleIcon from '@iconify-icons/tabler/info-circle'\nimport { useCubeFieldLabel } from '../../hooks/useCubeFieldLabel'\nimport DataHistogram from '../DataHistogram'\nimport { parseTargetValues, calculateVariance, formatVariance } from '../../utils/targetUtils'\nimport { filterIncompletePeriod } from '../../utils/periodUtils'\nimport type { ChartProps } from '../../types'\n\nconst KpiNumber = React.memo(function KpiNumber({\n data,\n chartConfig,\n displayConfig = {},\n queryObject,\n height = \"100%\",\n colorPalette\n}: ChartProps) {\n const [fontSize, setFontSize] = useState(32)\n const [textWidth, setTextWidth] = useState(250)\n const containerRef = useRef<HTMLDivElement>(null)\n const valueRef = useRef<HTMLDivElement>(null)\n\n // Use specialized hook to avoid re-renders from unrelated context changes\n const getFieldLabel = useCubeFieldLabel()\n\n // Extract value field from chart config - handle both string and array formats\n const valueFields = useMemo(() => {\n if (!chartConfig?.yAxis) return []\n if (typeof chartConfig.yAxis === 'string') return [chartConfig.yAxis]\n if (Array.isArray(chartConfig.yAxis)) return chartConfig.yAxis\n return []\n }, [chartConfig?.yAxis])\n\n const valueField = valueFields[0] || '' // Use first measure field\n\n // Get time dimension field if present (for incomplete period filtering)\n const timeDimensionField = queryObject?.timeDimensions?.[0]?.dimension || undefined\n\n // Memoize sorted data to prevent recalculation on every render\n const sortedData = useMemo(() => {\n if (!data || data.length === 0) return []\n let sorted = [...data]\n if (timeDimensionField) {\n sorted = sorted.sort((a, b) => {\n const aVal = a[timeDimensionField]\n const bVal = b[timeDimensionField]\n if (aVal < bVal) return -1\n if (aVal > bVal) return 1\n return 0\n })\n }\n return sorted\n }, [data, timeDimensionField])\n\n // Filter out incomplete or last period if enabled\n const { useLastCompletePeriod = true, skipLastPeriod = false } = displayConfig\n\n // Memoize filtered data\n const {\n filteredData,\n excludedIncompletePeriod,\n skippedLastPeriod,\n granularity\n } = useMemo(() => {\n if (sortedData.length === 0) {\n return { filteredData: [], excludedIncompletePeriod: false, skippedLastPeriod: false, granularity: undefined }\n }\n return filterIncompletePeriod(sortedData, timeDimensionField, queryObject, useLastCompletePeriod, skipLastPeriod)\n }, [sortedData, timeDimensionField, queryObject, useLastCompletePeriod, skipLastPeriod])\n\n // Use filtered data for calculations\n const dataToUse = filteredData\n\n // Memoize value extraction to prevent recalculation\n const values = useMemo(() => {\n if (!valueField || dataToUse.length === 0) return []\n\n const rawValues = dataToUse.map(row => {\n // Try direct field access first\n if (row[valueField] !== undefined) {\n return row[valueField]\n }\n\n // If not found, try finding the first numeric field as fallback\n const numericFields = Object.keys(row).filter(key =>\n typeof row[key] === 'number' && !isNaN(row[key])\n )\n\n if (numericFields.length > 0) {\n return row[numericFields[0]]\n }\n\n return undefined\n })\n\n return rawValues\n .filter(val => val !== null && val !== undefined && !isNaN(Number(val)))\n .map(val => Number(val))\n }, [dataToUse, valueField])\n\n // Memoize statistics calculations\n const { avg, min, max } = useMemo(() => {\n if (values.length === 0) return { avg: 0, min: 0, max: 0 }\n const sum = values.reduce((acc, val) => acc + val, 0)\n const avg = sum / values.length\n const min = Math.min(...values)\n const max = Math.max(...values)\n return { avg, min, max }\n }, [values])\n\n // Memoize format function to prevent re-creating on every render\n const formatNumber = useCallback((value: number | null | undefined): string => {\n // If custom formatValue is provided, use it exclusively\n if (displayConfig.formatValue) {\n return displayConfig.formatValue(value)\n }\n\n // Null handling: Show placeholder for missing data\n if (value === null || value === undefined) {\n return '—'\n }\n\n const decimals = displayConfig.decimals ?? 0\n const prefix = displayConfig.prefix ?? ''\n\n let formattedValue: string\n\n if (Math.abs(value) >= 1e9) {\n formattedValue = (value / 1e9).toFixed(decimals) + 'B'\n } else if (Math.abs(value) >= 1e6) {\n formattedValue = (value / 1e6).toFixed(decimals) + 'M'\n } else if (Math.abs(value) >= 1e3) {\n formattedValue = (value / 1e3).toFixed(decimals) + 'K'\n } else {\n formattedValue = value.toFixed(decimals)\n }\n\n return prefix + formattedValue\n }, [displayConfig])\n\n const mainValue = values.length === 1 ? values[0] : avg\n const showStats = values.length > 1\n\n // Memoize color calculation to prevent re-creating function on every render\n const valueColor = useMemo((): string => {\n if (displayConfig.valueColorIndex !== undefined && colorPalette?.colors) {\n const colorIndex = displayConfig.valueColorIndex\n if (colorIndex >= 0 && colorIndex < colorPalette.colors.length) {\n return colorPalette.colors[colorIndex]\n }\n }\n // Default to first color in palette if available, otherwise fallback to dark gray\n return colorPalette?.colors?.[0] || '#1f2937'\n }, [displayConfig.valueColorIndex, colorPalette?.colors])\n\n // Process target values for variance calculation\n const targetValues = useMemo(() => parseTargetValues(displayConfig?.target || ''), [displayConfig?.target])\n const targetValue = targetValues.length > 0 ? targetValues[0] : null // Use first target value\n const variance = targetValue !== null && values.length > 0 ? calculateVariance(mainValue, targetValue) : null\n\n // Memoize variance color calculation\n const varianceColor = useMemo((): string => {\n if (variance === null) return '#6B7280' // Gray for no target\n\n if (variance >= 0) {\n // Positive variance - use positive color from palette\n const positiveIndex = displayConfig.positiveColorIndex ?? 1\n return colorPalette?.colors?.[positiveIndex] || '#10B981' // Green fallback\n } else {\n // Negative variance - use negative color from palette\n const negativeIndex = displayConfig.negativeColorIndex ?? 7\n return colorPalette?.colors?.[negativeIndex] || '#EF4444' // Red fallback\n }\n }, [variance, displayConfig.positiveColorIndex, displayConfig.negativeColorIndex, colorPalette?.colors])\n\n // Calculate font size and text width based on container dimensions\n useEffect(() => {\n const updateDimensions = () => {\n if (containerRef.current) {\n const container = containerRef.current\n const rect = container.getBoundingClientRect()\n const containerWidth = rect.width\n const containerHeight = rect.height\n\n if (containerWidth > 0 && containerHeight > 0) {\n // Calculate font size based on container dimensions\n // For KPI displays, we want the text to be large and prominent\n // Reserve space for the label by using more conservative sizing\n const widthBasedSize = containerWidth / 5\n const heightBasedSize = containerHeight / 4 // More conservative to leave room for label\n const baseFontSize = Math.min(widthBasedSize, heightBasedSize)\n const clampedFontSize = Math.max(24, Math.min(baseFontSize, 120)) // Lower max to ensure label fits\n setFontSize(clampedFontSize)\n\n // Use a timeout to measure text width after font size is applied\n setTimeout(() => {\n if (valueRef.current) {\n const textRect = valueRef.current.getBoundingClientRect()\n const measuredWidth = textRect.width\n // Ensure we have a minimum width and use container width as fallback\n const effectiveWidth = Math.max(measuredWidth, Math.min(containerWidth * 0.6, 300))\n setTextWidth(effectiveWidth)\n }\n }, 10)\n }\n }\n }\n\n // Initial calculation - reduce delay for faster initial render\n const timer = setTimeout(updateDimensions, 50)\n\n const resizeObserver = new ResizeObserver(() => {\n // Debounce the resize updates\n setTimeout(updateDimensions, 10)\n })\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current)\n }\n\n return () => {\n clearTimeout(timer)\n resizeObserver.disconnect()\n }\n }, [data, chartConfig])\n\n // Early returns AFTER all hooks\n if (!data || data.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined\n }}\n >\n <div className=\"dc:text-center text-dc-text-muted\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">No data available</div>\n <div className=\"dc:text-xs text-dc-text-secondary\">No data points to display</div>\n </div>\n </div>\n )\n }\n\n if (valueFields.length === 0) {\n return (\n <div\n className=\"dc:flex dc:items-center dc:justify-center dc:w-full dc:h-full\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined,\n backgroundColor: 'var(--dc-danger-bg)',\n color: 'var(--dc-danger)',\n borderColor: 'var(--dc-danger-border)'\n }}\n >\n <div className=\"dc:text-center\">\n <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">Configuration Error</div>\n <div className=\"dc:text-xs\">No measure fields configured</div>\n </div>\n </div>\n )\n }\n\n // Null handling: If all values are null, show placeholder instead of error\n if (values.length === 0) {\n return (\n <div\n ref={containerRef}\n className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full dc:h-full dc:p-4\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined\n }}\n >\n {/* Field Label */}\n <div\n className=\"text-dc-text-secondary dc:font-bold dc:text-center dc:mb-3\"\n style={{\n fontSize: '14px',\n lineHeight: '1.2'\n }}\n >\n {getFieldLabel(valueField)}\n </div>\n\n {/* No Data Placeholder */}\n <div\n className=\"dc:font-bold dc:leading-none text-dc-text-muted\"\n style={{\n fontSize: `${fontSize}px`\n }}\n >\n —\n </div>\n\n <div className=\"dc:text-xs text-dc-text-muted dc:mt-2\">No data</div>\n </div>\n )\n }\n\n return (\n <div\n ref={containerRef}\n className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full dc:h-full dc:p-4\"\n style={{\n height: height === \"100%\" ? \"100%\" : height,\n minHeight: height === \"100%\" ? '200px' : undefined\n }}\n >\n {/* Field Label - Bolder and bigger */}\n <div\n className=\"text-dc-text-secondary dc:font-bold dc:text-center dc:mb-3 dc:flex dc:items-center dc:justify-center dc:gap-1\"\n style={{\n fontSize: '14px',\n lineHeight: '1.2'\n }}\n >\n <span>\n {(() => {\n const label = getFieldLabel(valueField)\n // Temporary fix: if label seems wrong, use the field name directly\n const displayLabel = (label && label.length > 1) ? label : valueField\n return displayLabel\n })()}\n </span>\n {(excludedIncompletePeriod || skippedLastPeriod) && (\n <span\n title={skippedLastPeriod\n ? `Excludes last ${granularity || 'period'}`\n : `Excludes current incomplete ${granularity}`}\n className=\"dc:cursor-help\"\n >\n <Icon icon={infoCircleIcon} className=\"dc:w-4 dc:h-4 text-dc-text-muted dc:opacity-70\" />\n </span>\n )}\n </div>\n\n {/* Main KPI Value and Variance - Horizontal layout */}\n <div className=\"dc:flex dc:items-center dc:justify-center dc:gap-4 dc:mb-3\">\n <div\n ref={valueRef}\n className=\"dc:font-bold dc:leading-none\"\n style={{\n fontSize: `${fontSize}px`,\n color: valueColor\n }}\n >\n {formatNumber(mainValue)}\n </div>\n\n {/* Target Variance Display - To the right of main value */}\n {targetValue !== null && variance !== null && (\n <div className=\"dc:flex dc:flex-col dc:items-start\">\n <div\n className=\"dc:font-semibold\"\n style={{\n fontSize: `${Math.max(12, fontSize * 0.3)}px`,\n color: varianceColor,\n lineHeight: '1.2'\n }}\n >\n {formatVariance(variance, 1)}\n </div>\n <div\n className=\"text-dc-text-muted dc:text-xs\"\n style={{\n opacity: 0.7,\n fontSize: `${Math.max(10, fontSize * 0.2)}px`\n }}\n >\n vs {formatNumber(targetValue)}\n </div>\n </div>\n )}\n </div>\n\n {/* Unit/Suffix - Larger, not bold (hidden when formatValue is provided) */}\n {displayConfig.suffix && !displayConfig.formatValue && (\n <div\n className=\"text-dc-text-muted dc:text-center\"\n style={{\n fontSize: '14px',\n lineHeight: '1.2',\n opacity: 0.8\n }}\n >\n {displayConfig.suffix}\n </div>\n )}\n\n {/* Data Histogram for multiple values */}\n {showStats && (\n <div className=\"dc:mt-4\">\n <DataHistogram\n values={values}\n min={min}\n max={max}\n color={valueColor}\n formatValue={formatNumber}\n height={24}\n width={textWidth}\n targetValue={targetValue || undefined}\n />\n </div>\n )}\n </div>\n )\n})\n\nexport default KpiNumber\n"],"names":["getPeriodEndDate","date","granularity","endDate","daysUntilSaturday","currentMonth","quarterEndMonth","isLastPeriodComplete","lastDataPoint","timeDimensionField","timeValue","getQueryGranularity","queryObject","dimensionField","matchingDim","td","filterIncompletePeriod","data","useLastCompletePeriod","skipLastPeriod","noFilter","lastRow","DataHistogram","values","min","max","color","bucketCount","height","formatValue","val","width","showAverageIndicator","targetValue","buckets","range","value","bucketIndex","maxBucketCount","average","sum","averagePosition","targetPosition","jsxs","count","i","normalizedHeight","minHeight","displayHeight","jsx","KpiNumber","React","chartConfig","displayConfig","colorPalette","fontSize","setFontSize","useState","textWidth","setTextWidth","containerRef","useRef","valueRef","getFieldLabel","useCubeFieldLabel","valueFields","useMemo","valueField","sortedData","sorted","a","b","aVal","bVal","filteredData","excludedIncompletePeriod","skippedLastPeriod","dataToUse","row","numericFields","key","avg","acc","formatNumber","useCallback","decimals","prefix","formattedValue","mainValue","showStats","valueColor","colorIndex","targetValues","parseTargetValues","variance","calculateVariance","varianceColor","positiveIndex","negativeIndex","useEffect","updateDimensions","rect","containerWidth","containerHeight","widthBasedSize","heightBasedSize","baseFontSize","clampedFontSize","measuredWidth","effectiveWidth","timer","resizeObserver","label","Icon","infoCircleIcon","formatVariance"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  import { jsx as r, jsxs as N } from "react/jsx-runtime";
2
2
  import K, { useState as M, useRef as T, useEffect as O } from "react";
3
- import { u as W } from "./charts-core-CU9u_HtL.js";
4
- import { D as E } from "./chart-kpi-number-iJh-PzsM.js";
3
+ import { u as W } from "./charts-core-B4Rbfdcn.js";
4
+ import { D as E } from "./chart-kpi-number-Bab-BZtX.js";
5
5
  const X = K.memo(function({
6
6
  data: x,
7
7
  chartConfig: l,
@@ -162,4 +162,4 @@ const X = K.memo(function({
162
162
  export {
163
163
  X as default
164
164
  };
165
- //# sourceMappingURL=chart-kpi-text-x6pV9v9Q.js.map
165
+ //# sourceMappingURL=chart-kpi-text-BkTgckDJ.js.map