drizzle-cube 0.4.13 → 0.4.14

package/dist/client/charts.js.map

@@ -1 +1 @@
-{"version":3,"file":"charts.js","sources":["../../src/client/charts/chartConfigs.ts","../../src/client/charts/lazyChartConfigRegistry.ts"],"sourcesContent":["/**\n * Configuration for a single axis drop zone in the chart configuration UI\n */\nexport interface AxisDropZoneConfig {\n  /** The key to store this field in chartConfig (e.g., 'xAxis', 'yAxis', 'sizeField') */\n  key: string\n\n  /** Display label for the drop zone */\n  label: string\n\n  /** Optional description/help text shown below the label */\n  description?: string\n\n  /** Whether at least one field is required in this drop zone */\n  mandatory?: boolean\n\n  /** Maximum number of items allowed in this drop zone */\n  maxItems?: number\n\n  /** Which field types this drop zone accepts */\n  acceptTypes?: ('dimension' | 'timeDimension' | 'measure')[]\n\n  /** Placeholder text when drop zone is empty */\n  emptyText?: string\n\n  /** Enable L/R axis toggle for items in this drop zone (for dual Y-axis support) */\n  enableDualAxis?: boolean\n}\n\n/**\n * Configuration for a single display option\n */\nexport interface DisplayOptionConfig {\n  /** The key to store this field in displayConfig */\n  key: string\n  \n  /** Display label for the option */\n  label: string\n  \n  /** Type of input control to render */\n  type: 'boolean' | 'string' | 'number' | 'select' | 'color' | 'paletteColor' | 'axisFormat' | 'stringArray' | 'buttonGroup'\n  \n  /** Default value for the option */\n  defaultValue?: any\n  \n  /** Placeholder text for string/number inputs */\n  placeholder?: string\n  \n  /** Options for select type */\n  options?: Array<{ value: any; label: string }>\n  \n  /** Help text shown below the input */\n  description?: string\n  \n  /** Minimum value for number inputs */\n  min?: number\n  \n  /** Maximum value for number inputs */\n  max?: number\n  \n  /** Step value for number inputs */\n  step?: number\n}\n\n/**\n * Configuration for which elements in a chart support clicking (for drill-down)\n */\nexport interface ClickableElementsConfig {\n  /** Bars in bar charts */\n  bar?: boolean\n  /** Points/dots in line/scatter charts */\n  point?: boolean\n  /** Slices in pie/donut charts */\n  slice?: boolean\n  /** Cells in heatmaps */\n  cell?: boolean\n  /** Nodes in treemaps, sankey diagrams */\n  node?: boolean\n  /** Areas in area charts */\n  area?: boolean\n  /** Rows in data tables */\n  row?: boolean\n}\n\n/**\n * Complete configuration for a chart type\n */\nexport interface ChartTypeConfig {\n  /** Display label for the chart type in the picker (e.g., 'Bar Chart', 'KPI Number') */\n  label?: string\n\n  /** Configuration for each drop zone */\n  dropZones: AxisDropZoneConfig[]\n\n  /** Simple display options (backward compatibility) - rendered as boolean checkboxes */\n  displayOptions?: string[]\n\n  /** Structured display options with metadata for different input types */\n  displayOptionsConfig?: DisplayOptionConfig[]\n\n  /** Optional custom validation function */\n  validate?: (config: any) => { isValid: boolean; message?: string }\n\n  /** Brief description of the chart */\n  description?: string\n\n  /** When to use this chart type */\n  useCase?: string\n\n  /** Whether this chart type skips query requirements (for content-based charts like markdown) */\n  skipQuery?: boolean\n\n  /** Configuration for which elements support clicking (for drill-down) */\n  clickableElements?: ClickableElementsConfig\n}\n\n/**\n * Registry of all chart type configurations\n */\nexport interface ChartConfigRegistry {\n  [chartType: string]: ChartTypeConfig\n}\n\n/**\n * Default configuration for charts without specific requirements\n */\nexport const defaultChartConfig: ChartTypeConfig = {\n  dropZones: [\n    {\n      key: 'xAxis',\n      label: 'X-Axis (Categories)',\n      description: 'Dimensions and time dimensions for grouping',\n      mandatory: false,\n      acceptTypes: ['dimension', 'timeDimension'],\n      emptyText: 'Drop dimensions & time dimensions here'\n    },\n    {\n      key: 'yAxis',\n      label: 'Y-Axis (Values)',\n      description: 'Measures for values or dimensions for series',\n      mandatory: false,\n      acceptTypes: ['measure', 'dimension'],\n      emptyText: 'Drop measures or dimensions here'\n    },\n    {\n      key: 'series',\n      label: 'Series (Split into Multiple Series)',\n      description: 'Dimensions to create separate data series',\n      mandatory: false,\n      acceptTypes: ['dimension'],\n      emptyText: 'Drop dimensions here to split data into series'\n    }\n  ],\n  displayOptions: ['showLegend', 'showGrid', 'showTooltip']\n}\n\n/**\n * Helper function to get configuration for a chart type\n */\nexport function getChartConfig(chartType: string, registry: ChartConfigRegistry): ChartTypeConfig {\n  return registry[chartType] || defaultChartConfig\n}","/**\n * Lazy Chart Config Registry\n *\n * Provides async loading for chart configurations.\n * This enables code splitting - each chart config loads only when needed.\n */\n\nimport { useState, useEffect } from 'react'\nimport type { ChartType } from '../types'\nimport type { ChartTypeConfig, ChartConfigRegistry } from './chartConfigs'\nimport { defaultChartConfig } from './chartConfigs'\n\n// Config import map - lazy imports for each chart config\nconst configImportMap: Record<ChartType, () => Promise<{ [key: string]: ChartTypeConfig }>> = {\n  bar: () => import('../components/charts/BarChart.config'),\n  line: () => import('../components/charts/LineChart.config'),\n  area: () => import('../components/charts/AreaChart.config'),\n  pie: () => import('../components/charts/PieChart.config'),\n  scatter: () => import('../components/charts/ScatterChart.config'),\n  radar: () => import('../components/charts/RadarChart.config'),\n  radialBar: () => import('../components/charts/RadialBarChart.config'),\n  treemap: () => import('../components/charts/TreeMapChart.config'),\n  bubble: () => import('../components/charts/BubbleChart.config'),\n  table: () => import('../components/charts/DataTable.config'),\n  activityGrid: () => import('../components/charts/ActivityGridChart.config'),\n  kpiNumber: () => import('../components/charts/KpiNumber.config'),\n  kpiDelta: () => import('../components/charts/KpiDelta.config'),\n  kpiText: () => import('../components/charts/KpiText.config'),\n  markdown: () => import('../components/charts/MarkdownChart.config'),\n  funnel: () => import('../components/charts/FunnelChart.config'),\n  sankey: () => import('../components/charts/SankeyChart.config'),\n  sunburst: () => import('../components/charts/SunburstChart.config'),\n  heatmap: () => import('../components/charts/HeatMapChart.config'),\n  retentionHeatmap: () => import('../components/charts/RetentionHeatmap.config'),\n  retentionCombined: () => import('../components/charts/RetentionCombinedChart.config'),\n  boxPlot: () => import('../components/charts/BoxPlotChart.config'),\n}\n\n// Map from chart type to expected export name\nconst configExportNames: Record<ChartType, string> = {\n  bar: 'barChartConfig',\n  line: 'lineChartConfig',\n  area: 'areaChartConfig',\n  pie: 'pieChartConfig',\n  scatter: 'scatterChartConfig',\n  radar: 'radarChartConfig',\n  radialBar: 'radialBarChartConfig',\n  treemap: 'treemapChartConfig',\n  bubble: 'bubbleChartConfig',\n  table: 'dataTableConfig',\n  activityGrid: 'activityGridChartConfig',\n  kpiNumber: 'kpiNumberConfig',\n  kpiDelta: 'kpiDeltaConfig',\n  kpiText: 'kpiTextConfig',\n  markdown: 'markdownConfig',\n  funnel: 'funnelChartConfig',\n  sankey: 'sankeyChartConfig',\n  sunburst: 'sunburstChartConfig',\n  heatmap: 'heatmapChartConfig',\n  retentionHeatmap: 'retentionHeatmapConfig',\n  retentionCombined: 'retentionCombinedConfig',\n  boxPlot: 'boxPlotChartConfig',\n}\n\n// Cache for loaded configs\nconst configCache = new Map<ChartType, ChartTypeConfig>()\n\n/**\n * Get a chart config asynchronously\n *\n * @param chartType The chart type to load config for\n * @returns The chart type config, or null if not found\n *\n * @example\n * ```typescript\n * const config = await getChartConfigAsync('bar')\n * console.log(config?.dropZones)\n * ```\n */\nexport async function getChartConfigAsync(chartType: ChartType): Promise<ChartTypeConfig | null> {\n  // Check cache first\n  if (configCache.has(chartType)) {\n    return configCache.get(chartType)!\n  }\n\n  const importFn = configImportMap[chartType]\n  if (!importFn) {\n    return null\n  }\n\n  try {\n    const module = await importFn()\n    const exportName = configExportNames[chartType]\n    const config = module[exportName]\n\n    if (config) {\n      configCache.set(chartType, config)\n      return config\n    }\n    return null\n  } catch (error) {\n    console.error(`Failed to load config for chart type: ${chartType}`, error)\n    return null\n  }\n}\n\n/**\n * Get a chart config synchronously from cache\n *\n * Returns the cached config if available, otherwise returns the default config.\n * Use this when you need sync access and have already preloaded the config.\n *\n * @param chartType The chart type to get config for\n * @returns The chart type config (from cache or default)\n */\nexport function getChartConfigSync(chartType: ChartType): ChartTypeConfig {\n  return configCache.get(chartType) || defaultChartConfig\n}\n\n/**\n * Check if a chart config is already loaded\n */\nexport function isChartConfigLoaded(chartType: ChartType): boolean {\n  return configCache.has(chartType)\n}\n\n/**\n * React hook for using chart config\n *\n * Loads the chart config asynchronously and caches it.\n * Returns the default config while loading.\n *\n * @param chartType The chart type to load config for\n * @returns Object with config, loading state, and loaded flag\n *\n * @example\n * ```tsx\n * function ChartSetup({ chartType }) {\n *   const { config, loading } = useChartConfig(chartType)\n *\n *   if (loading) return <Spinner />\n *   return <ConfigForm config={config} />\n * }\n * ```\n */\nexport function useChartConfig(chartType: ChartType | undefined): {\n  config: ChartTypeConfig\n  loading: boolean\n  loaded: boolean\n} {\n  const [config, setConfig] = useState<ChartTypeConfig>(\n    chartType ? getChartConfigSync(chartType) : defaultChartConfig\n  )\n  const [loading, setLoading] = useState(false)\n  const [loaded, setLoaded] = useState(false)\n\n  useEffect(() => {\n    if (!chartType) {\n      setConfig(defaultChartConfig)\n      setLoaded(false)\n      return\n    }\n\n    // Check cache synchronously first\n    if (configCache.has(chartType)) {\n      setConfig(configCache.get(chartType)!)\n      setLoaded(true)\n      return\n    }\n\n    // Load async\n    setLoading(true)\n    getChartConfigAsync(chartType)\n      .then((loadedConfig) => {\n        if (loadedConfig) {\n          setConfig(loadedConfig)\n          setLoaded(true)\n        } else {\n          setConfig(defaultChartConfig)\n          setLoaded(true)\n        }\n      })\n      .finally(() => setLoading(false))\n  }, [chartType])\n\n  return { config, loading, loaded }\n}\n\n/**\n * Preload a chart config\n *\n * Triggers the async import without needing to use the config immediately.\n * Useful for prefetching configs that will likely be needed.\n *\n * @param chartType The chart type to preload config for\n */\nexport async function preloadChartConfig(chartType: ChartType): Promise<void> {\n  if (!configCache.has(chartType)) {\n    await getChartConfigAsync(chartType)\n  }\n}\n\n/**\n * Preload multiple chart configs\n *\n * @param chartTypes Array of chart types to preload\n */\nexport async function preloadChartConfigs(chartTypes: ChartType[]): Promise<void> {\n  await Promise.all(chartTypes.map(preloadChartConfig))\n}\n\n/**\n * Load all chart configs and return as a registry\n *\n * Useful for SSR or when you need all configs upfront.\n * After calling this, all configs are cached and available synchronously.\n *\n * @returns Complete chart config registry\n *\n * @example\n * ```typescript\n * // On server or during initialization\n * const registry = await loadAllChartConfigs()\n * // Now all configs are cached and getChartConfigSync works for all types\n * ```\n */\nexport async function loadAllChartConfigs(): Promise<ChartConfigRegistry> {\n  const chartTypes = Object.keys(configImportMap) as ChartType[]\n  await Promise.all(chartTypes.map(getChartConfigAsync))\n\n  const registry: ChartConfigRegistry = {}\n  for (const chartType of chartTypes) {\n    const config = configCache.get(chartType)\n    if (config) {\n      registry[chartType] = config\n    }\n  }\n  return registry\n}\n\n/**\n * Clear the config cache\n *\n * Useful for testing or when configs need to be reloaded.\n */\nexport function clearChartConfigCache(): void {\n  configCache.clear()\n}\n"],"names":["defaultChartConfig","configImportMap","configExportNames","configCache","getChartConfigAsync","chartType","importFn","module","exportName","config","error","getChartConfigSync","isChartConfigLoaded","useChartConfig","setConfig","useState","loading","setLoading","loaded","setLoaded","useEffect","loadedConfig","preloadChartConfig","preloadChartConfigs","chartTypes","loadAllChartConfigs","registry","clearChartConfigCache"],"mappings":"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"}
+{"version":3,"file":"charts.js","sources":["../../src/client/charts/chartConfigs.ts","../../src/client/charts/lazyChartConfigRegistry.ts"],"sourcesContent":["/**\n * Configuration for a single axis drop zone in the chart configuration UI\n */\nexport interface AxisDropZoneConfig {\n  /** The key to store this field in chartConfig (e.g., 'xAxis', 'yAxis', 'sizeField') */\n  key: string\n\n  /** Display label for the drop zone */\n  label: string\n\n  /** Optional description/help text shown below the label */\n  description?: string\n\n  /** Whether at least one field is required in this drop zone */\n  mandatory?: boolean\n\n  /** Maximum number of items allowed in this drop zone */\n  maxItems?: number\n\n  /** Which field types this drop zone accepts */\n  acceptTypes?: ('dimension' | 'timeDimension' | 'measure')[]\n\n  /** Placeholder text when drop zone is empty */\n  emptyText?: string\n\n  /** Enable L/R axis toggle for items in this drop zone (for dual Y-axis support) */\n  enableDualAxis?: boolean\n}\n\n/**\n * Configuration for a single display option\n */\nexport interface DisplayOptionConfig {\n  /** The key to store this field in displayConfig */\n  key: string\n  \n  /** Display label for the option */\n  label: string\n  \n  /** Type of input control to render */\n  type: 'boolean' | 'string' | 'number' | 'select' | 'color' | 'paletteColor' | 'axisFormat' | 'stringArray' | 'buttonGroup'\n  \n  /** Default value for the option */\n  defaultValue?: any\n  \n  /** Placeholder text for string/number inputs */\n  placeholder?: string\n  \n  /** Options for select type */\n  options?: Array<{ value: any; label: string }>\n  \n  /** Help text shown below the input */\n  description?: string\n  \n  /** Minimum value for number inputs */\n  min?: number\n  \n  /** Maximum value for number inputs */\n  max?: number\n  \n  /** Step value for number inputs */\n  step?: number\n}\n\n/**\n * Configuration for which elements in a chart support clicking (for drill-down)\n */\nexport interface ClickableElementsConfig {\n  /** Bars in bar charts */\n  bar?: boolean\n  /** Points/dots in line/scatter charts */\n  point?: boolean\n  /** Slices in pie/donut charts */\n  slice?: boolean\n  /** Cells in heatmaps */\n  cell?: boolean\n  /** Nodes in treemaps, sankey diagrams */\n  node?: boolean\n  /** Areas in area charts */\n  area?: boolean\n  /** Rows in data tables */\n  row?: boolean\n}\n\n/**\n * Complete configuration for a chart type\n */\nexport interface ChartTypeConfig {\n  /** Display label for the chart type in the picker (e.g., 'Bar Chart', 'KPI Number') */\n  label?: string\n\n  /** Configuration for each drop zone */\n  dropZones: AxisDropZoneConfig[]\n\n  /** Simple display options (backward compatibility) - rendered as boolean checkboxes */\n  displayOptions?: string[]\n\n  /** Structured display options with metadata for different input types */\n  displayOptionsConfig?: DisplayOptionConfig[]\n\n  /** Optional custom validation function */\n  validate?: (config: any) => { isValid: boolean; message?: string }\n\n  /** Brief description of the chart */\n  description?: string\n\n  /** When to use this chart type */\n  useCase?: string\n\n  /** Whether this chart type skips query requirements (for content-based charts like markdown) */\n  skipQuery?: boolean\n\n  /** Configuration for which elements support clicking (for drill-down) */\n  clickableElements?: ClickableElementsConfig\n}\n\n/**\n * Registry of all chart type configurations\n */\nexport interface ChartConfigRegistry {\n  [chartType: string]: ChartTypeConfig\n}\n\n/**\n * Default configuration for charts without specific requirements\n */\nexport const defaultChartConfig: ChartTypeConfig = {\n  dropZones: [\n    {\n      key: 'xAxis',\n      label: 'X-Axis (Categories)',\n      description: 'Dimensions and time dimensions for grouping',\n      mandatory: false,\n      acceptTypes: ['dimension', 'timeDimension'],\n      emptyText: 'Drop dimensions & time dimensions here'\n    },\n    {\n      key: 'yAxis',\n      label: 'Y-Axis (Values)',\n      description: 'Measures for values or dimensions for series',\n      mandatory: false,\n      acceptTypes: ['measure', 'dimension'],\n      emptyText: 'Drop measures or dimensions here'\n    },\n    {\n      key: 'series',\n      label: 'Series (Split into Multiple Series)',\n      description: 'Dimensions to create separate data series',\n      mandatory: false,\n      acceptTypes: ['dimension'],\n      emptyText: 'Drop dimensions here to split data into series'\n    }\n  ],\n  displayOptions: ['showLegend', 'showGrid', 'showTooltip']\n}\n\n/**\n * Helper function to get configuration for a chart type\n */\nexport function getChartConfig(chartType: string, registry: ChartConfigRegistry): ChartTypeConfig {\n  return registry[chartType] || defaultChartConfig\n}","/**\n * Lazy Chart Config Registry\n *\n * Provides async loading for chart configurations.\n * This enables code splitting - each chart config loads only when needed.\n */\n\nimport { useState, useEffect } from 'react'\nimport type { ChartType } from '../types'\nimport type { ChartTypeConfig, ChartConfigRegistry } from './chartConfigs'\nimport { defaultChartConfig } from './chartConfigs'\n\n// Config import map - lazy imports for each chart config\nconst configImportMap: Record<ChartType, () => Promise<{ [key: string]: ChartTypeConfig }>> = {\n  bar: () => import('../components/charts/BarChart.config'),\n  line: () => import('../components/charts/LineChart.config'),\n  area: () => import('../components/charts/AreaChart.config'),\n  pie: () => import('../components/charts/PieChart.config'),\n  scatter: () => import('../components/charts/ScatterChart.config'),\n  radar: () => import('../components/charts/RadarChart.config'),\n  radialBar: () => import('../components/charts/RadialBarChart.config'),\n  treemap: () => import('../components/charts/TreeMapChart.config'),\n  bubble: () => import('../components/charts/BubbleChart.config'),\n  table: () => import('../components/charts/DataTable.config'),\n  activityGrid: () => import('../components/charts/ActivityGridChart.config'),\n  kpiNumber: () => import('../components/charts/KpiNumber.config'),\n  kpiDelta: () => import('../components/charts/KpiDelta.config'),\n  kpiText: () => import('../components/charts/KpiText.config'),\n  markdown: () => import('../components/charts/MarkdownChart.config'),\n  funnel: () => import('../components/charts/FunnelChart.config'),\n  sankey: () => import('../components/charts/SankeyChart.config'),\n  sunburst: () => import('../components/charts/SunburstChart.config'),\n  heatmap: () => import('../components/charts/HeatMapChart.config'),\n  retentionHeatmap: () => import('../components/charts/RetentionHeatmap.config'),\n  retentionCombined: () => import('../components/charts/RetentionCombinedChart.config'),\n  boxPlot: () => import('../components/charts/BoxPlotChart.config'),\n  waterfall: () => import('../components/charts/WaterfallChart.config'),\n  candlestick: () => import('../components/charts/CandlestickChart.config'),\n  measureProfile: () => import('../components/charts/MeasureProfileChart.config'),\n  gauge: () => import('../components/charts/GaugeChart.config'),\n}\n\n// Map from chart type to expected export name\nconst configExportNames: Record<ChartType, string> = {\n  bar: 'barChartConfig',\n  line: 'lineChartConfig',\n  area: 'areaChartConfig',\n  pie: 'pieChartConfig',\n  scatter: 'scatterChartConfig',\n  radar: 'radarChartConfig',\n  radialBar: 'radialBarChartConfig',\n  treemap: 'treemapChartConfig',\n  bubble: 'bubbleChartConfig',\n  table: 'dataTableConfig',\n  activityGrid: 'activityGridChartConfig',\n  kpiNumber: 'kpiNumberConfig',\n  kpiDelta: 'kpiDeltaConfig',\n  kpiText: 'kpiTextConfig',\n  markdown: 'markdownConfig',\n  funnel: 'funnelChartConfig',\n  sankey: 'sankeyChartConfig',\n  sunburst: 'sunburstChartConfig',\n  heatmap: 'heatmapChartConfig',\n  retentionHeatmap: 'retentionHeatmapConfig',\n  retentionCombined: 'retentionCombinedConfig',\n  boxPlot: 'boxPlotChartConfig',\n  waterfall: 'waterfallChartConfig',\n  candlestick: 'candlestickChartConfig',\n  measureProfile: 'measureProfileChartConfig',\n  gauge: 'gaugeChartConfig',\n}\n\n// Cache for loaded configs\nconst configCache = new Map<ChartType, ChartTypeConfig>()\n\n/**\n * Get a chart config asynchronously\n *\n * @param chartType The chart type to load config for\n * @returns The chart type config, or null if not found\n *\n * @example\n * ```typescript\n * const config = await getChartConfigAsync('bar')\n * console.log(config?.dropZones)\n * ```\n */\nexport async function getChartConfigAsync(chartType: ChartType): Promise<ChartTypeConfig | null> {\n  // Check cache first\n  if (configCache.has(chartType)) {\n    return configCache.get(chartType)!\n  }\n\n  const importFn = configImportMap[chartType]\n  if (!importFn) {\n    return null\n  }\n\n  try {\n    const module = await importFn()\n    const exportName = configExportNames[chartType]\n    const config = module[exportName]\n\n    if (config) {\n      configCache.set(chartType, config)\n      return config\n    }\n    return null\n  } catch (error) {\n    console.error(`Failed to load config for chart type: ${chartType}`, error)\n    return null\n  }\n}\n\n/**\n * Get a chart config synchronously from cache\n *\n * Returns the cached config if available, otherwise returns the default config.\n * Use this when you need sync access and have already preloaded the config.\n *\n * @param chartType The chart type to get config for\n * @returns The chart type config (from cache or default)\n */\nexport function getChartConfigSync(chartType: ChartType): ChartTypeConfig {\n  return configCache.get(chartType) || defaultChartConfig\n}\n\n/**\n * Check if a chart config is already loaded\n */\nexport function isChartConfigLoaded(chartType: ChartType): boolean {\n  return configCache.has(chartType)\n}\n\n/**\n * React hook for using chart config\n *\n * Loads the chart config asynchronously and caches it.\n * Returns the default config while loading.\n *\n * @param chartType The chart type to load config for\n * @returns Object with config, loading state, and loaded flag\n *\n * @example\n * ```tsx\n * function ChartSetup({ chartType }) {\n *   const { config, loading } = useChartConfig(chartType)\n *\n *   if (loading) return <Spinner />\n *   return <ConfigForm config={config} />\n * }\n * ```\n */\nexport function useChartConfig(chartType: ChartType | undefined): {\n  config: ChartTypeConfig\n  loading: boolean\n  loaded: boolean\n} {\n  const [config, setConfig] = useState<ChartTypeConfig>(\n    chartType ? getChartConfigSync(chartType) : defaultChartConfig\n  )\n  const [loading, setLoading] = useState(false)\n  const [loaded, setLoaded] = useState(false)\n\n  useEffect(() => {\n    if (!chartType) {\n      setConfig(defaultChartConfig)\n      setLoaded(false)\n      return\n    }\n\n    // Check cache synchronously first\n    if (configCache.has(chartType)) {\n      setConfig(configCache.get(chartType)!)\n      setLoaded(true)\n      return\n    }\n\n    // Load async\n    setLoading(true)\n    getChartConfigAsync(chartType)\n      .then((loadedConfig) => {\n        if (loadedConfig) {\n          setConfig(loadedConfig)\n          setLoaded(true)\n        } else {\n          setConfig(defaultChartConfig)\n          setLoaded(true)\n        }\n      })\n      .finally(() => setLoading(false))\n  }, [chartType])\n\n  return { config, loading, loaded }\n}\n\n/**\n * Preload a chart config\n *\n * Triggers the async import without needing to use the config immediately.\n * Useful for prefetching configs that will likely be needed.\n *\n * @param chartType The chart type to preload config for\n */\nexport async function preloadChartConfig(chartType: ChartType): Promise<void> {\n  if (!configCache.has(chartType)) {\n    await getChartConfigAsync(chartType)\n  }\n}\n\n/**\n * Preload multiple chart configs\n *\n * @param chartTypes Array of chart types to preload\n */\nexport async function preloadChartConfigs(chartTypes: ChartType[]): Promise<void> {\n  await Promise.all(chartTypes.map(preloadChartConfig))\n}\n\n/**\n * Load all chart configs and return as a registry\n *\n * Useful for SSR or when you need all configs upfront.\n * After calling this, all configs are cached and available synchronously.\n *\n * @returns Complete chart config registry\n *\n * @example\n * ```typescript\n * // On server or during initialization\n * const registry = await loadAllChartConfigs()\n * // Now all configs are cached and getChartConfigSync works for all types\n * ```\n */\nexport async function loadAllChartConfigs(): Promise<ChartConfigRegistry> {\n  const chartTypes = Object.keys(configImportMap) as ChartType[]\n  await Promise.all(chartTypes.map(getChartConfigAsync))\n\n  const registry: ChartConfigRegistry = {}\n  for (const chartType of chartTypes) {\n    const config = configCache.get(chartType)\n    if (config) {\n      registry[chartType] = config\n    }\n  }\n  return registry\n}\n\n/**\n * Clear the config cache\n *\n * Useful for testing or when configs need to be reloaded.\n */\nexport function clearChartConfigCache(): void {\n  configCache.clear()\n}\n"],"names":["defaultChartConfig","configImportMap","configExportNames","configCache","getChartConfigAsync","chartType","importFn","module","exportName","config","error","getChartConfigSync","isChartConfigLoaded","useChartConfig","setConfig","useState","loading","setLoading","loaded","setLoaded","useEffect","loadedConfig","preloadChartConfig","preloadChartConfigs","chartTypes","loadAllChartConfigs","registry","clearChartConfigCache"],"mappings":"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"}

package/dist/client/chunks/{RetentionCombinedChart-CEI8KQ3t.js → RetentionCombinedChart-CLq89aOJ.js}

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as l } from "react/jsx-runtime";
 import E, { useState as M, useMemo as T } from "react";
 import { ComposedChart as O, CartesianGrid as W, XAxis as F, YAxis as B, Legend as I, Line as X } from "recharts";
-import { a as Y, C as q, b as J, c as $ } from "./charts-core-DmGfleFz.js";
+import { a as Y, C as q, b as J, c as $ } from "./charts-core-CU9u_HtL.js";
 import { i as K } from "./retention-CzCo8262.js";
 function Q(d) {
   return `rgba(34, 197, 94, ${0.1 + Math.max(0, Math.min(1, d)) * 0.7})`;
@@ -253,4 +253,4 @@ const ae = E.memo(function({
 export {
   ae as default
 };
-//# sourceMappingURL=RetentionCombinedChart-CEI8KQ3t.js.map
+//# sourceMappingURL=RetentionCombinedChart-CLq89aOJ.js.map

package/dist/client/chunks/{RetentionCombinedChart-CEI8KQ3t.js.map → RetentionCombinedChart-CLq89aOJ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"RetentionCombinedChart-CEI8KQ3t.js","sources":["../../../src/client/components/charts/RetentionCombinedChart.tsx"],"sourcesContent":["/**\n * RetentionCombinedChart Component\n *\n * Combined visualization for retention analysis data.\n * Supports multiple display modes: heatmap, line chart, or combined view.\n *\n * Features:\n * - X-axis: Period numbers (P0, P1, P2...)\n * - Y-axis: Retention % (0-100%)\n * - Lines: One per breakdown value (or single if no breakdown)\n * - Display modes: 'heatmap' | 'line' | 'combined'\n * - Heatmap shows color-coded retention matrix\n * - Line chart shows retention curves over periods\n */\n\nimport React, { useMemo, useState } from 'react'\nimport {\n  ComposedChart,\n  Line,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Legend,\n} from 'recharts'\nimport ChartContainer from './ChartContainer'\nimport ChartTooltip from './ChartTooltip'\nimport { CHART_COLORS, CHART_MARGINS } from '../../utils/chartConstants'\nimport type { ChartProps } from '../../types'\nimport type { RetentionChartData, RetentionResultRow, RetentionGranularity } from '../../types/retention'\nimport { isRetentionData } from '../../types/retention'\n\n/**\n * Retention display mode\n * - 'heatmap': Show retention as color-coded bars\n * - 'line': Show retention as line curves\n * - 'combined': Show both heatmap background and line overlay\n */\nexport type RetentionDisplayMode = 'heatmap' | 'line' | 'combined'\n\n/**\n * Get color with opacity based on retention rate for heatmap cells\n * Uses a green gradient: higher retention = more saturated green\n */\nfunction getRetentionColor(rate: number): string {\n  const clampedRate = Math.max(0, Math.min(1, rate))\n  const alpha = 0.1 + clampedRate * 0.7\n  return `rgba(34, 197, 94, ${alpha})`\n}\n\n/**\n * Format percentage for display\n */\nfunction formatPercentage(rate: number): string {\n  return `${Math.round(rate * 100)}%`\n}\n\n/**\n * Format period label based on granularity\n * Period 0 shows \"< 1 Day\" / \"< 1 Week\" etc. to indicate the initial cohort\n * e.g., Period 0 with 'week' granularity → \"< 1 Week\", Period 1 → \"Week 1\"\n */\nfunction formatPeriodLabel(period: number, granularity?: RetentionGranularity): string {\n  const prefix = granularity === 'day' ? 'Day'\n    : granularity === 'week' ? 'Week'\n    : granularity === 'month' ? 'Month'\n    : 'P' // Fallback to P0, P1, etc.\n\n  // Period 0 is special - shows \"< 1 Day\" / \"< 1 Week\" etc.\n  if (period === 0) {\n    return granularity ? `< 1 ${prefix}` : 'P0'\n  }\n\n  return granularity ? `${prefix} ${period}` : `P${period}`\n}\n\n/**\n * Get display label for the cohort total column\n * Shows \"Total\" regardless of binding key - it's the cohort size count\n */\nfunction getCohortLabel(_bindingKeyLabel?: string): string {\n  return 'Total'\n}\n\n/**\n * Get default series name based on binding key\n * e.g., \"userId\" → \"userId Retention\", null → \"Retention\"\n */\nfunction getDefaultSeriesName(bindingKeyLabel?: string): string {\n  if (!bindingKeyLabel) return 'Retention'\n  return `${bindingKeyLabel} Retention`\n}\n\n/**\n * Transform retention data for chart display\n * Groups data by period with breakdown values as series\n */\nfunction transformRetentionData(\n  rows: RetentionResultRow[],\n  periods: number[],\n  breakdownValues?: string[],\n  granularity?: RetentionGranularity,\n  bindingKeyLabel?: string\n): { chartData: any[]; seriesKeys: string[]; defaultSeriesName: string } {\n  const defaultSeriesName = getDefaultSeriesName(bindingKeyLabel)\n\n  // If no breakdown, single series\n  if (!breakdownValues || breakdownValues.length === 0) {\n    const chartData = periods.map((period) => {\n      const row = rows.find((r) => r.period === period && !r.breakdownValue)\n      return {\n        period,\n        periodLabel: formatPeriodLabel(period, granularity),\n        [defaultSeriesName]: row ? row.retentionRate : null,\n        cohortSize: row?.cohortSize ?? 0,\n        retainedUsers: row?.retainedUsers ?? 0,\n      }\n    })\n    return { chartData, seriesKeys: [defaultSeriesName], defaultSeriesName }\n  }\n\n  // With breakdown, create series per breakdown value\n  const chartData = periods.map((period) => {\n    const dataPoint: any = {\n      period,\n      periodLabel: formatPeriodLabel(period, granularity),\n    }\n\n    breakdownValues.forEach((bv) => {\n      const row = rows.find((r) => r.period === period && r.breakdownValue === bv)\n      dataPoint[bv] = row ? row.retentionRate : null\n      dataPoint[`${bv}_cohortSize`] = row?.cohortSize ?? 0\n      dataPoint[`${bv}_retainedUsers`] = row?.retainedUsers ?? 0\n    })\n\n    return dataPoint\n  })\n\n  return { chartData, seriesKeys: breakdownValues, defaultSeriesName }\n}\n\ninterface TooltipData {\n  period: number\n  breakdownValue?: string | null\n  cohortSize: number\n  retainedUsers: number\n  retentionRate: number\n  x: number\n  y: number\n}\n\n/**\n * RetentionCombinedChart Component\n */\nconst RetentionCombinedChart = React.memo(function RetentionCombinedChart({\n  data,\n  height = '100%',\n  displayConfig,\n  colorPalette,\n}: ChartProps) {\n  const [hoveredLegend, setHoveredLegend] = useState<string | null>(null)\n  const [heatmapTooltip, setHeatmapTooltip] = useState<TooltipData | null>(null)\n\n  // Parse retention data\n  const retentionData = useMemo<RetentionChartData | null>(() => {\n    if (!data) return null\n\n    // Check if data is already in RetentionChartData format\n    if (isRetentionData(data)) {\n      return data\n    }\n\n    // If data is an array of RetentionResultRow, convert it\n    if (Array.isArray(data) && data.length > 0) {\n      const rows = data as RetentionResultRow[]\n      const periods = [...new Set(rows.map((r) => r.period))].sort((a, b) => a - b)\n      const breakdownValues = [\n        ...new Set(rows.filter((r) => r.breakdownValue).map((r) => r.breakdownValue!)),\n      ]\n\n      return {\n        rows,\n        periods,\n        breakdownValues: breakdownValues.length > 0 ? breakdownValues : undefined,\n      }\n    }\n\n    return null\n  }, [data])\n\n  // Transform data for chart\n  const { chartData, seriesKeys, defaultSeriesName } = useMemo(() => {\n    if (!retentionData) {\n      return { chartData: [], seriesKeys: [], defaultSeriesName: 'Retention' }\n    }\n    return transformRetentionData(\n      retentionData.rows,\n      retentionData.periods,\n      retentionData.breakdownValues,\n      retentionData.granularity,\n      retentionData.bindingKeyLabel\n    )\n  }, [retentionData])\n\n  // Get cohort label for heatmap column header\n  const cohortLabel = getCohortLabel(retentionData?.bindingKeyLabel)\n\n  // Display mode from config\n  const displayMode: RetentionDisplayMode =\n    (displayConfig as any)?.retentionDisplayMode || 'line'\n\n  const showLegend = displayConfig?.showLegend ?? true\n  const showGrid = displayConfig?.showGrid ?? true\n  const showTooltip = displayConfig?.showTooltip ?? true\n\n  // Handle empty/loading states\n  if (!data || (Array.isArray(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            Configure retention analysis to see results\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  if (!chartData || chartData.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\">Unable to render retention data</div>\n          <div className=\"dc:text-xs text-dc-text-secondary\">Data format may be incorrect</div>\n        </div>\n      </div>\n    )\n  }\n\n  // Render line chart component (reused in line and combined modes)\n  const renderLineChart = (chartHeight: string | number) => {\n    const chartMargins = {\n      ...CHART_MARGINS,\n      left: 50,\n      right: 20,\n    }\n\n    return (\n      <ChartContainer height={chartHeight}>\n        <ComposedChart data={chartData} margin={chartMargins} accessibilityLayer={false}>\n          {showGrid && <CartesianGrid strokeDasharray=\"3 3\" />}\n          <XAxis\n            dataKey=\"periodLabel\"\n            tick={{ fontSize: 12 }}\n            axisLine={{ stroke: 'var(--dc-border)' }}\n            tickLine={{ stroke: 'var(--dc-border)' }}\n          />\n          <YAxis\n            domain={[0, 1]}\n            tickFormatter={(value) => formatPercentage(value)}\n            tick={{ fontSize: 12 }}\n            axisLine={{ stroke: 'var(--dc-border)' }}\n            tickLine={{ stroke: 'var(--dc-border)' }}\n            label={{\n              value: 'Retention %',\n              angle: -90,\n              position: 'insideLeft',\n              style: { textAnchor: 'middle', fontSize: '12px', fill: 'var(--dc-text-secondary)' },\n            }}\n          />\n          {showTooltip && (\n            <ChartTooltip\n              formatter={(value: any, name: string) => {\n                if (value === null || value === undefined) {\n                  return ['No data', name]\n                }\n                return [formatPercentage(value), name]\n              }}\n              labelFormatter={(label: string) => label}\n            />\n          )}\n          {showLegend && (\n            <Legend\n              wrapperStyle={{ fontSize: '12px', paddingTop: '10px' }}\n              iconType=\"line\"\n              iconSize={8}\n              layout=\"horizontal\"\n              align=\"center\"\n              verticalAlign=\"bottom\"\n              onMouseEnter={(o) => setHoveredLegend(String(o.dataKey || ''))}\n              onMouseLeave={() => setHoveredLegend(null)}\n            />\n          )}\n\n          {/* Render lines */}\n          {seriesKeys.map((seriesKey, index) => (\n            <Line\n              key={seriesKey}\n              type=\"monotone\"\n              dataKey={seriesKey}\n              stroke={\n                (colorPalette?.colors && colorPalette.colors[index % colorPalette.colors.length]) ||\n                CHART_COLORS[index % CHART_COLORS.length]\n              }\n              strokeWidth={2}\n              dot={{ r: 4, strokeWidth: 2 }}\n              activeDot={{ r: 6 }}\n              strokeOpacity={hoveredLegend ? (hoveredLegend === seriesKey ? 1 : 0.3) : 1}\n              connectNulls={false}\n            />\n          ))}\n        </ComposedChart>\n      </ChartContainer>\n    )\n  }\n\n  // Render heatmap table component (reused in heatmap and combined modes)\n  const renderHeatmapTable = () => (\n    <table className=\"dc:w-full dc:border-collapse dc:text-sm\">\n      <thead className=\"dc:sticky dc:top-0 bg-dc-bg dc:z-10\">\n        <tr>\n          <th className=\"dc:text-left dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:min-w-[100px] dc:whitespace-nowrap\">\n            {retentionData?.breakdownValues?.length ? 'Segment' : 'Cohort'}\n          </th>\n          <th className=\"dc:text-right dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:min-w-[60px] dc:whitespace-nowrap\">\n            {cohortLabel}\n          </th>\n          {retentionData?.periods.map((period) => (\n            <th\n              key={period}\n              className=\"dc:text-center dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:min-w-[70px] dc:whitespace-nowrap\"\n            >\n              {formatPeriodLabel(period, retentionData?.granularity)}\n            </th>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        {seriesKeys.map((seriesKey, rowIndex) => {\n          const period0Data = chartData.find((d) => d.period === 0)\n          const isDefaultSeries = seriesKey === defaultSeriesName\n          const cohortSize = isDefaultSeries\n            ? period0Data?.cohortSize ?? 0\n            : period0Data?.[`${seriesKey}_cohortSize`] ?? 0\n\n          return (\n            <tr\n              key={seriesKey}\n              className={rowIndex % 2 === 0 ? 'bg-dc-bg' : 'bg-dc-surface-secondary'}\n            >\n              <td className=\"dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:whitespace-nowrap\">\n                {seriesKey}\n              </td>\n              <td className=\"dc:p-2 dc:text-right text-dc-text-secondary dc:border-b border-dc-border\">\n                {cohortSize.toLocaleString()}\n              </td>\n              {retentionData?.periods.map((period) => {\n                const dataPoint = chartData.find((d) => d.period === period)\n                const rate = dataPoint?.[seriesKey] ?? 0\n                const bgColor = rate > 0 ? getRetentionColor(rate) : 'transparent'\n                const textColor = rate > 0.5 ? '#ffffff' : 'var(--dc-text)'\n\n                return (\n                  <td\n                    key={period}\n                    className=\"dc:p-2 dc:text-center dc:border-b border-dc-border dc:cursor-default dc:transition-opacity dc:hover:opacity-80\"\n                    style={{ backgroundColor: bgColor, color: textColor }}\n                    onMouseEnter={(e) => {\n                      const rect = e.currentTarget.getBoundingClientRect()\n                      const retainedUsers = isDefaultSeries\n                        ? dataPoint?.retainedUsers ?? 0\n                        : dataPoint?.[`${seriesKey}_retainedUsers`] ?? 0\n                      setHeatmapTooltip({\n                        period,\n                        breakdownValue: isDefaultSeries ? null : seriesKey,\n                        cohortSize,\n                        retainedUsers,\n                        retentionRate: rate,\n                        x: rect.left + rect.width / 2,\n                        y: rect.top,\n                      })\n                    }}\n                    onMouseLeave={() => setHeatmapTooltip(null)}\n                  >\n                    {rate > 0 ? formatPercentage(rate) : '-'}\n                  </td>\n                )\n              })}\n            </tr>\n          )\n        })}\n      </tbody>\n    </table>\n  )\n\n  // Render heatmap tooltip (shared between heatmap and combined modes)\n  const renderHeatmapTooltip = () =>\n    heatmapTooltip && (\n      <div\n        className=\"dc:fixed dc:z-50 dc:px-3 dc:py-2 bg-dc-surface dc:border border-dc-border dc:rounded dc:shadow-lg dc:text-sm dc:pointer-events-none\"\n        style={{\n          left: heatmapTooltip.x,\n          top: heatmapTooltip.y - 10,\n          transform: 'translate(-50%, -100%)',\n        }}\n      >\n        <div className=\"dc:font-medium text-dc-text dc:mb-1\">\n          {heatmapTooltip.breakdownValue\n            ? `${heatmapTooltip.breakdownValue} - ${formatPeriodLabel(heatmapTooltip.period, retentionData?.granularity)}`\n            : formatPeriodLabel(heatmapTooltip.period, retentionData?.granularity)}\n        </div>\n        <div className=\"text-dc-text-secondary dc:space-y-0.5\">\n          <div>Cohort Size: {heatmapTooltip.cohortSize.toLocaleString()}</div>\n          <div>Retained: {heatmapTooltip.retainedUsers.toLocaleString()}</div>\n          <div className=\"dc:font-medium text-dc-text\">\n            Rate: {formatPercentage(heatmapTooltip.retentionRate)}\n          </div>\n        </div>\n      </div>\n    )\n\n  // Render heatmap mode (table-based only)\n  if (displayMode === 'heatmap') {\n    return (\n      <div className=\"dc:relative dc:w-full dc:h-full dc:overflow-auto\" style={{ height }}>\n        {renderHeatmapTable()}\n        {renderHeatmapTooltip()}\n      </div>\n    )\n  }\n\n  // Combined mode: line chart on top, heatmap table below\n  if (displayMode === 'combined') {\n    return (\n      <div className=\"dc:flex dc:flex-col dc:w-full dc:h-full\" style={{ height }}>\n        {/* Line chart - takes remaining space after heatmap */}\n        <div className=\"dc:flex-1 dc:min-h-[200px]\">\n          {renderLineChart('100%')}\n        </div>\n        {/* Heatmap table - auto-height based on content, scrolls if needed */}\n        <div className=\"dc:flex-shrink-0 dc:max-h-[40%] dc:overflow-auto dc:border-t border-dc-border\">\n          {renderHeatmapTable()}\n        </div>\n        {/* Shared heatmap tooltip */}\n        {renderHeatmapTooltip()}\n      </div>\n    )\n  }\n\n  // Line mode: just the line chart\n  return renderLineChart(height)\n})\n\nexport default RetentionCombinedChart\n"],"names":["getRetentionColor","rate","formatPercentage","formatPeriodLabel","period","granularity","prefix","getCohortLabel","_bindingKeyLabel","getDefaultSeriesName","bindingKeyLabel","transformRetentionData","rows","periods","breakdownValues","defaultSeriesName","row","r","dataPoint","bv","RetentionCombinedChart","React","data","height","displayConfig","colorPalette","hoveredLegend","setHoveredLegend","useState","heatmapTooltip","setHeatmapTooltip","retentionData","useMemo","isRetentionData","a","b","chartData","seriesKeys","cohortLabel","displayMode","showLegend","showGrid","showTooltip","jsx","jsxs","renderLineChart","chartHeight","chartMargins","CHART_MARGINS","ChartContainer","ComposedChart","CartesianGrid","XAxis","YAxis","value","ChartTooltip","name","label","Legend","o","seriesKey","index","Line","CHART_COLORS","renderHeatmapTable","rowIndex","period0Data","d","isDefaultSeries","cohortSize","bgColor","textColor","e","rect","retainedUsers","renderHeatmapTooltip"],"mappings":"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"}
+{"version":3,"file":"RetentionCombinedChart-CLq89aOJ.js","sources":["../../../src/client/components/charts/RetentionCombinedChart.tsx"],"sourcesContent":["/**\n * RetentionCombinedChart Component\n *\n * Combined visualization for retention analysis data.\n * Supports multiple display modes: heatmap, line chart, or combined view.\n *\n * Features:\n * - X-axis: Period numbers (P0, P1, P2...)\n * - Y-axis: Retention % (0-100%)\n * - Lines: One per breakdown value (or single if no breakdown)\n * - Display modes: 'heatmap' | 'line' | 'combined'\n * - Heatmap shows color-coded retention matrix\n * - Line chart shows retention curves over periods\n */\n\nimport React, { useMemo, useState } from 'react'\nimport {\n  ComposedChart,\n  Line,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Legend,\n} from 'recharts'\nimport ChartContainer from './ChartContainer'\nimport ChartTooltip from './ChartTooltip'\nimport { CHART_COLORS, CHART_MARGINS } from '../../utils/chartConstants'\nimport type { ChartProps } from '../../types'\nimport type { RetentionChartData, RetentionResultRow, RetentionGranularity } from '../../types/retention'\nimport { isRetentionData } from '../../types/retention'\n\n/**\n * Retention display mode\n * - 'heatmap': Show retention as color-coded bars\n * - 'line': Show retention as line curves\n * - 'combined': Show both heatmap background and line overlay\n */\nexport type RetentionDisplayMode = 'heatmap' | 'line' | 'combined'\n\n/**\n * Get color with opacity based on retention rate for heatmap cells\n * Uses a green gradient: higher retention = more saturated green\n */\nfunction getRetentionColor(rate: number): string {\n  const clampedRate = Math.max(0, Math.min(1, rate))\n  const alpha = 0.1 + clampedRate * 0.7\n  return `rgba(34, 197, 94, ${alpha})`\n}\n\n/**\n * Format percentage for display\n */\nfunction formatPercentage(rate: number): string {\n  return `${Math.round(rate * 100)}%`\n}\n\n/**\n * Format period label based on granularity\n * Period 0 shows \"< 1 Day\" / \"< 1 Week\" etc. to indicate the initial cohort\n * e.g., Period 0 with 'week' granularity → \"< 1 Week\", Period 1 → \"Week 1\"\n */\nfunction formatPeriodLabel(period: number, granularity?: RetentionGranularity): string {\n  const prefix = granularity === 'day' ? 'Day'\n    : granularity === 'week' ? 'Week'\n    : granularity === 'month' ? 'Month'\n    : 'P' // Fallback to P0, P1, etc.\n\n  // Period 0 is special - shows \"< 1 Day\" / \"< 1 Week\" etc.\n  if (period === 0) {\n    return granularity ? `< 1 ${prefix}` : 'P0'\n  }\n\n  return granularity ? `${prefix} ${period}` : `P${period}`\n}\n\n/**\n * Get display label for the cohort total column\n * Shows \"Total\" regardless of binding key - it's the cohort size count\n */\nfunction getCohortLabel(_bindingKeyLabel?: string): string {\n  return 'Total'\n}\n\n/**\n * Get default series name based on binding key\n * e.g., \"userId\" → \"userId Retention\", null → \"Retention\"\n */\nfunction getDefaultSeriesName(bindingKeyLabel?: string): string {\n  if (!bindingKeyLabel) return 'Retention'\n  return `${bindingKeyLabel} Retention`\n}\n\n/**\n * Transform retention data for chart display\n * Groups data by period with breakdown values as series\n */\nfunction transformRetentionData(\n  rows: RetentionResultRow[],\n  periods: number[],\n  breakdownValues?: string[],\n  granularity?: RetentionGranularity,\n  bindingKeyLabel?: string\n): { chartData: any[]; seriesKeys: string[]; defaultSeriesName: string } {\n  const defaultSeriesName = getDefaultSeriesName(bindingKeyLabel)\n\n  // If no breakdown, single series\n  if (!breakdownValues || breakdownValues.length === 0) {\n    const chartData = periods.map((period) => {\n      const row = rows.find((r) => r.period === period && !r.breakdownValue)\n      return {\n        period,\n        periodLabel: formatPeriodLabel(period, granularity),\n        [defaultSeriesName]: row ? row.retentionRate : null,\n        cohortSize: row?.cohortSize ?? 0,\n        retainedUsers: row?.retainedUsers ?? 0,\n      }\n    })\n    return { chartData, seriesKeys: [defaultSeriesName], defaultSeriesName }\n  }\n\n  // With breakdown, create series per breakdown value\n  const chartData = periods.map((period) => {\n    const dataPoint: any = {\n      period,\n      periodLabel: formatPeriodLabel(period, granularity),\n    }\n\n    breakdownValues.forEach((bv) => {\n      const row = rows.find((r) => r.period === period && r.breakdownValue === bv)\n      dataPoint[bv] = row ? row.retentionRate : null\n      dataPoint[`${bv}_cohortSize`] = row?.cohortSize ?? 0\n      dataPoint[`${bv}_retainedUsers`] = row?.retainedUsers ?? 0\n    })\n\n    return dataPoint\n  })\n\n  return { chartData, seriesKeys: breakdownValues, defaultSeriesName }\n}\n\ninterface TooltipData {\n  period: number\n  breakdownValue?: string | null\n  cohortSize: number\n  retainedUsers: number\n  retentionRate: number\n  x: number\n  y: number\n}\n\n/**\n * RetentionCombinedChart Component\n */\nconst RetentionCombinedChart = React.memo(function RetentionCombinedChart({\n  data,\n  height = '100%',\n  displayConfig,\n  colorPalette,\n}: ChartProps) {\n  const [hoveredLegend, setHoveredLegend] = useState<string | null>(null)\n  const [heatmapTooltip, setHeatmapTooltip] = useState<TooltipData | null>(null)\n\n  // Parse retention data\n  const retentionData = useMemo<RetentionChartData | null>(() => {\n    if (!data) return null\n\n    // Check if data is already in RetentionChartData format\n    if (isRetentionData(data)) {\n      return data\n    }\n\n    // If data is an array of RetentionResultRow, convert it\n    if (Array.isArray(data) && data.length > 0) {\n      const rows = data as RetentionResultRow[]\n      const periods = [...new Set(rows.map((r) => r.period))].sort((a, b) => a - b)\n      const breakdownValues = [\n        ...new Set(rows.filter((r) => r.breakdownValue).map((r) => r.breakdownValue!)),\n      ]\n\n      return {\n        rows,\n        periods,\n        breakdownValues: breakdownValues.length > 0 ? breakdownValues : undefined,\n      }\n    }\n\n    return null\n  }, [data])\n\n  // Transform data for chart\n  const { chartData, seriesKeys, defaultSeriesName } = useMemo(() => {\n    if (!retentionData) {\n      return { chartData: [], seriesKeys: [], defaultSeriesName: 'Retention' }\n    }\n    return transformRetentionData(\n      retentionData.rows,\n      retentionData.periods,\n      retentionData.breakdownValues,\n      retentionData.granularity,\n      retentionData.bindingKeyLabel\n    )\n  }, [retentionData])\n\n  // Get cohort label for heatmap column header\n  const cohortLabel = getCohortLabel(retentionData?.bindingKeyLabel)\n\n  // Display mode from config\n  const displayMode: RetentionDisplayMode =\n    (displayConfig as any)?.retentionDisplayMode || 'line'\n\n  const showLegend = displayConfig?.showLegend ?? true\n  const showGrid = displayConfig?.showGrid ?? true\n  const showTooltip = displayConfig?.showTooltip ?? true\n\n  // Handle empty/loading states\n  if (!data || (Array.isArray(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            Configure retention analysis to see results\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  if (!chartData || chartData.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\">Unable to render retention data</div>\n          <div className=\"dc:text-xs text-dc-text-secondary\">Data format may be incorrect</div>\n        </div>\n      </div>\n    )\n  }\n\n  // Render line chart component (reused in line and combined modes)\n  const renderLineChart = (chartHeight: string | number) => {\n    const chartMargins = {\n      ...CHART_MARGINS,\n      left: 50,\n      right: 20,\n    }\n\n    return (\n      <ChartContainer height={chartHeight}>\n        <ComposedChart data={chartData} margin={chartMargins} accessibilityLayer={false}>\n          {showGrid && <CartesianGrid strokeDasharray=\"3 3\" />}\n          <XAxis\n            dataKey=\"periodLabel\"\n            tick={{ fontSize: 12 }}\n            axisLine={{ stroke: 'var(--dc-border)' }}\n            tickLine={{ stroke: 'var(--dc-border)' }}\n          />\n          <YAxis\n            domain={[0, 1]}\n            tickFormatter={(value) => formatPercentage(value)}\n            tick={{ fontSize: 12 }}\n            axisLine={{ stroke: 'var(--dc-border)' }}\n            tickLine={{ stroke: 'var(--dc-border)' }}\n            label={{\n              value: 'Retention %',\n              angle: -90,\n              position: 'insideLeft',\n              style: { textAnchor: 'middle', fontSize: '12px', fill: 'var(--dc-text-secondary)' },\n            }}\n          />\n          {showTooltip && (\n            <ChartTooltip\n              formatter={(value: any, name: string) => {\n                if (value === null || value === undefined) {\n                  return ['No data', name]\n                }\n                return [formatPercentage(value), name]\n              }}\n              labelFormatter={(label: string) => label}\n            />\n          )}\n          {showLegend && (\n            <Legend\n              wrapperStyle={{ fontSize: '12px', paddingTop: '10px' }}\n              iconType=\"line\"\n              iconSize={8}\n              layout=\"horizontal\"\n              align=\"center\"\n              verticalAlign=\"bottom\"\n              onMouseEnter={(o) => setHoveredLegend(String(o.dataKey || ''))}\n              onMouseLeave={() => setHoveredLegend(null)}\n            />\n          )}\n\n          {/* Render lines */}\n          {seriesKeys.map((seriesKey, index) => (\n            <Line\n              key={seriesKey}\n              type=\"monotone\"\n              dataKey={seriesKey}\n              stroke={\n                (colorPalette?.colors && colorPalette.colors[index % colorPalette.colors.length]) ||\n                CHART_COLORS[index % CHART_COLORS.length]\n              }\n              strokeWidth={2}\n              dot={{ r: 4, strokeWidth: 2 }}\n              activeDot={{ r: 6 }}\n              strokeOpacity={hoveredLegend ? (hoveredLegend === seriesKey ? 1 : 0.3) : 1}\n              connectNulls={false}\n            />\n          ))}\n        </ComposedChart>\n      </ChartContainer>\n    )\n  }\n\n  // Render heatmap table component (reused in heatmap and combined modes)\n  const renderHeatmapTable = () => (\n    <table className=\"dc:w-full dc:border-collapse dc:text-sm\">\n      <thead className=\"dc:sticky dc:top-0 bg-dc-bg dc:z-10\">\n        <tr>\n          <th className=\"dc:text-left dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:min-w-[100px] dc:whitespace-nowrap\">\n            {retentionData?.breakdownValues?.length ? 'Segment' : 'Cohort'}\n          </th>\n          <th className=\"dc:text-right dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:min-w-[60px] dc:whitespace-nowrap\">\n            {cohortLabel}\n          </th>\n          {retentionData?.periods.map((period) => (\n            <th\n              key={period}\n              className=\"dc:text-center dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:min-w-[70px] dc:whitespace-nowrap\"\n            >\n              {formatPeriodLabel(period, retentionData?.granularity)}\n            </th>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        {seriesKeys.map((seriesKey, rowIndex) => {\n          const period0Data = chartData.find((d) => d.period === 0)\n          const isDefaultSeries = seriesKey === defaultSeriesName\n          const cohortSize = isDefaultSeries\n            ? period0Data?.cohortSize ?? 0\n            : period0Data?.[`${seriesKey}_cohortSize`] ?? 0\n\n          return (\n            <tr\n              key={seriesKey}\n              className={rowIndex % 2 === 0 ? 'bg-dc-bg' : 'bg-dc-surface-secondary'}\n            >\n              <td className=\"dc:p-2 dc:font-medium text-dc-text dc:border-b border-dc-border dc:whitespace-nowrap\">\n                {seriesKey}\n              </td>\n              <td className=\"dc:p-2 dc:text-right text-dc-text-secondary dc:border-b border-dc-border\">\n                {cohortSize.toLocaleString()}\n              </td>\n              {retentionData?.periods.map((period) => {\n                const dataPoint = chartData.find((d) => d.period === period)\n                const rate = dataPoint?.[seriesKey] ?? 0\n                const bgColor = rate > 0 ? getRetentionColor(rate) : 'transparent'\n                const textColor = rate > 0.5 ? '#ffffff' : 'var(--dc-text)'\n\n                return (\n                  <td\n                    key={period}\n                    className=\"dc:p-2 dc:text-center dc:border-b border-dc-border dc:cursor-default dc:transition-opacity dc:hover:opacity-80\"\n                    style={{ backgroundColor: bgColor, color: textColor }}\n                    onMouseEnter={(e) => {\n                      const rect = e.currentTarget.getBoundingClientRect()\n                      const retainedUsers = isDefaultSeries\n                        ? dataPoint?.retainedUsers ?? 0\n                        : dataPoint?.[`${seriesKey}_retainedUsers`] ?? 0\n                      setHeatmapTooltip({\n                        period,\n                        breakdownValue: isDefaultSeries ? null : seriesKey,\n                        cohortSize,\n                        retainedUsers,\n                        retentionRate: rate,\n                        x: rect.left + rect.width / 2,\n                        y: rect.top,\n                      })\n                    }}\n                    onMouseLeave={() => setHeatmapTooltip(null)}\n                  >\n                    {rate > 0 ? formatPercentage(rate) : '-'}\n                  </td>\n                )\n              })}\n            </tr>\n          )\n        })}\n      </tbody>\n    </table>\n  )\n\n  // Render heatmap tooltip (shared between heatmap and combined modes)\n  const renderHeatmapTooltip = () =>\n    heatmapTooltip && (\n      <div\n        className=\"dc:fixed dc:z-50 dc:px-3 dc:py-2 bg-dc-surface dc:border border-dc-border dc:rounded dc:shadow-lg dc:text-sm dc:pointer-events-none\"\n        style={{\n          left: heatmapTooltip.x,\n          top: heatmapTooltip.y - 10,\n          transform: 'translate(-50%, -100%)',\n        }}\n      >\n        <div className=\"dc:font-medium text-dc-text dc:mb-1\">\n          {heatmapTooltip.breakdownValue\n            ? `${heatmapTooltip.breakdownValue} - ${formatPeriodLabel(heatmapTooltip.period, retentionData?.granularity)}`\n            : formatPeriodLabel(heatmapTooltip.period, retentionData?.granularity)}\n        </div>\n        <div className=\"text-dc-text-secondary dc:space-y-0.5\">\n          <div>Cohort Size: {heatmapTooltip.cohortSize.toLocaleString()}</div>\n          <div>Retained: {heatmapTooltip.retainedUsers.toLocaleString()}</div>\n          <div className=\"dc:font-medium text-dc-text\">\n            Rate: {formatPercentage(heatmapTooltip.retentionRate)}\n          </div>\n        </div>\n      </div>\n    )\n\n  // Render heatmap mode (table-based only)\n  if (displayMode === 'heatmap') {\n    return (\n      <div className=\"dc:relative dc:w-full dc:h-full dc:overflow-auto\" style={{ height }}>\n        {renderHeatmapTable()}\n        {renderHeatmapTooltip()}\n      </div>\n    )\n  }\n\n  // Combined mode: line chart on top, heatmap table below\n  if (displayMode === 'combined') {\n    return (\n      <div className=\"dc:flex dc:flex-col dc:w-full dc:h-full\" style={{ height }}>\n        {/* Line chart - takes remaining space after heatmap */}\n        <div className=\"dc:flex-1 dc:min-h-[200px]\">\n          {renderLineChart('100%')}\n        </div>\n        {/* Heatmap table - auto-height based on content, scrolls if needed */}\n        <div className=\"dc:flex-shrink-0 dc:max-h-[40%] dc:overflow-auto dc:border-t border-dc-border\">\n          {renderHeatmapTable()}\n        </div>\n        {/* Shared heatmap tooltip */}\n        {renderHeatmapTooltip()}\n      </div>\n    )\n  }\n\n  // Line mode: just the line chart\n  return renderLineChart(height)\n})\n\nexport default RetentionCombinedChart\n"],"names":["getRetentionColor","rate","formatPercentage","formatPeriodLabel","period","granularity","prefix","getCohortLabel","_bindingKeyLabel","getDefaultSeriesName","bindingKeyLabel","transformRetentionData","rows","periods","breakdownValues","defaultSeriesName","row","r","dataPoint","bv","RetentionCombinedChart","React","data","height","displayConfig","colorPalette","hoveredLegend","setHoveredLegend","useState","heatmapTooltip","setHeatmapTooltip","retentionData","useMemo","isRetentionData","a","b","chartData","seriesKeys","cohortLabel","displayMode","showLegend","showGrid","showTooltip","jsx","jsxs","renderLineChart","chartHeight","chartMargins","CHART_MARGINS","ChartContainer","ComposedChart","CartesianGrid","XAxis","YAxis","value","ChartTooltip","name","label","Legend","o","seriesKey","index","Line","CHART_COLORS","renderHeatmapTable","rowIndex","period0Data","d","isDefaultSeries","cohortSize","bgColor","textColor","e","rect","retainedUsers","renderHeatmapTooltip"],"mappings":"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"}