drizzle-cube 0.6.6 → 0.7.0

package/dist/client/chunks/{chart-funnel-xeVGBy-p.js → chart-funnel-CkHSXp6h.js}

@@ -1,5 +1,5 @@
-import { n as e } from "./rolldown-runtime-CWhphoD1.js";
-import { P as t, s as n } from "./chart-activity-grid-DDqFVWoa.js";
+import { n as e } from "./rolldown-runtime-DArdT4gl.js";
+import { P as t, s as n } from "./chart-activity-grid-DVOhLgxv.js";
 import r, { useMemo as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 import { Cell as s, Funnel as c, FunnelChart as l, LabelList as u, ResponsiveContainer as d, Tooltip as f } from "recharts";
@@ -406,4 +406,4 @@ var P = /* @__PURE__ */ e({ default: () => F }), F = r.memo(function({ data: e,
 //#endregion
 export { C as a, g as c, _ as i, S as l, P as n, p as o, h as r, m as s, F as t };
 
-//# sourceMappingURL=chart-funnel-xeVGBy-p.js.map
+//# sourceMappingURL=chart-funnel-CkHSXp6h.js.map

package/dist/client/chunks/{chart-funnel-xeVGBy-p.js.map → chart-funnel-CkHSXp6h.js.map}

@@ -1 +1 @@
-{"version":3,"file":"chart-funnel-xeVGBy-p.js","names":[],"sources":["../../../src/client/utils/funnelExecution.ts","../../../src/client/components/charts/FunnelChart.helpers.ts","../../../src/client/components/charts/FunnelViews.tsx","../../../src/client/components/charts/FunnelChart.tsx"],"sourcesContent":["/**\n * Funnel Query Execution Utilities\n *\n * Handles sequential execution of funnel queries where each step\n * filters based on binding key values from the previous step.\n */\n\nimport type { CubeQuery, SimpleFilter } from '../types.js'\n\n/**\n * Default maximum number of binding key values to pass between funnel steps.\n * Limits the size of the IN clause to prevent performance issues.\n */\nexport const DEFAULT_BINDING_KEY_LIMIT = 500\nimport type {\n  FunnelBindingKey,\n  FunnelBindingKeyMapping,\n  FunnelConfig,\n  FunnelStep,\n  FunnelStepResult,\n  FunnelExecutionResult,\n  FunnelChartData,\n} from '../types/funnel.js'\n\n/**\n * Extract the binding key field name for a specific query/cube.\n *\n * For simple binding keys (string), returns the dimension directly.\n * For cross-cube mappings, finds the mapping for the cube used in the query.\n *\n * @param bindingKey - The funnel binding key configuration\n * @param query - The cube query (used to determine which cube is being queried)\n * @returns The binding key field name (e.g., \"Users.userId\")\n */\nexport function getBindingKeyField(\n  bindingKey: FunnelBindingKey,\n  query: CubeQuery\n): string {\n  // Simple case: single dimension name\n  if (typeof bindingKey.dimension === 'string') {\n    return bindingKey.dimension\n  }\n\n  // Cross-cube case: find the mapping for this query's cube\n  const mappings = bindingKey.dimension as FunnelBindingKeyMapping[]\n\n  // Extract cube name from query fields\n  const cubeName = getCubeNameFromQuery(query)\n  if (!cubeName) {\n    // If we can't determine the cube, use the first mapping\n    return mappings[0]?.dimension || ''\n  }\n\n  // Find matching mapping\n  const mapping = mappings.find(m => m.cube === cubeName)\n  if (mapping) {\n    return mapping.dimension\n  }\n\n  // Fallback to first mapping if no match found\n  return mappings[0]?.dimension || ''\n}\n\n/**\n * Extract the cube name from a query by looking at measures/dimensions\n */\nexport function getCubeNameFromQuery(query: CubeQuery): string | null {\n  // Check measures first\n  if (query.measures && query.measures.length > 0) {\n    const parts = query.measures[0].split('.')\n    if (parts.length >= 2) {\n      return parts[0]\n    }\n  }\n\n  // Then check dimensions\n  if (query.dimensions && query.dimensions.length > 0) {\n    const parts = query.dimensions[0].split('.')\n    if (parts.length >= 2) {\n      return parts[0]\n    }\n  }\n\n  // Then check time dimensions\n  if (query.timeDimensions && query.timeDimensions.length > 0) {\n    const parts = query.timeDimensions[0].dimension.split('.')\n    if (parts.length >= 2) {\n      return parts[0]\n    }\n  }\n\n  return null\n}\n\n/**\n * Result from extracting binding key values\n */\nexport interface ExtractedBindingKeyValues {\n  /** Binding key values (limited to max if specified) */\n  values: (string | number)[]\n  /** Total count of unique values before limiting */\n  totalCount: number\n  /** Whether values were truncated due to limit */\n  wasTruncated: boolean\n}\n\n/**\n * Extract unique values for the binding key from query result data\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution is now the default approach.\n *\n * @param data - Raw data from query result\n * @param bindingKeyField - The field name to extract values from\n * @param limit - Maximum number of values to return (default: DEFAULT_BINDING_KEY_LIMIT)\n * @returns Object with values array, total count, and truncation flag\n */\nexport function extractBindingKeyValues(\n  data: unknown[],\n  bindingKeyField: string,\n  limit: number = DEFAULT_BINDING_KEY_LIMIT\n): ExtractedBindingKeyValues {\n  const values = new Set<string | number>()\n\n  for (const row of data) {\n    if (typeof row === 'object' && row !== null) {\n      const value = (row as Record<string, unknown>)[bindingKeyField]\n      if (value !== null && value !== undefined) {\n        // Convert to string or number\n        if (typeof value === 'number') {\n          values.add(value)\n        } else {\n          values.add(String(value))\n        }\n      }\n    }\n  }\n\n  const allValues = Array.from(values)\n  const totalCount = allValues.length\n\n  // Sort values for consistent ordering (enables query cache hits)\n  // Numbers sort numerically, strings sort alphabetically\n  allValues.sort((a, b) => {\n    if (typeof a === 'number' && typeof b === 'number') {\n      return a - b\n    }\n    return String(a).localeCompare(String(b))\n  })\n\n  const limitedValues = limit > 0 ? allValues.slice(0, limit) : allValues\n\n  return {\n    values: limitedValues,\n    totalCount,\n    wasTruncated: limitedValues.length < totalCount,\n  }\n}\n\n/**\n * Build a step query with binding key filter applied.\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution is now the default approach.\n *\n * For the first step (no previous values), returns the original query\n * with the binding key dimension ensured.\n *\n * For subsequent steps, adds an IN filter for the previous step's\n * binding key values.\n *\n * @param step - The funnel step configuration\n * @param bindingKey - The funnel binding key configuration\n * @param previousBindingKeyValues - Binding key values from previous step (null for first step)\n * @returns Modified CubeQuery with binding key filter\n */\nexport function buildStepQuery(\n  step: FunnelStep,\n  bindingKey: FunnelBindingKey,\n  previousBindingKeyValues: (string | number)[] | null\n): CubeQuery {\n  const query: CubeQuery = { ...step.query }\n\n  // Get binding key field for this query\n  const bindingKeyField = getBindingKeyField(bindingKey, query)\n\n  // Ensure binding key dimension is in the query (needed to extract values for next step)\n  if (!query.dimensions?.includes(bindingKeyField)) {\n    query.dimensions = [...(query.dimensions || []), bindingKeyField]\n  }\n\n  // Add IN filter for previous step's binding key values (except for first step)\n  if (previousBindingKeyValues && previousBindingKeyValues.length > 0) {\n    const inFilter: SimpleFilter = {\n      member: bindingKeyField,\n      operator: 'in',\n      values: previousBindingKeyValues,\n    }\n    query.filters = [...(query.filters || []), inFilter]\n  }\n\n  return query\n}\n\n/**\n * Calculate conversion metrics for a step\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution now calculates metrics directly.\n */\nexport function calculateStepMetrics(\n  currentCount: number,\n  previousCount: number | null,\n  firstStepCount: number\n): {\n  conversionRate: number | null\n  cumulativeConversionRate: number\n} {\n  const conversionRate =\n    previousCount !== null && previousCount > 0\n      ? currentCount / previousCount\n      : null\n\n  const cumulativeConversionRate =\n    firstStepCount > 0 ? currentCount / firstStepCount : 1.0\n\n  return { conversionRate, cumulativeConversionRate }\n}\n\n/**\n * Build a funnel step result from query execution\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution now returns results directly.\n */\nexport function buildStepResult(\n  step: FunnelStep,\n  stepIndex: number,\n  data: unknown[],\n  bindingKeyField: string,\n  countUnique: boolean,\n  previousCount: number | null,\n  firstStepCount: number,\n  executionTime: number,\n  error: Error | null = null,\n  bindingKeyLimit: number = DEFAULT_BINDING_KEY_LIMIT\n): FunnelStepResult {\n  // Extract binding key values (with limit applied)\n  const extracted = error\n    ? { values: [], totalCount: 0, wasTruncated: false }\n    : extractBindingKeyValues(data, bindingKeyField, bindingKeyLimit)\n\n  // Calculate count based on total unique values (before truncation)\n  const count = error\n    ? 0\n    : countUnique\n      ? extracted.totalCount\n      : data.length\n\n  // Calculate conversion metrics\n  const { conversionRate, cumulativeConversionRate } = calculateStepMetrics(\n    count,\n    previousCount,\n    firstStepCount || count // Use current count as first step count if this is step 0\n  )\n\n  return {\n    stepIndex,\n    stepName: step.name,\n    stepId: step.id,\n    data,\n    bindingKeyValues: extracted.values,\n    bindingKeyTotalCount: extracted.totalCount,\n    count,\n    conversionRate,\n    cumulativeConversionRate,\n    executionTime,\n    error,\n  }\n}\n\n/**\n * Convert step results to chart-ready data format\n *\n * @deprecated Use transformServerFunnelResult() instead.\n * Server-side funnel execution returns data in a compatible format.\n */\nexport function buildFunnelChartData(\n  stepResults: FunnelStepResult[]\n): FunnelChartData[] {\n  if (stepResults.length === 0) return []\n\n  const firstStepCount = stepResults[0]?.count || 0\n\n  return stepResults.map((result, index) => ({\n    name: result.stepName,\n    value: result.count,\n    percentage: firstStepCount > 0 ? (result.count / firstStepCount) * 100 : 0,\n    conversionRate: result.conversionRate,\n    stepIndex: index,\n  }))\n}\n\n/**\n * Build the complete funnel execution result\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution now builds results directly.\n */\nexport function buildFunnelResult(\n  config: FunnelConfig,\n  stepResults: FunnelStepResult[],\n  status: FunnelExecutionResult['status'],\n  error: Error | null = null,\n  currentStepIndex: number | null = null\n): FunnelExecutionResult {\n  const firstStepCount = stepResults[0]?.count || 0\n  const lastStepCount = stepResults[stepResults.length - 1]?.count || 0\n  const totalExecutionTime = stepResults.reduce((sum, r) => sum + r.executionTime, 0)\n\n  return {\n    config,\n    steps: stepResults,\n    summary: {\n      totalEntries: firstStepCount,\n      totalCompletions: lastStepCount,\n      overallConversionRate: firstStepCount > 0 ? lastStepCount / firstStepCount : 0,\n      totalExecutionTime,\n    },\n    chartData: buildFunnelChartData(stepResults),\n    status,\n    error,\n    currentStepIndex,\n  }\n}\n\n/**\n * Create an empty/initial funnel result\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution manages state differently.\n */\nexport function createEmptyFunnelResult(\n  config: FunnelConfig\n): FunnelExecutionResult {\n  return {\n    config,\n    steps: [],\n    summary: {\n      totalEntries: 0,\n      totalCompletions: 0,\n      overallConversionRate: 0,\n      totalExecutionTime: 0,\n    },\n    chartData: [],\n    status: 'idle',\n    error: null,\n    currentStepIndex: null,\n  }\n}\n\n/**\n * Build a FunnelConfig from multi-query config state.\n * Used to convert AnalysisBuilder state to funnel configuration.\n *\n * @deprecated Use the dedicated funnel mode (analysisType === 'funnel') instead.\n * This function supports backward compatibility with legacy multi-query funnel mode\n * (mergeStrategy === 'funnel'). For new implementations, use the dedicated funnel\n * state in the store which provides better UX with step-based configuration.\n *\n * @param queries - Array of CubeQuery objects (one per step)\n * @param bindingKey - The binding key configuration\n * @param stepLabels - Optional labels for each step\n * @param stepTimeToConvert - Optional time window for each step\n * @returns FunnelConfig ready for execution\n */\nexport function buildFunnelConfigFromQueries(\n  queries: CubeQuery[],\n  bindingKey: FunnelBindingKey,\n  stepLabels?: string[],\n  stepTimeToConvert?: (string | null)[]\n): FunnelConfig {\n  const steps: FunnelStep[] = queries.map((query, index) => ({\n    id: `step-${index}`,\n    name: stepLabels?.[index] || `Step ${index + 1}`,\n    query,\n    timeToConvert: stepTimeToConvert?.[index] || undefined,\n  }))\n\n  return {\n    id: `funnel-${Date.now()}`,\n    name: 'Funnel Analysis',\n    bindingKey,\n    steps,\n    countUnique: true,\n  }\n}\n\n/**\n * Check if funnel execution should stop early\n * (e.g., when no binding key values remain)\n */\nexport function shouldStopFunnelExecution(\n  stepResult: FunnelStepResult\n): boolean {\n  return stepResult.bindingKeyValues.length === 0 || stepResult.error !== null\n}\n\n/**\n * Metadata fields injected into funnel result data\n * (for compatibility with existing chart/table components)\n */\nexport interface FunnelMetadata {\n  __stepIndex: number\n  __stepName: string\n  __stepId: string\n  __conversionRate: number | null\n  __cumulativeRate: number\n}\n\n/**\n * Check if data contains funnel metadata\n */\nexport function isFunnelData(data: unknown[]): boolean {\n  return (\n    data.length > 0 &&\n    typeof data[0] === 'object' &&\n    data[0] !== null &&\n    '__stepIndex' in data[0]\n  )\n}\n\n// =============================================================================\n// Server-Side Funnel Support\n// =============================================================================\n\n/**\n * Server-side funnel step definition (for FunnelQueryConfig)\n */\nexport interface ServerFunnelStep {\n  name: string\n  filter?: SimpleFilter | SimpleFilter[]\n  timeToConvert?: string\n}\n\n/**\n * Server-side funnel query configuration\n */\nexport interface ServerFunnelQueryConfig {\n  bindingKey: string | FunnelBindingKeyMapping[]\n  timeDimension: string | Array<{ cube: string; dimension: string }>\n  steps: ServerFunnelStep[]\n  includeTimeMetrics?: boolean\n  globalTimeWindow?: string\n}\n\n/**\n * Server-side funnel result row\n */\nexport interface ServerFunnelResultRow {\n  step: string\n  stepIndex: number\n  count: number\n  conversionRate: number | null\n  cumulativeConversionRate: number\n  avgSecondsToConvert?: number | null\n  medianSecondsToConvert?: number | null\n  p90SecondsToConvert?: number | null\n  minSecondsToConvert?: number | null\n  maxSecondsToConvert?: number | null\n}\n\n/**\n * Query shape for server-side funnel execution\n */\nexport interface ServerFunnelQuery {\n  funnel: ServerFunnelQueryConfig\n}\n\n/**\n * Build a server-side funnel query from client state.\n *\n * Transforms the client-side FunnelConfig format into a SemanticQuery\n * with `funnel` property that the server can execute.\n *\n * @param queries - Array of CubeQuery objects (one per step)\n * @param bindingKey - The binding key configuration\n * @param stepLabels - Optional labels for each step\n * @param stepTimeToConvert - Optional time window for each step (ISO 8601 duration)\n * @param includeTimeMetrics - Whether to include time-to-convert metrics\n * @returns Query object with funnel configuration for server execution\n */\nexport function buildServerFunnelQuery(\n  queries: CubeQuery[],\n  bindingKey: FunnelBindingKey,\n  stepLabels?: string[],\n  stepTimeToConvert?: (string | null)[],\n  includeTimeMetrics: boolean = true\n): ServerFunnelQuery {\n  // 1. Unwrap binding key from client format (client wraps in { dimension: ... })\n  const serverBindingKey = bindingKey.dimension\n\n  // 2. Extract time dimension from queries\n  const timeDimension = extractTimeDimensionFromQueries(queries, bindingKey)\n\n  // 3. Convert each CubeQuery to a server FunnelStep\n  const steps: ServerFunnelStep[] = queries.map((query, index) => {\n    const step: ServerFunnelStep = {\n      name: stepLabels?.[index] || `Step ${index + 1}`,\n    }\n\n    // Extract filters from query\n    const filter = extractFiltersFromQuery(query)\n    if (filter) {\n      step.filter = filter\n    }\n\n    // Add time-to-convert constraint if specified\n    const timeConstraint = stepTimeToConvert?.[index]\n    if (timeConstraint) {\n      step.timeToConvert = timeConstraint\n    }\n\n    return step\n  })\n\n  return {\n    funnel: {\n      bindingKey: serverBindingKey,\n      timeDimension,\n      steps,\n      includeTimeMetrics,\n    },\n  }\n}\n\n/**\n * Extract time dimension from queries.\n *\n * For single-cube funnels, returns the first time dimension found.\n * For cross-cube funnels (with binding key mappings), builds a mapping array.\n *\n * @param queries - Array of CubeQuery objects\n * @param bindingKey - The binding key configuration (to detect cross-cube)\n * @returns Time dimension string or mapping array\n */\nfunction extractTimeDimensionFromQueries(\n  queries: CubeQuery[],\n  bindingKey: FunnelBindingKey\n): string | Array<{ cube: string; dimension: string }> {\n  // Check if this is a cross-cube funnel\n  if (Array.isArray(bindingKey.dimension)) {\n    return extractCrossCubeTimeDimensions(queries, bindingKey.dimension as FunnelBindingKeyMapping[])\n  }\n  return extractSingleCubeTimeDimension(queries)\n}\n\n/**\n * Single-cube: return the first explicit time dimension, falling back to the\n * common `<cube>.createdAt` convention.\n */\nfunction extractSingleCubeTimeDimension(queries: CubeQuery[]): string {\n  for (const query of queries) {\n    if (query.timeDimensions?.length) {\n      return query.timeDimensions[0].dimension\n    }\n  }\n  // Fallback: try to infer from measures/dimensions\n  const cubeName = getCubeNameFromQuery(queries[0])\n  if (cubeName) {\n    return `${cubeName}.createdAt` // Common convention\n  }\n  throw new Error('Funnel requires at least one time dimension in step queries')\n}\n\n/**\n * Cross-cube: build a time-dimension mapping per cube, falling back to the\n * common `<cube>.createdAt` convention when none is present.\n */\nfunction extractCrossCubeTimeDimensions(\n  queries: CubeQuery[],\n  bindingMappings: FunnelBindingKeyMapping[]\n): Array<{ cube: string; dimension: string }> {\n  return bindingMappings.map(mapping => {\n    const cubeQuery = queries.find(q => getCubeNameFromQuery(q) === mapping.cube)\n    const dimension = cubeQuery?.timeDimensions?.length\n      ? cubeQuery.timeDimensions[0].dimension\n      : `${mapping.cube}.createdAt` // Fallback to common convention\n    return { cube: mapping.cube, dimension }\n  })\n}\n\n/**\n * Extract filters from a CubeQuery for server funnel step.\n *\n * @param query - The CubeQuery\n * @returns Filter or array of filters, or undefined if no filters\n */\nfunction extractFiltersFromQuery(query: CubeQuery): SimpleFilter | SimpleFilter[] | undefined {\n  if (!query.filters?.length) {\n    return undefined\n  }\n\n  // Filter out any binding key filters (server handles those)\n  const filters = query.filters.filter(f => {\n    // Keep only SimpleFilter with member (not grouped filters for now)\n    if ('member' in f) {\n      return true\n    }\n    return false\n  }) as SimpleFilter[]\n\n  if (filters.length === 0) {\n    return undefined\n  }\n\n  if (filters.length === 1) {\n    return filters[0]\n  }\n\n  return filters\n}\n\n/**\n * Transform server funnel result rows to client FunnelChartData format.\n *\n * Maps the server's FunnelResultRow[] to the client's FunnelChartData[]\n * format expected by FunnelChart component.\n *\n * @param serverResult - Raw data from server (FunnelResultRow[])\n * @param stepNames - Optional step names to override server names\n * @returns FunnelChartData[] ready for FunnelChart component\n */\nexport function transformServerFunnelResult(\n  serverResult: unknown[],\n  stepNames?: string[]\n): FunnelChartData[] {\n  if (!serverResult?.length) {\n    return []\n  }\n\n  const rows = serverResult as ServerFunnelResultRow[]\n\n  return rows.map((row, index) => ({\n    // Map server fields to client format\n    name: stepNames?.[index] || row.step,\n    value: row.count,\n    // Convert cumulative rate to percentage\n    percentage: row.cumulativeConversionRate * 100,\n    // Convert step-to-step rate to percentage (null for first step)\n    conversionRate: row.conversionRate !== null ? row.conversionRate * 100 : null,\n    stepIndex: row.stepIndex,\n    // Include time metrics for optional display\n    avgSecondsToConvert: row.avgSecondsToConvert,\n    medianSecondsToConvert: row.medianSecondsToConvert,\n    p90SecondsToConvert: row.p90SecondsToConvert,\n  }))\n}\n\n/**\n * Format a duration in seconds to a human-readable string.\n *\n * @param seconds - Duration in seconds\n * @returns Formatted string (e.g., \"45s\", \"2.5m\", \"1.3h\", \"3.2d\")\n */\nexport function formatDuration(seconds: number | null | undefined): string {\n  if (seconds === null || seconds === undefined) {\n    return '-'\n  }\n\n  if (seconds < 60) {\n    return `${Math.round(seconds)}s`\n  }\n\n  if (seconds < 3600) {\n    const minutes = seconds / 60\n    return minutes < 10 ? `${minutes.toFixed(1)}m` : `${Math.round(minutes)}m`\n  }\n\n  if (seconds < 86400) {\n    const hours = seconds / 3600\n    return hours < 10 ? `${hours.toFixed(1)}h` : `${Math.round(hours)}h`\n  }\n\n  const days = seconds / 86400\n  return days < 10 ? `${days.toFixed(1)}d` : `${Math.round(days)}d`\n}\n","/**\n * Co-located helpers for FunnelChart.\n *\n * Pure data-shaping + display-option resolution extracted from the component.\n * No behaviour change — mirrors the original inline logic exactly.\n */\nimport type { ChartDisplayConfig } from '../../types.js'\nimport type { FunnelChartData } from '../../types/funnel.js'\nimport { formatDuration } from '../../utils/funnelExecution.js'\n\n/** Check if data is already in funnel data format. */\nexport function isFunnelData(data: unknown[]): data is FunnelChartData[] {\n  if (!data || data.length === 0) return false\n  const first = data[0]\n  return (\n    typeof first === 'object' &&\n    first !== null &&\n    'name' in first &&\n    'value' in first &&\n    'percentage' in first\n  )\n}\n\n/**\n * Render time metrics based on config options - returns array of lines for\n * vertical stacking.\n */\nexport function getTimeMetricsLines(\n  step: FunnelChartData,\n  showAvg: boolean,\n  showMedian: boolean,\n  showP90: boolean\n): string[] {\n  const lines: string[] = []\n  if (showAvg && step.avgSecondsToConvert != null) {\n    lines.push(`Avg: ${formatDuration(step.avgSecondsToConvert)}`)\n  }\n  if (showMedian && step.medianSecondsToConvert != null) {\n    lines.push(`Med: ${formatDuration(step.medianSecondsToConvert)}`)\n  }\n  if (showP90 && step.p90SecondsToConvert != null) {\n    lines.push(`P90: ${formatDuration(step.p90SecondsToConvert)}`)\n  }\n  return lines\n}\n\n/** Coerce arbitrary query rows into FunnelChartData by probing field names. */\nexport function toFunnelData(data: unknown[]): FunnelChartData[] {\n  if (!data || data.length === 0) return []\n  if (isFunnelData(data)) return data\n\n  return data.map((row, index) => {\n    const record = row as Record<string, unknown>\n\n    const nameField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('step') || k.toLowerCase().includes('name') || k === '__stepName'\n    )\n    const name = nameField ? String(record[nameField]) : `Step ${index + 1}`\n\n    const valueField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('count') || k.toLowerCase().includes('value') || k === '__count'\n    )\n    const value = valueField ? Number(record[valueField]) || 0 : 0\n\n    const percentField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('percent') || k === '__percentage'\n    )\n    const percentage = percentField ? Number(record[percentField]) || 0 : 0\n\n    const convRateField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('conversion') || k === '__conversionRate'\n    )\n    const conversionRate = convRateField ? Number(record[convRateField]) || null : null\n\n    return { name, value, percentage, conversionRate, stepIndex: index }\n  })\n}\n\nexport interface FunnelDisplayOptions {\n  customStepLabels?: string[]\n  isVertical: boolean\n  funnelStyle: NonNullable<ChartDisplayConfig['funnelStyle']>\n  showConversion: boolean\n  showAvgTime: boolean\n  showMedianTime: boolean\n  showP90Time: boolean\n  hideSummaryFooter: boolean\n}\n\n/** Resolve every funnel display option (with backward-compat for time metrics). */\nexport function resolveFunnelDisplayOptions(\n  displayConfig: ChartDisplayConfig | undefined\n): FunnelDisplayOptions {\n  return {\n    customStepLabels: displayConfig?.funnelStepLabels,\n    isVertical: (displayConfig?.funnelOrientation || 'horizontal') === 'vertical',\n    funnelStyle: displayConfig?.funnelStyle ?? 'bars',\n    showConversion: displayConfig?.showFunnelConversion ?? true,\n    // Time metrics - individual toggles with backward compat for showFunnelTimeMetrics\n    showAvgTime: displayConfig?.showFunnelAvgTime ?? (displayConfig?.showFunnelTimeMetrics ?? false),\n    showMedianTime: displayConfig?.showFunnelMedianTime ?? false,\n    showP90Time: displayConfig?.showFunnelP90Time ?? false,\n    hideSummaryFooter: displayConfig?.hideSummaryFooter ?? false\n  }\n}\n\n/** Color for a funnel step (cyclic over the palette or the default funnel gradient). */\nexport function getStepColor(index: number, colorPalette: string[]): string {\n  return colorPalette[index % colorPalette.length]\n}\n","import { FunnelChart as RechartsFunnelChart, Funnel, LabelList, Tooltip, Cell, ResponsiveContainer } from 'recharts'\nimport { useTranslation } from '../../hooks/useTranslation.js'\nimport type { FunnelChartData } from '../../types/funnel.js'\nimport { getStepColor, getTimeMetricsLines, type FunnelDisplayOptions } from './FunnelChart.helpers.js'\n\ninterface FunnelViewProps {\n  funnelData: FunnelChartData[]\n  firstStepValue: number\n  paletteColors: string[]\n  options: FunnelDisplayOptions\n  height: string | number\n}\n\n/** Shared summary footer (steps count, overall conversion, completed ratio). */\nfunction FunnelSummaryFooter({\n  funnelData,\n  firstStepValue\n}: {\n  funnelData: FunnelChartData[]\n  firstStepValue: number\n}) {\n  const { t } = useTranslation()\n  const lastValue = funnelData[funnelData.length - 1]?.value || 0\n  return (\n    <div className=\"dc:flex-shrink-0 dc:px-4 dc:py-2 dc:border-t border-dc-border bg-dc-surface-secondary\">\n      <div className=\"dc:flex dc:items-center dc:justify-between dc:text-sm\">\n        <div className=\"text-dc-text-muted\">\n          <span className=\"dc:font-medium\">{funnelData.length}</span> steps\n        </div>\n        <div className=\"text-dc-text\">\n          <span className=\"text-dc-text-muted\">{t('chart.runtime.funnel.overall')}</span>{' '}\n          <span className=\"dc:font-medium\">\n            {firstStepValue > 0 ? `${(lastValue / firstStepValue * 100).toFixed(1)}%` : '0%'}\n          </span>\n        </div>\n        <div className=\"text-dc-text-muted\">\n          {lastValue.toLocaleString() || 0} / {firstStepValue.toLocaleString()} completed\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/** Per-step conversion + time-metrics block (shared by vertical/horizontal views). */\nfunction StepMetrics({\n  stepConversionRate,\n  arrow,\n  showConversion,\n  timeMetricsLines\n}: {\n  stepConversionRate: number | null\n  arrow: string\n  showConversion: boolean\n  timeMetricsLines: string[]\n}) {\n  if (stepConversionRate === null) {\n    return <div className=\"dc:text-xs text-dc-text-muted\">—</div>\n  }\n  return (\n    <div className=\"dc:text-xs text-dc-text-secondary\">\n      {showConversion && <span>{arrow} {stepConversionRate.toFixed(1)}%</span>}\n      {timeMetricsLines.length > 0 && (\n        <div className=\"text-dc-text-muted dc:mt-0.5 dc:space-y-0.5\">\n          {timeMetricsLines.map((line, i) => (\n            <div key={i}>⏱ {line}</div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\n/** Recharts trapezoid funnel style. */\nexport function FunnelShapeView({ funnelData, firstStepValue, paletteColors, options, height }: FunnelViewProps) {\n  // Recharts FunnelChart layout: 'horizontal' = funnel flows left-to-right,\n  // 'vertical' = top-to-bottom (default). Our 'vertical' orientation maps to\n  // a left-to-right Recharts funnel.\n  const rechartsLayout: 'horizontal' | 'vertical' = options.isVertical ? 'horizontal' : 'vertical'\n\n  return (\n    <div className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      <div className=\"dc:flex-1\">\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <RechartsFunnelChart layout={rechartsLayout} accessibilityLayer={false}>\n            <Tooltip\n              formatter={(value) => typeof value === 'number' ? value.toLocaleString() : String(value)}\n              contentStyle={{\n                backgroundColor: 'var(--dc-surface)',\n                border: '1px solid var(--dc-border)',\n                borderRadius: '4px',\n              }}\n            />\n            <Funnel dataKey=\"value\" nameKey=\"name\" data={funnelData} isAnimationActive>\n              {funnelData.map((_, index) => (\n                <Cell key={`cell-${index}`} fill={getStepColor(index, paletteColors)} />\n              ))}\n              <LabelList position=\"right\" dataKey=\"name\" fill=\"var(--dc-text)\" style={{ fontSize: '12px' }} />\n              <LabelList\n                position=\"center\"\n                dataKey=\"percentage\"\n                formatter={(v) => typeof v === 'number' ? `${v.toFixed(1)}%` : String(v)}\n                fill=\"#fff\"\n                style={{ fontSize: '11px', fontWeight: 500 }}\n              />\n            </Funnel>\n          </RechartsFunnelChart>\n        </ResponsiveContainer>\n      </div>\n      {!options.hideSummaryFooter && (\n        <FunnelSummaryFooter funnelData={funnelData} firstStepValue={firstStepValue} />\n      )}\n    </div>\n  )\n}\n\n/** Vertical bars (steps laid out horizontally, bars grow bottom-to-top). */\nexport function FunnelVerticalView({ funnelData, firstStepValue, paletteColors, options, height }: FunnelViewProps) {\n  return (\n    <div className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      <div className=\"dc:flex-1 dc:flex dc:items-end dc:justify-center dc:gap-4 dc:px-4 dc:py-3 dc:overflow-hidden\">\n        {funnelData.map((step, index) => {\n          const heightPercent = firstStepValue > 0 ? (step.value / firstStepValue) * 100 : 0\n          const prevStep = index > 0 ? funnelData[index - 1] : null\n          const stepConversionRate = prevStep && prevStep.value > 0 ? (step.value / prevStep.value) * 100 : null\n          const displayName = options.customStepLabels?.[index] || step.name\n          const timeMetricsLines = getTimeMetricsLines(step, options.showAvgTime, options.showMedianTime, options.showP90Time)\n          const metricsCount = timeMetricsLines.length\n\n          return (\n            <div key={step.name} className=\"dc:flex dc:flex-col dc:items-center dc:gap-2 dc:flex-1 dc:max-w-32 dc:h-full\">\n              <div className={`${metricsCount > 0 ? (metricsCount > 1 ? 'dc:min-h-16' : 'dc:min-h-10') : 'dc:h-5'} dc:flex-shrink-0 dc:text-center`}>\n                <StepMetrics\n                  stepConversionRate={stepConversionRate}\n                  arrow=\"→\"\n                  showConversion={options.showConversion}\n                  timeMetricsLines={timeMetricsLines}\n                />\n              </div>\n\n              <div className=\"dc:flex-1 dc:w-full dc:relative dc:min-h-12\">\n                <div className=\"dc:absolute dc:inset-0 bg-dc-surface-secondary dc:rounded-sm\" />\n                <div\n                  className=\"dc:absolute dc:bottom-0 dc:left-0 dc:right-0 dc:rounded-sm dc:transition-all dc:duration-300\"\n                  style={{ height: `${Math.max(heightPercent, 5)}%`, backgroundColor: getStepColor(index, paletteColors) }}\n                />\n                <div\n                  className=\"dc:absolute dc:bottom-0 dc:left-0 dc:right-0 dc:flex dc:items-end dc:justify-center dc:pb-1 dc:pointer-events-none\"\n                  style={{ height: `${Math.max(heightPercent, 20)}%` }}\n                >\n                  <span className=\"dc:text-xs dc:font-medium text-white dc:drop-shadow-sm\">\n                    {step.percentage?.toFixed(1) ?? heightPercent.toFixed(1)}%\n                  </span>\n                </div>\n              </div>\n\n              <div className=\"dc:flex-shrink-0 dc:text-center\">\n                <div className=\"dc:text-sm dc:font-medium text-dc-text dc:truncate\" title={displayName}>\n                  {displayName}\n                </div>\n                <div className=\"dc:text-xs text-dc-text-muted\">\n                  {step.value.toLocaleString()}\n                </div>\n              </div>\n            </div>\n          )\n        })}\n      </div>\n\n      {!options.hideSummaryFooter && (\n        <FunnelSummaryFooter funnelData={funnelData} firstStepValue={firstStepValue} />\n      )}\n    </div>\n  )\n}\n\n/** Horizontal bars (default - steps stacked vertically, bars grow left-to-right). */\nexport function FunnelHorizontalView({ funnelData, firstStepValue, paletteColors, options, height }: FunnelViewProps) {\n  return (\n    <div className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      <div className=\"dc:flex-1 dc:flex dc:flex-col dc:justify-center dc:gap-2 dc:px-4 dc:py-3 dc:overflow-hidden\">\n        {funnelData.map((step, index) => {\n          const widthPercent = firstStepValue > 0 ? (step.value / firstStepValue) * 100 : 0\n          const prevStep = index > 0 ? funnelData[index - 1] : null\n          const stepConversionRate = prevStep && prevStep.value > 0 ? (step.value / prevStep.value) * 100 : null\n          const displayName = options.customStepLabels?.[index] || step.name\n          const timeMetricsLines = getTimeMetricsLines(step, options.showAvgTime, options.showMedianTime, options.showP90Time)\n          const metricsCount = timeMetricsLines.length\n\n          return (\n            <div key={step.name} className=\"dc:flex dc:items-center dc:gap-3\">\n              <div className=\"dc:w-24 dc:flex-shrink-0 dc:text-right\">\n                <div className=\"dc:text-sm dc:font-medium text-dc-text dc:truncate\" title={displayName}>\n                  {displayName}\n                </div>\n                <div className=\"dc:text-xs text-dc-text-muted\">\n                  {step.value.toLocaleString()}\n                </div>\n              </div>\n\n              <div className=\"dc:flex-1 dc:relative\">\n                <div className=\"dc:w-full dc:h-8 bg-dc-surface-secondary dc:rounded-sm\" />\n                <div\n                  className=\"dc:absolute dc:top-0 dc:left-0 dc:h-8 dc:rounded-sm dc:transition-all dc:duration-300\"\n                  style={{ width: `${Math.max(widthPercent, 2)}%`, backgroundColor: getStepColor(index, paletteColors) }}\n                />\n                <div\n                  className=\"dc:absolute dc:top-0 dc:left-0 dc:h-8 dc:flex dc:items-center dc:px-2 dc:pointer-events-none\"\n                  style={{ width: `${Math.max(widthPercent, 20)}%` }}\n                >\n                  <span className=\"dc:text-xs dc:font-medium text-white dc:drop-shadow-sm\">\n                    {step.percentage?.toFixed(1) ?? widthPercent.toFixed(1)}%\n                  </span>\n                </div>\n              </div>\n\n              <div className={`${metricsCount > 0 ? (metricsCount > 1 ? 'dc:w-36' : 'dc:w-28') : 'dc:w-16'} dc:flex-shrink-0 dc:text-left`}>\n                <StepMetrics\n                  stepConversionRate={stepConversionRate}\n                  arrow=\"↓\"\n                  showConversion={options.showConversion}\n                  timeMetricsLines={timeMetricsLines}\n                />\n              </div>\n            </div>\n          )\n        })}\n      </div>\n\n      {!options.hideSummaryFooter && (\n        <FunnelSummaryFooter funnelData={funnelData} firstStepValue={firstStepValue} />\n      )}\n    </div>\n  )\n}\n","/**\n * FunnelChart Component\n *\n * Visualizes funnel data showing conversion rates between steps.\n * Uses horizontal bars with percentage widths to represent the funnel shape.\n * Works with data from useFunnelQuery hook which provides FunnelChartData.\n *\n * When displayConfig.showFunnelTimeMetrics is enabled, displays time-to-convert\n * metrics from server-side funnel execution (avg, median, P90 seconds).\n */\n\nimport React, { useMemo } from 'react'\nimport { useTranslation } from '../../hooks/useTranslation.js'\nimport { CHART_COLORS } from '../../utils/chartConstants.js'\nimport type { ChartProps } from '../../types.js'\nimport type { FunnelChartData } from '../../types/funnel.js'\nimport { toFunnelData, resolveFunnelDisplayOptions } from './FunnelChart.helpers.js'\nimport { FunnelShapeView, FunnelVerticalView, FunnelHorizontalView } from './FunnelViews.js'\n\n/**\n * FunnelChart Component\n *\n * Renders a funnel visualization from FunnelChartData array.\n * Shows each step as a horizontal bar with width proportional to count.\n * Displays conversion rates between steps.\n */\nconst FunnelChart = React.memo(function FunnelChart({\n  data,\n  height = '100%',\n  colorPalette,\n  displayConfig,\n}: ChartProps) {\n  const { t } = useTranslation()\n  const options = resolveFunnelDisplayOptions(displayConfig)\n\n  // Transform data if needed\n  const funnelData = useMemo<FunnelChartData[]>(() => toFunnelData(data), [data])\n\n  // Calculate first step value for percentage calculations\n  const firstStepValue = funnelData[0]?.value || 0\n\n  // Handle no data\n  if (!data || data.length === 0 || funnelData.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\">{t('chart.runtime.funnel.noData')}</div>\n          <div className=\"dc:text-xs text-dc-text-secondary\">\n            {t('chart.runtime.noDataHint.funnel')}\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  const paletteColors = colorPalette?.colors || CHART_COLORS\n  const viewProps = { funnelData, firstStepValue, paletteColors, options, height }\n\n  if (options.funnelStyle === 'funnel') {\n    return <FunnelShapeView {...viewProps} />\n  }\n\n  if (options.isVertical) {\n    return <FunnelVerticalView {...viewProps} />\n  }\n\n  return <FunnelHorizontalView {...viewProps} />\n})\n\nexport default FunnelChart\n"],"mappings":"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"}
+{"version":3,"file":"chart-funnel-CkHSXp6h.js","names":[],"sources":["../../../src/client/utils/funnelExecution.ts","../../../src/client/components/charts/FunnelChart.helpers.ts","../../../src/client/components/charts/FunnelViews.tsx","../../../src/client/components/charts/FunnelChart.tsx"],"sourcesContent":["/**\n * Funnel Query Execution Utilities\n *\n * Handles sequential execution of funnel queries where each step\n * filters based on binding key values from the previous step.\n */\n\nimport type { CubeQuery, SimpleFilter } from '../types.js'\n\n/**\n * Default maximum number of binding key values to pass between funnel steps.\n * Limits the size of the IN clause to prevent performance issues.\n */\nexport const DEFAULT_BINDING_KEY_LIMIT = 500\nimport type {\n  FunnelBindingKey,\n  FunnelBindingKeyMapping,\n  FunnelConfig,\n  FunnelStep,\n  FunnelStepResult,\n  FunnelExecutionResult,\n  FunnelChartData,\n} from '../types/funnel.js'\n\n/**\n * Extract the binding key field name for a specific query/cube.\n *\n * For simple binding keys (string), returns the dimension directly.\n * For cross-cube mappings, finds the mapping for the cube used in the query.\n *\n * @param bindingKey - The funnel binding key configuration\n * @param query - The cube query (used to determine which cube is being queried)\n * @returns The binding key field name (e.g., \"Users.userId\")\n */\nexport function getBindingKeyField(\n  bindingKey: FunnelBindingKey,\n  query: CubeQuery\n): string {\n  // Simple case: single dimension name\n  if (typeof bindingKey.dimension === 'string') {\n    return bindingKey.dimension\n  }\n\n  // Cross-cube case: find the mapping for this query's cube\n  const mappings = bindingKey.dimension as FunnelBindingKeyMapping[]\n\n  // Extract cube name from query fields\n  const cubeName = getCubeNameFromQuery(query)\n  if (!cubeName) {\n    // If we can't determine the cube, use the first mapping\n    return mappings[0]?.dimension || ''\n  }\n\n  // Find matching mapping\n  const mapping = mappings.find(m => m.cube === cubeName)\n  if (mapping) {\n    return mapping.dimension\n  }\n\n  // Fallback to first mapping if no match found\n  return mappings[0]?.dimension || ''\n}\n\n/**\n * Extract the cube name from a query by looking at measures/dimensions\n */\nexport function getCubeNameFromQuery(query: CubeQuery): string | null {\n  // Check measures first\n  if (query.measures && query.measures.length > 0) {\n    const parts = query.measures[0].split('.')\n    if (parts.length >= 2) {\n      return parts[0]\n    }\n  }\n\n  // Then check dimensions\n  if (query.dimensions && query.dimensions.length > 0) {\n    const parts = query.dimensions[0].split('.')\n    if (parts.length >= 2) {\n      return parts[0]\n    }\n  }\n\n  // Then check time dimensions\n  if (query.timeDimensions && query.timeDimensions.length > 0) {\n    const parts = query.timeDimensions[0].dimension.split('.')\n    if (parts.length >= 2) {\n      return parts[0]\n    }\n  }\n\n  return null\n}\n\n/**\n * Result from extracting binding key values\n */\nexport interface ExtractedBindingKeyValues {\n  /** Binding key values (limited to max if specified) */\n  values: (string | number)[]\n  /** Total count of unique values before limiting */\n  totalCount: number\n  /** Whether values were truncated due to limit */\n  wasTruncated: boolean\n}\n\n/**\n * Extract unique values for the binding key from query result data\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution is now the default approach.\n *\n * @param data - Raw data from query result\n * @param bindingKeyField - The field name to extract values from\n * @param limit - Maximum number of values to return (default: DEFAULT_BINDING_KEY_LIMIT)\n * @returns Object with values array, total count, and truncation flag\n */\nexport function extractBindingKeyValues(\n  data: unknown[],\n  bindingKeyField: string,\n  limit: number = DEFAULT_BINDING_KEY_LIMIT\n): ExtractedBindingKeyValues {\n  const values = new Set<string | number>()\n\n  for (const row of data) {\n    if (typeof row === 'object' && row !== null) {\n      const value = (row as Record<string, unknown>)[bindingKeyField]\n      if (value !== null && value !== undefined) {\n        // Convert to string or number\n        if (typeof value === 'number') {\n          values.add(value)\n        } else {\n          values.add(String(value))\n        }\n      }\n    }\n  }\n\n  const allValues = Array.from(values)\n  const totalCount = allValues.length\n\n  // Sort values for consistent ordering (enables query cache hits)\n  // Numbers sort numerically, strings sort alphabetically\n  allValues.sort((a, b) => {\n    if (typeof a === 'number' && typeof b === 'number') {\n      return a - b\n    }\n    return String(a).localeCompare(String(b))\n  })\n\n  const limitedValues = limit > 0 ? allValues.slice(0, limit) : allValues\n\n  return {\n    values: limitedValues,\n    totalCount,\n    wasTruncated: limitedValues.length < totalCount,\n  }\n}\n\n/**\n * Build a step query with binding key filter applied.\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution is now the default approach.\n *\n * For the first step (no previous values), returns the original query\n * with the binding key dimension ensured.\n *\n * For subsequent steps, adds an IN filter for the previous step's\n * binding key values.\n *\n * @param step - The funnel step configuration\n * @param bindingKey - The funnel binding key configuration\n * @param previousBindingKeyValues - Binding key values from previous step (null for first step)\n * @returns Modified CubeQuery with binding key filter\n */\nexport function buildStepQuery(\n  step: FunnelStep,\n  bindingKey: FunnelBindingKey,\n  previousBindingKeyValues: (string | number)[] | null\n): CubeQuery {\n  const query: CubeQuery = { ...step.query }\n\n  // Get binding key field for this query\n  const bindingKeyField = getBindingKeyField(bindingKey, query)\n\n  // Ensure binding key dimension is in the query (needed to extract values for next step)\n  if (!query.dimensions?.includes(bindingKeyField)) {\n    query.dimensions = [...(query.dimensions || []), bindingKeyField]\n  }\n\n  // Add IN filter for previous step's binding key values (except for first step)\n  if (previousBindingKeyValues && previousBindingKeyValues.length > 0) {\n    const inFilter: SimpleFilter = {\n      member: bindingKeyField,\n      operator: 'in',\n      values: previousBindingKeyValues,\n    }\n    query.filters = [...(query.filters || []), inFilter]\n  }\n\n  return query\n}\n\n/**\n * Calculate conversion metrics for a step\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution now calculates metrics directly.\n */\nexport function calculateStepMetrics(\n  currentCount: number,\n  previousCount: number | null,\n  firstStepCount: number\n): {\n  conversionRate: number | null\n  cumulativeConversionRate: number\n} {\n  const conversionRate =\n    previousCount !== null && previousCount > 0\n      ? currentCount / previousCount\n      : null\n\n  const cumulativeConversionRate =\n    firstStepCount > 0 ? currentCount / firstStepCount : 1.0\n\n  return { conversionRate, cumulativeConversionRate }\n}\n\n/**\n * Build a funnel step result from query execution\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution now returns results directly.\n */\nexport function buildStepResult(\n  step: FunnelStep,\n  stepIndex: number,\n  data: unknown[],\n  bindingKeyField: string,\n  countUnique: boolean,\n  previousCount: number | null,\n  firstStepCount: number,\n  executionTime: number,\n  error: Error | null = null,\n  bindingKeyLimit: number = DEFAULT_BINDING_KEY_LIMIT\n): FunnelStepResult {\n  // Extract binding key values (with limit applied)\n  const extracted = error\n    ? { values: [], totalCount: 0, wasTruncated: false }\n    : extractBindingKeyValues(data, bindingKeyField, bindingKeyLimit)\n\n  // Calculate count based on total unique values (before truncation)\n  const count = error\n    ? 0\n    : countUnique\n      ? extracted.totalCount\n      : data.length\n\n  // Calculate conversion metrics\n  const { conversionRate, cumulativeConversionRate } = calculateStepMetrics(\n    count,\n    previousCount,\n    firstStepCount || count // Use current count as first step count if this is step 0\n  )\n\n  return {\n    stepIndex,\n    stepName: step.name,\n    stepId: step.id,\n    data,\n    bindingKeyValues: extracted.values,\n    bindingKeyTotalCount: extracted.totalCount,\n    count,\n    conversionRate,\n    cumulativeConversionRate,\n    executionTime,\n    error,\n  }\n}\n\n/**\n * Convert step results to chart-ready data format\n *\n * @deprecated Use transformServerFunnelResult() instead.\n * Server-side funnel execution returns data in a compatible format.\n */\nexport function buildFunnelChartData(\n  stepResults: FunnelStepResult[]\n): FunnelChartData[] {\n  if (stepResults.length === 0) return []\n\n  const firstStepCount = stepResults[0]?.count || 0\n\n  return stepResults.map((result, index) => ({\n    name: result.stepName,\n    value: result.count,\n    percentage: firstStepCount > 0 ? (result.count / firstStepCount) * 100 : 0,\n    conversionRate: result.conversionRate,\n    stepIndex: index,\n  }))\n}\n\n/**\n * Build the complete funnel execution result\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution now builds results directly.\n */\nexport function buildFunnelResult(\n  config: FunnelConfig,\n  stepResults: FunnelStepResult[],\n  status: FunnelExecutionResult['status'],\n  error: Error | null = null,\n  currentStepIndex: number | null = null\n): FunnelExecutionResult {\n  const firstStepCount = stepResults[0]?.count || 0\n  const lastStepCount = stepResults[stepResults.length - 1]?.count || 0\n  const totalExecutionTime = stepResults.reduce((sum, r) => sum + r.executionTime, 0)\n\n  return {\n    config,\n    steps: stepResults,\n    summary: {\n      totalEntries: firstStepCount,\n      totalCompletions: lastStepCount,\n      overallConversionRate: firstStepCount > 0 ? lastStepCount / firstStepCount : 0,\n      totalExecutionTime,\n    },\n    chartData: buildFunnelChartData(stepResults),\n    status,\n    error,\n    currentStepIndex,\n  }\n}\n\n/**\n * Create an empty/initial funnel result\n *\n * @deprecated This function was used for client-side funnel execution.\n * Server-side funnel execution manages state differently.\n */\nexport function createEmptyFunnelResult(\n  config: FunnelConfig\n): FunnelExecutionResult {\n  return {\n    config,\n    steps: [],\n    summary: {\n      totalEntries: 0,\n      totalCompletions: 0,\n      overallConversionRate: 0,\n      totalExecutionTime: 0,\n    },\n    chartData: [],\n    status: 'idle',\n    error: null,\n    currentStepIndex: null,\n  }\n}\n\n/**\n * Build a FunnelConfig from multi-query config state.\n * Used to convert AnalysisBuilder state to funnel configuration.\n *\n * @deprecated Use the dedicated funnel mode (analysisType === 'funnel') instead.\n * This function supports backward compatibility with legacy multi-query funnel mode\n * (mergeStrategy === 'funnel'). For new implementations, use the dedicated funnel\n * state in the store which provides better UX with step-based configuration.\n *\n * @param queries - Array of CubeQuery objects (one per step)\n * @param bindingKey - The binding key configuration\n * @param stepLabels - Optional labels for each step\n * @param stepTimeToConvert - Optional time window for each step\n * @returns FunnelConfig ready for execution\n */\nexport function buildFunnelConfigFromQueries(\n  queries: CubeQuery[],\n  bindingKey: FunnelBindingKey,\n  stepLabels?: string[],\n  stepTimeToConvert?: (string | null)[]\n): FunnelConfig {\n  const steps: FunnelStep[] = queries.map((query, index) => ({\n    id: `step-${index}`,\n    name: stepLabels?.[index] || `Step ${index + 1}`,\n    query,\n    timeToConvert: stepTimeToConvert?.[index] || undefined,\n  }))\n\n  return {\n    id: `funnel-${Date.now()}`,\n    name: 'Funnel Analysis',\n    bindingKey,\n    steps,\n    countUnique: true,\n  }\n}\n\n/**\n * Check if funnel execution should stop early\n * (e.g., when no binding key values remain)\n */\nexport function shouldStopFunnelExecution(\n  stepResult: FunnelStepResult\n): boolean {\n  return stepResult.bindingKeyValues.length === 0 || stepResult.error !== null\n}\n\n/**\n * Metadata fields injected into funnel result data\n * (for compatibility with existing chart/table components)\n */\nexport interface FunnelMetadata {\n  __stepIndex: number\n  __stepName: string\n  __stepId: string\n  __conversionRate: number | null\n  __cumulativeRate: number\n}\n\n/**\n * Check if data contains funnel metadata\n */\nexport function isFunnelData(data: unknown[]): boolean {\n  return (\n    data.length > 0 &&\n    typeof data[0] === 'object' &&\n    data[0] !== null &&\n    '__stepIndex' in data[0]\n  )\n}\n\n// =============================================================================\n// Server-Side Funnel Support\n// =============================================================================\n\n/**\n * Server-side funnel step definition (for FunnelQueryConfig)\n */\nexport interface ServerFunnelStep {\n  name: string\n  filter?: SimpleFilter | SimpleFilter[]\n  timeToConvert?: string\n}\n\n/**\n * Server-side funnel query configuration\n */\nexport interface ServerFunnelQueryConfig {\n  bindingKey: string | FunnelBindingKeyMapping[]\n  timeDimension: string | Array<{ cube: string; dimension: string }>\n  steps: ServerFunnelStep[]\n  includeTimeMetrics?: boolean\n  globalTimeWindow?: string\n}\n\n/**\n * Server-side funnel result row\n */\nexport interface ServerFunnelResultRow {\n  step: string\n  stepIndex: number\n  count: number\n  conversionRate: number | null\n  cumulativeConversionRate: number\n  avgSecondsToConvert?: number | null\n  medianSecondsToConvert?: number | null\n  p90SecondsToConvert?: number | null\n  minSecondsToConvert?: number | null\n  maxSecondsToConvert?: number | null\n}\n\n/**\n * Query shape for server-side funnel execution\n */\nexport interface ServerFunnelQuery {\n  funnel: ServerFunnelQueryConfig\n}\n\n/**\n * Build a server-side funnel query from client state.\n *\n * Transforms the client-side FunnelConfig format into a SemanticQuery\n * with `funnel` property that the server can execute.\n *\n * @param queries - Array of CubeQuery objects (one per step)\n * @param bindingKey - The binding key configuration\n * @param stepLabels - Optional labels for each step\n * @param stepTimeToConvert - Optional time window for each step (ISO 8601 duration)\n * @param includeTimeMetrics - Whether to include time-to-convert metrics\n * @returns Query object with funnel configuration for server execution\n */\nexport function buildServerFunnelQuery(\n  queries: CubeQuery[],\n  bindingKey: FunnelBindingKey,\n  stepLabels?: string[],\n  stepTimeToConvert?: (string | null)[],\n  includeTimeMetrics: boolean = true\n): ServerFunnelQuery {\n  // 1. Unwrap binding key from client format (client wraps in { dimension: ... })\n  const serverBindingKey = bindingKey.dimension\n\n  // 2. Extract time dimension from queries\n  const timeDimension = extractTimeDimensionFromQueries(queries, bindingKey)\n\n  // 3. Convert each CubeQuery to a server FunnelStep\n  const steps: ServerFunnelStep[] = queries.map((query, index) => {\n    const step: ServerFunnelStep = {\n      name: stepLabels?.[index] || `Step ${index + 1}`,\n    }\n\n    // Extract filters from query\n    const filter = extractFiltersFromQuery(query)\n    if (filter) {\n      step.filter = filter\n    }\n\n    // Add time-to-convert constraint if specified\n    const timeConstraint = stepTimeToConvert?.[index]\n    if (timeConstraint) {\n      step.timeToConvert = timeConstraint\n    }\n\n    return step\n  })\n\n  return {\n    funnel: {\n      bindingKey: serverBindingKey,\n      timeDimension,\n      steps,\n      includeTimeMetrics,\n    },\n  }\n}\n\n/**\n * Extract time dimension from queries.\n *\n * For single-cube funnels, returns the first time dimension found.\n * For cross-cube funnels (with binding key mappings), builds a mapping array.\n *\n * @param queries - Array of CubeQuery objects\n * @param bindingKey - The binding key configuration (to detect cross-cube)\n * @returns Time dimension string or mapping array\n */\nfunction extractTimeDimensionFromQueries(\n  queries: CubeQuery[],\n  bindingKey: FunnelBindingKey\n): string | Array<{ cube: string; dimension: string }> {\n  // Check if this is a cross-cube funnel\n  if (Array.isArray(bindingKey.dimension)) {\n    return extractCrossCubeTimeDimensions(queries, bindingKey.dimension as FunnelBindingKeyMapping[])\n  }\n  return extractSingleCubeTimeDimension(queries)\n}\n\n/**\n * Single-cube: return the first explicit time dimension, falling back to the\n * common `<cube>.createdAt` convention.\n */\nfunction extractSingleCubeTimeDimension(queries: CubeQuery[]): string {\n  for (const query of queries) {\n    if (query.timeDimensions?.length) {\n      return query.timeDimensions[0].dimension\n    }\n  }\n  // Fallback: try to infer from measures/dimensions\n  const cubeName = getCubeNameFromQuery(queries[0])\n  if (cubeName) {\n    return `${cubeName}.createdAt` // Common convention\n  }\n  throw new Error('Funnel requires at least one time dimension in step queries')\n}\n\n/**\n * Cross-cube: build a time-dimension mapping per cube, falling back to the\n * common `<cube>.createdAt` convention when none is present.\n */\nfunction extractCrossCubeTimeDimensions(\n  queries: CubeQuery[],\n  bindingMappings: FunnelBindingKeyMapping[]\n): Array<{ cube: string; dimension: string }> {\n  return bindingMappings.map(mapping => {\n    const cubeQuery = queries.find(q => getCubeNameFromQuery(q) === mapping.cube)\n    const dimension = cubeQuery?.timeDimensions?.length\n      ? cubeQuery.timeDimensions[0].dimension\n      : `${mapping.cube}.createdAt` // Fallback to common convention\n    return { cube: mapping.cube, dimension }\n  })\n}\n\n/**\n * Extract filters from a CubeQuery for server funnel step.\n *\n * @param query - The CubeQuery\n * @returns Filter or array of filters, or undefined if no filters\n */\nfunction extractFiltersFromQuery(query: CubeQuery): SimpleFilter | SimpleFilter[] | undefined {\n  if (!query.filters?.length) {\n    return undefined\n  }\n\n  // Filter out any binding key filters (server handles those)\n  const filters = query.filters.filter(f => {\n    // Keep only SimpleFilter with member (not grouped filters for now)\n    if ('member' in f) {\n      return true\n    }\n    return false\n  }) as SimpleFilter[]\n\n  if (filters.length === 0) {\n    return undefined\n  }\n\n  if (filters.length === 1) {\n    return filters[0]\n  }\n\n  return filters\n}\n\n/**\n * Transform server funnel result rows to client FunnelChartData format.\n *\n * Maps the server's FunnelResultRow[] to the client's FunnelChartData[]\n * format expected by FunnelChart component.\n *\n * @param serverResult - Raw data from server (FunnelResultRow[])\n * @param stepNames - Optional step names to override server names\n * @returns FunnelChartData[] ready for FunnelChart component\n */\nexport function transformServerFunnelResult(\n  serverResult: unknown[],\n  stepNames?: string[]\n): FunnelChartData[] {\n  if (!serverResult?.length) {\n    return []\n  }\n\n  const rows = serverResult as ServerFunnelResultRow[]\n\n  return rows.map((row, index) => ({\n    // Map server fields to client format\n    name: stepNames?.[index] || row.step,\n    value: row.count,\n    // Convert cumulative rate to percentage\n    percentage: row.cumulativeConversionRate * 100,\n    // Convert step-to-step rate to percentage (null for first step)\n    conversionRate: row.conversionRate !== null ? row.conversionRate * 100 : null,\n    stepIndex: row.stepIndex,\n    // Include time metrics for optional display\n    avgSecondsToConvert: row.avgSecondsToConvert,\n    medianSecondsToConvert: row.medianSecondsToConvert,\n    p90SecondsToConvert: row.p90SecondsToConvert,\n  }))\n}\n\n/**\n * Format a duration in seconds to a human-readable string.\n *\n * @param seconds - Duration in seconds\n * @returns Formatted string (e.g., \"45s\", \"2.5m\", \"1.3h\", \"3.2d\")\n */\nexport function formatDuration(seconds: number | null | undefined): string {\n  if (seconds === null || seconds === undefined) {\n    return '-'\n  }\n\n  if (seconds < 60) {\n    return `${Math.round(seconds)}s`\n  }\n\n  if (seconds < 3600) {\n    const minutes = seconds / 60\n    return minutes < 10 ? `${minutes.toFixed(1)}m` : `${Math.round(minutes)}m`\n  }\n\n  if (seconds < 86400) {\n    const hours = seconds / 3600\n    return hours < 10 ? `${hours.toFixed(1)}h` : `${Math.round(hours)}h`\n  }\n\n  const days = seconds / 86400\n  return days < 10 ? `${days.toFixed(1)}d` : `${Math.round(days)}d`\n}\n","/**\n * Co-located helpers for FunnelChart.\n *\n * Pure data-shaping + display-option resolution extracted from the component.\n * No behaviour change — mirrors the original inline logic exactly.\n */\nimport type { ChartDisplayConfig } from '../../types.js'\nimport type { FunnelChartData } from '../../types/funnel.js'\nimport { formatDuration } from '../../utils/funnelExecution.js'\n\n/** Check if data is already in funnel data format. */\nexport function isFunnelData(data: unknown[]): data is FunnelChartData[] {\n  if (!data || data.length === 0) return false\n  const first = data[0]\n  return (\n    typeof first === 'object' &&\n    first !== null &&\n    'name' in first &&\n    'value' in first &&\n    'percentage' in first\n  )\n}\n\n/**\n * Render time metrics based on config options - returns array of lines for\n * vertical stacking.\n */\nexport function getTimeMetricsLines(\n  step: FunnelChartData,\n  showAvg: boolean,\n  showMedian: boolean,\n  showP90: boolean\n): string[] {\n  const lines: string[] = []\n  if (showAvg && step.avgSecondsToConvert != null) {\n    lines.push(`Avg: ${formatDuration(step.avgSecondsToConvert)}`)\n  }\n  if (showMedian && step.medianSecondsToConvert != null) {\n    lines.push(`Med: ${formatDuration(step.medianSecondsToConvert)}`)\n  }\n  if (showP90 && step.p90SecondsToConvert != null) {\n    lines.push(`P90: ${formatDuration(step.p90SecondsToConvert)}`)\n  }\n  return lines\n}\n\n/** Coerce arbitrary query rows into FunnelChartData by probing field names. */\nexport function toFunnelData(data: unknown[]): FunnelChartData[] {\n  if (!data || data.length === 0) return []\n  if (isFunnelData(data)) return data\n\n  return data.map((row, index) => {\n    const record = row as Record<string, unknown>\n\n    const nameField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('step') || k.toLowerCase().includes('name') || k === '__stepName'\n    )\n    const name = nameField ? String(record[nameField]) : `Step ${index + 1}`\n\n    const valueField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('count') || k.toLowerCase().includes('value') || k === '__count'\n    )\n    const value = valueField ? Number(record[valueField]) || 0 : 0\n\n    const percentField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('percent') || k === '__percentage'\n    )\n    const percentage = percentField ? Number(record[percentField]) || 0 : 0\n\n    const convRateField = Object.keys(record).find(\n      (k) => k.toLowerCase().includes('conversion') || k === '__conversionRate'\n    )\n    const conversionRate = convRateField ? Number(record[convRateField]) || null : null\n\n    return { name, value, percentage, conversionRate, stepIndex: index }\n  })\n}\n\nexport interface FunnelDisplayOptions {\n  customStepLabels?: string[]\n  isVertical: boolean\n  funnelStyle: NonNullable<ChartDisplayConfig['funnelStyle']>\n  showConversion: boolean\n  showAvgTime: boolean\n  showMedianTime: boolean\n  showP90Time: boolean\n  hideSummaryFooter: boolean\n}\n\n/** Resolve every funnel display option (with backward-compat for time metrics). */\nexport function resolveFunnelDisplayOptions(\n  displayConfig: ChartDisplayConfig | undefined\n): FunnelDisplayOptions {\n  return {\n    customStepLabels: displayConfig?.funnelStepLabels,\n    isVertical: (displayConfig?.funnelOrientation || 'horizontal') === 'vertical',\n    funnelStyle: displayConfig?.funnelStyle ?? 'bars',\n    showConversion: displayConfig?.showFunnelConversion ?? true,\n    // Time metrics - individual toggles with backward compat for showFunnelTimeMetrics\n    showAvgTime: displayConfig?.showFunnelAvgTime ?? (displayConfig?.showFunnelTimeMetrics ?? false),\n    showMedianTime: displayConfig?.showFunnelMedianTime ?? false,\n    showP90Time: displayConfig?.showFunnelP90Time ?? false,\n    hideSummaryFooter: displayConfig?.hideSummaryFooter ?? false\n  }\n}\n\n/** Color for a funnel step (cyclic over the palette or the default funnel gradient). */\nexport function getStepColor(index: number, colorPalette: string[]): string {\n  return colorPalette[index % colorPalette.length]\n}\n","import { FunnelChart as RechartsFunnelChart, Funnel, LabelList, Tooltip, Cell, ResponsiveContainer } from 'recharts'\nimport { useTranslation } from '../../hooks/useTranslation.js'\nimport type { FunnelChartData } from '../../types/funnel.js'\nimport { getStepColor, getTimeMetricsLines, type FunnelDisplayOptions } from './FunnelChart.helpers.js'\n\ninterface FunnelViewProps {\n  funnelData: FunnelChartData[]\n  firstStepValue: number\n  paletteColors: string[]\n  options: FunnelDisplayOptions\n  height: string | number\n}\n\n/** Shared summary footer (steps count, overall conversion, completed ratio). */\nfunction FunnelSummaryFooter({\n  funnelData,\n  firstStepValue\n}: {\n  funnelData: FunnelChartData[]\n  firstStepValue: number\n}) {\n  const { t } = useTranslation()\n  const lastValue = funnelData[funnelData.length - 1]?.value || 0\n  return (\n    <div className=\"dc:flex-shrink-0 dc:px-4 dc:py-2 dc:border-t border-dc-border bg-dc-surface-secondary\">\n      <div className=\"dc:flex dc:items-center dc:justify-between dc:text-sm\">\n        <div className=\"text-dc-text-muted\">\n          <span className=\"dc:font-medium\">{funnelData.length}</span> steps\n        </div>\n        <div className=\"text-dc-text\">\n          <span className=\"text-dc-text-muted\">{t('chart.runtime.funnel.overall')}</span>{' '}\n          <span className=\"dc:font-medium\">\n            {firstStepValue > 0 ? `${(lastValue / firstStepValue * 100).toFixed(1)}%` : '0%'}\n          </span>\n        </div>\n        <div className=\"text-dc-text-muted\">\n          {lastValue.toLocaleString() || 0} / {firstStepValue.toLocaleString()} completed\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/** Per-step conversion + time-metrics block (shared by vertical/horizontal views). */\nfunction StepMetrics({\n  stepConversionRate,\n  arrow,\n  showConversion,\n  timeMetricsLines\n}: {\n  stepConversionRate: number | null\n  arrow: string\n  showConversion: boolean\n  timeMetricsLines: string[]\n}) {\n  if (stepConversionRate === null) {\n    return <div className=\"dc:text-xs text-dc-text-muted\">—</div>\n  }\n  return (\n    <div className=\"dc:text-xs text-dc-text-secondary\">\n      {showConversion && <span>{arrow} {stepConversionRate.toFixed(1)}%</span>}\n      {timeMetricsLines.length > 0 && (\n        <div className=\"text-dc-text-muted dc:mt-0.5 dc:space-y-0.5\">\n          {timeMetricsLines.map((line, i) => (\n            <div key={i}>⏱ {line}</div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\n/** Recharts trapezoid funnel style. */\nexport function FunnelShapeView({ funnelData, firstStepValue, paletteColors, options, height }: FunnelViewProps) {\n  // Recharts FunnelChart layout: 'horizontal' = funnel flows left-to-right,\n  // 'vertical' = top-to-bottom (default). Our 'vertical' orientation maps to\n  // a left-to-right Recharts funnel.\n  const rechartsLayout: 'horizontal' | 'vertical' = options.isVertical ? 'horizontal' : 'vertical'\n\n  return (\n    <div className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      <div className=\"dc:flex-1\">\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <RechartsFunnelChart layout={rechartsLayout} accessibilityLayer={false}>\n            <Tooltip\n              formatter={(value) => typeof value === 'number' ? value.toLocaleString() : String(value)}\n              contentStyle={{\n                backgroundColor: 'var(--dc-surface)',\n                border: '1px solid var(--dc-border)',\n                borderRadius: '4px',\n              }}\n            />\n            <Funnel dataKey=\"value\" nameKey=\"name\" data={funnelData} isAnimationActive>\n              {funnelData.map((_, index) => (\n                <Cell key={`cell-${index}`} fill={getStepColor(index, paletteColors)} />\n              ))}\n              <LabelList position=\"right\" dataKey=\"name\" fill=\"var(--dc-text)\" style={{ fontSize: '12px' }} />\n              <LabelList\n                position=\"center\"\n                dataKey=\"percentage\"\n                formatter={(v) => typeof v === 'number' ? `${v.toFixed(1)}%` : String(v)}\n                fill=\"#fff\"\n                style={{ fontSize: '11px', fontWeight: 500 }}\n              />\n            </Funnel>\n          </RechartsFunnelChart>\n        </ResponsiveContainer>\n      </div>\n      {!options.hideSummaryFooter && (\n        <FunnelSummaryFooter funnelData={funnelData} firstStepValue={firstStepValue} />\n      )}\n    </div>\n  )\n}\n\n/** Vertical bars (steps laid out horizontally, bars grow bottom-to-top). */\nexport function FunnelVerticalView({ funnelData, firstStepValue, paletteColors, options, height }: FunnelViewProps) {\n  return (\n    <div className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      <div className=\"dc:flex-1 dc:flex dc:items-end dc:justify-center dc:gap-4 dc:px-4 dc:py-3 dc:overflow-hidden\">\n        {funnelData.map((step, index) => {\n          const heightPercent = firstStepValue > 0 ? (step.value / firstStepValue) * 100 : 0\n          const prevStep = index > 0 ? funnelData[index - 1] : null\n          const stepConversionRate = prevStep && prevStep.value > 0 ? (step.value / prevStep.value) * 100 : null\n          const displayName = options.customStepLabels?.[index] || step.name\n          const timeMetricsLines = getTimeMetricsLines(step, options.showAvgTime, options.showMedianTime, options.showP90Time)\n          const metricsCount = timeMetricsLines.length\n\n          return (\n            <div key={step.name} className=\"dc:flex dc:flex-col dc:items-center dc:gap-2 dc:flex-1 dc:max-w-32 dc:h-full\">\n              <div className={`${metricsCount > 0 ? (metricsCount > 1 ? 'dc:min-h-16' : 'dc:min-h-10') : 'dc:h-5'} dc:flex-shrink-0 dc:text-center`}>\n                <StepMetrics\n                  stepConversionRate={stepConversionRate}\n                  arrow=\"→\"\n                  showConversion={options.showConversion}\n                  timeMetricsLines={timeMetricsLines}\n                />\n              </div>\n\n              <div className=\"dc:flex-1 dc:w-full dc:relative dc:min-h-12\">\n                <div className=\"dc:absolute dc:inset-0 bg-dc-surface-secondary dc:rounded-sm\" />\n                <div\n                  className=\"dc:absolute dc:bottom-0 dc:left-0 dc:right-0 dc:rounded-sm dc:transition-all dc:duration-300\"\n                  style={{ height: `${Math.max(heightPercent, 5)}%`, backgroundColor: getStepColor(index, paletteColors) }}\n                />\n                <div\n                  className=\"dc:absolute dc:bottom-0 dc:left-0 dc:right-0 dc:flex dc:items-end dc:justify-center dc:pb-1 dc:pointer-events-none\"\n                  style={{ height: `${Math.max(heightPercent, 20)}%` }}\n                >\n                  <span className=\"dc:text-xs dc:font-medium text-white dc:drop-shadow-sm\">\n                    {step.percentage?.toFixed(1) ?? heightPercent.toFixed(1)}%\n                  </span>\n                </div>\n              </div>\n\n              <div className=\"dc:flex-shrink-0 dc:text-center\">\n                <div className=\"dc:text-sm dc:font-medium text-dc-text dc:truncate\" title={displayName}>\n                  {displayName}\n                </div>\n                <div className=\"dc:text-xs text-dc-text-muted\">\n                  {step.value.toLocaleString()}\n                </div>\n              </div>\n            </div>\n          )\n        })}\n      </div>\n\n      {!options.hideSummaryFooter && (\n        <FunnelSummaryFooter funnelData={funnelData} firstStepValue={firstStepValue} />\n      )}\n    </div>\n  )\n}\n\n/** Horizontal bars (default - steps stacked vertically, bars grow left-to-right). */\nexport function FunnelHorizontalView({ funnelData, firstStepValue, paletteColors, options, height }: FunnelViewProps) {\n  return (\n    <div className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      <div className=\"dc:flex-1 dc:flex dc:flex-col dc:justify-center dc:gap-2 dc:px-4 dc:py-3 dc:overflow-hidden\">\n        {funnelData.map((step, index) => {\n          const widthPercent = firstStepValue > 0 ? (step.value / firstStepValue) * 100 : 0\n          const prevStep = index > 0 ? funnelData[index - 1] : null\n          const stepConversionRate = prevStep && prevStep.value > 0 ? (step.value / prevStep.value) * 100 : null\n          const displayName = options.customStepLabels?.[index] || step.name\n          const timeMetricsLines = getTimeMetricsLines(step, options.showAvgTime, options.showMedianTime, options.showP90Time)\n          const metricsCount = timeMetricsLines.length\n\n          return (\n            <div key={step.name} className=\"dc:flex dc:items-center dc:gap-3\">\n              <div className=\"dc:w-24 dc:flex-shrink-0 dc:text-right\">\n                <div className=\"dc:text-sm dc:font-medium text-dc-text dc:truncate\" title={displayName}>\n                  {displayName}\n                </div>\n                <div className=\"dc:text-xs text-dc-text-muted\">\n                  {step.value.toLocaleString()}\n                </div>\n              </div>\n\n              <div className=\"dc:flex-1 dc:relative\">\n                <div className=\"dc:w-full dc:h-8 bg-dc-surface-secondary dc:rounded-sm\" />\n                <div\n                  className=\"dc:absolute dc:top-0 dc:left-0 dc:h-8 dc:rounded-sm dc:transition-all dc:duration-300\"\n                  style={{ width: `${Math.max(widthPercent, 2)}%`, backgroundColor: getStepColor(index, paletteColors) }}\n                />\n                <div\n                  className=\"dc:absolute dc:top-0 dc:left-0 dc:h-8 dc:flex dc:items-center dc:px-2 dc:pointer-events-none\"\n                  style={{ width: `${Math.max(widthPercent, 20)}%` }}\n                >\n                  <span className=\"dc:text-xs dc:font-medium text-white dc:drop-shadow-sm\">\n                    {step.percentage?.toFixed(1) ?? widthPercent.toFixed(1)}%\n                  </span>\n                </div>\n              </div>\n\n              <div className={`${metricsCount > 0 ? (metricsCount > 1 ? 'dc:w-36' : 'dc:w-28') : 'dc:w-16'} dc:flex-shrink-0 dc:text-left`}>\n                <StepMetrics\n                  stepConversionRate={stepConversionRate}\n                  arrow=\"↓\"\n                  showConversion={options.showConversion}\n                  timeMetricsLines={timeMetricsLines}\n                />\n              </div>\n            </div>\n          )\n        })}\n      </div>\n\n      {!options.hideSummaryFooter && (\n        <FunnelSummaryFooter funnelData={funnelData} firstStepValue={firstStepValue} />\n      )}\n    </div>\n  )\n}\n","/**\n * FunnelChart Component\n *\n * Visualizes funnel data showing conversion rates between steps.\n * Uses horizontal bars with percentage widths to represent the funnel shape.\n * Works with data from useFunnelQuery hook which provides FunnelChartData.\n *\n * When displayConfig.showFunnelTimeMetrics is enabled, displays time-to-convert\n * metrics from server-side funnel execution (avg, median, P90 seconds).\n */\n\nimport React, { useMemo } from 'react'\nimport { useTranslation } from '../../hooks/useTranslation.js'\nimport { CHART_COLORS } from '../../utils/chartConstants.js'\nimport type { ChartProps } from '../../types.js'\nimport type { FunnelChartData } from '../../types/funnel.js'\nimport { toFunnelData, resolveFunnelDisplayOptions } from './FunnelChart.helpers.js'\nimport { FunnelShapeView, FunnelVerticalView, FunnelHorizontalView } from './FunnelViews.js'\n\n/**\n * FunnelChart Component\n *\n * Renders a funnel visualization from FunnelChartData array.\n * Shows each step as a horizontal bar with width proportional to count.\n * Displays conversion rates between steps.\n */\nconst FunnelChart = React.memo(function FunnelChart({\n  data,\n  height = '100%',\n  colorPalette,\n  displayConfig,\n}: ChartProps) {\n  const { t } = useTranslation()\n  const options = resolveFunnelDisplayOptions(displayConfig)\n\n  // Transform data if needed\n  const funnelData = useMemo<FunnelChartData[]>(() => toFunnelData(data), [data])\n\n  // Calculate first step value for percentage calculations\n  const firstStepValue = funnelData[0]?.value || 0\n\n  // Handle no data\n  if (!data || data.length === 0 || funnelData.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\">{t('chart.runtime.funnel.noData')}</div>\n          <div className=\"dc:text-xs text-dc-text-secondary\">\n            {t('chart.runtime.noDataHint.funnel')}\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  const paletteColors = colorPalette?.colors || CHART_COLORS\n  const viewProps = { funnelData, firstStepValue, paletteColors, options, height }\n\n  if (options.funnelStyle === 'funnel') {\n    return <FunnelShapeView {...viewProps} />\n  }\n\n  if (options.isVertical) {\n    return <FunnelVerticalView {...viewProps} />\n  }\n\n  return <FunnelHorizontalView {...viewProps} />\n})\n\nexport default FunnelChart\n"],"mappings":"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"}

package/dist/client/chunks/{chart-gauge-DXQ4r3cb.js → chart-gauge-DHIGq3TH.js}

@@ -1,6 +1,6 @@
-import { n as e } from "./rolldown-runtime-CWhphoD1.js";
-import { P as t, S as n, w as r } from "./chart-activity-grid-DDqFVWoa.js";
-import { S as i, b as a, x as o } from "./chart-area-BHxPNsmc.js";
+import { n as e } from "./rolldown-runtime-DArdT4gl.js";
+import { P as t, S as n, w as r } from "./chart-activity-grid-DVOhLgxv.js";
+import { D as i, O as a, k as o } from "./chart-area-C-5ATxvi.js";
 import s, { useLayoutEffect as c, useMemo as l, useRef as u, useState as d } from "react";
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region node_modules/d3-shape/src/constant.js
@@ -58,10 +58,12 @@ var N = class {
 		if (e = +e, t = +t, n = +n, r = +r, i = +i, i < 0) throw Error(`negative radius: ${i}`);
 		let a = this._x1, o = this._y1, s = n - e, c = r - t, l = a - e, u = o - t, d = l * l + u * u;
 		if (this._x1 === null) this._append`M${this._x1 = e},${this._y1 = t}`;
-		else if (d > k) if (!(Math.abs(u * s - c * l) > k) || !i) this._append`L${this._x1 = e},${this._y1 = t}`;
-		else {
-			let f = n - a, p = r - o, m = s * s + c * c, h = f * f + p * p, g = Math.sqrt(m), _ = Math.sqrt(d), v = i * Math.tan((D - Math.acos((m + d - h) / (2 * g * _))) / 2), y = v / _, b = v / g;
-			Math.abs(y - 1) > k && this._append`L${e + y * l},${t + y * u}`, this._append`A${i},${i},0,0,${+(u * f > l * p)},${this._x1 = e + b * s},${this._y1 = t + b * c}`;
+		else if (d > k) {
+			if (!(Math.abs(u * s - c * l) > k) || !i) this._append`L${this._x1 = e},${this._y1 = t}`;
+			else {
+				let f = n - a, p = r - o, m = s * s + c * c, h = f * f + p * p, g = Math.sqrt(m), _ = Math.sqrt(d), v = i * Math.tan((D - Math.acos((m + d - h) / (2 * g * _))) / 2), y = v / _, b = v / g;
+				Math.abs(y - 1) > k && this._append`L${e + y * l},${t + y * u}`, this._append`A${i},${i},0,0,${+(u * f > l * p)},${this._x1 = e + b * s},${this._y1 = t + b * c}`;
+			}
 		}
 	}
 	arc(e, t, n, r, i, a) {
@@ -76,13 +78,9 @@ var N = class {
 		return this._;
 	}
 };
-function P() {
-	return new N();
-}
-P.prototype = N.prototype;
 //#endregion
 //#region node_modules/d3-shape/src/path.js
-function F(e) {
+function P(e) {
 	let t = 3;
 	return e.digits = function(n) {
 		if (!arguments.length) return t;
@@ -97,26 +95,26 @@ function F(e) {
 }
 //#endregion
 //#region node_modules/d3-shape/src/arc.js
-function I(e) {
+function F(e) {
 	return e.innerRadius;
 }
-function L(e) {
+function I(e) {
 	return e.outerRadius;
 }
-function R(e) {
+function L(e) {
 	return e.startAngle;
 }
-function z(e) {
+function R(e) {
 	return e.endAngle;
 }
-function B(e) {
+function z(e) {
 	return e && e.padAngle;
 }
 function ee(e, t, n, r, i, a, o, s) {
 	var c = n - e, l = r - t, u = o - i, d = s - a, f = d * c - u * l;
 	if (!(f * f < 1e-12)) return f = (u * (t - a) - d * (e - i)) / f, [e + f * c, t + f * l];
 }
-function V(e, t, n, r, i, a, o) {
+function B(e, t, n, r, i, a, o) {
 	var s = e - n, c = t - r, l = (o ? a : -a) / x(s * s + c * c), u = l * c, d = -l * s, f = e + u, p = t + d, m = n + u, h = r + d, g = (f + m) / 2, _ = (p + h) / 2, y = m - f, b = h - p, S = y * y + b * b, C = i - a, w = f * h - m * p, T = (b < 0 ? -1 : 1) * x(v(0, C * C * S - w * w)), E = (w * b - y * T) / S, D = (-w * y - b * T) / S, O = (w * b + y * T) / S, k = (-w * y + b * T) / S, A = E - g, j = D - _, M = O - g, N = k - _;
 	return A * A + j * j > M * M + N * N && (E = O, D = k), {
 		cx: E,
@@ -127,14 +125,14 @@ function V(e, t, n, r, i, a, o) {
 		y11: D * (i / C - 1)
 	};
 }
-function H() {
-	var e = I, t = L, n = m(0), r = null, i = R, a = z, o = B, s = null, c = F(l);
+function V() {
+	var e = F, t = I, n = m(0), r = null, i = L, a = R, o = z, s = null, c = P(l);
 	function l() {
 		var l, u, d = +e.apply(this, arguments), f = +t.apply(this, arguments), p = i.apply(this, arguments) - C, m = a.apply(this, arguments) - C, v = h(m - p), D = m > p;
 		if (s ||= l = c(), f < d && (u = f, f = d, d = u), !(f > 1e-12)) s.moveTo(0, 0);
 		else if (v > w - 1e-12) s.moveTo(f * _(p), f * b(p)), s.arc(0, 0, f, p, m, !D), d > 1e-12 && (s.moveTo(d * _(m), d * b(m)), s.arc(0, 0, d, m, p, D));
 		else {
-			var O = p, k = m, A = p, j = m, M = v, N = v, P = o.apply(this, arguments) / 2, F = P > 1e-12 && (r ? +r.apply(this, arguments) : x(d * d + f * f)), I = y(h(f - d) / 2, +n.apply(this, arguments)), L = I, R = I, z, B;
+			var O = p, k = m, A = p, j = m, M = v, N = v, P = o.apply(this, arguments) / 2, F = P > 1e-12 && (r ? +r.apply(this, arguments) : x(d * d + f * f)), I = y(h(f - d) / 2, +n.apply(this, arguments)), L = I, R = I, z, V;
 			if (F > 1e-12) {
 				var H = E(F / d * b(P)), U = E(F / f * b(P));
 				(M -= H * 2) > 1e-12 ? (H *= D ? 1 : -1, A += H, j -= H) : (M = 0, A = j = (p + m) / 2), (N -= U * 2) > 1e-12 ? (U *= D ? 1 : -1, O += U, k -= U) : (N = 0, O = k = (p + m) / 2);
@@ -142,12 +140,14 @@ function H() {
 			var W = f * _(O), G = f * b(O), K = d * _(j), q = d * b(j);
 			if (I > 1e-12) {
 				var J = f * _(k), Y = f * b(k), X = d * _(A), Z = d * b(A), Q;
-				if (v < S) if (Q = ee(W, G, X, Z, J, Y, K, q)) {
-					var te = W - Q[0], ne = G - Q[1], re = J - Q[0], $ = Y - Q[1], ie = 1 / b(T((te * re + ne * $) / (x(te * te + ne * ne) * x(re * re + $ * $))) / 2), ae = x(Q[0] * Q[0] + Q[1] * Q[1]);
-					L = y(I, (d - ae) / (ie - 1)), R = y(I, (f - ae) / (ie + 1));
-				} else L = R = 0;
+				if (v < S) {
+					if (Q = ee(W, G, X, Z, J, Y, K, q)) {
+						var te = W - Q[0], ne = G - Q[1], $ = J - Q[0], re = Y - Q[1], ie = 1 / b(T((te * $ + ne * re) / (x(te * te + ne * ne) * x($ * $ + re * re))) / 2), ae = x(Q[0] * Q[0] + Q[1] * Q[1]);
+						L = y(I, (d - ae) / (ie - 1)), R = y(I, (f - ae) / (ie + 1));
+					} else L = R = 0;
+				}
 			}
-			N > 1e-12 ? R > 1e-12 ? (z = V(X, Z, W, G, f, R, D), B = V(J, Y, K, q, f, R, D), s.moveTo(z.cx + z.x01, z.cy + z.y01), R < I ? s.arc(z.cx, z.cy, R, g(z.y01, z.x01), g(B.y01, B.x01), !D) : (s.arc(z.cx, z.cy, R, g(z.y01, z.x01), g(z.y11, z.x11), !D), s.arc(0, 0, f, g(z.cy + z.y11, z.cx + z.x11), g(B.cy + B.y11, B.cx + B.x11), !D), s.arc(B.cx, B.cy, R, g(B.y11, B.x11), g(B.y01, B.x01), !D))) : (s.moveTo(W, G), s.arc(0, 0, f, O, k, !D)) : s.moveTo(W, G), !(d > 1e-12) || !(M > 1e-12) ? s.lineTo(K, q) : L > 1e-12 ? (z = V(K, q, J, Y, d, -L, D), B = V(W, G, X, Z, d, -L, D), s.lineTo(z.cx + z.x01, z.cy + z.y01), L < I ? s.arc(z.cx, z.cy, L, g(z.y01, z.x01), g(B.y01, B.x01), !D) : (s.arc(z.cx, z.cy, L, g(z.y01, z.x01), g(z.y11, z.x11), !D), s.arc(0, 0, d, g(z.cy + z.y11, z.cx + z.x11), g(B.cy + B.y11, B.cx + B.x11), D), s.arc(B.cx, B.cy, L, g(B.y11, B.x11), g(B.y01, B.x01), !D))) : s.arc(0, 0, d, j, A, D);
+			N > 1e-12 ? R > 1e-12 ? (z = B(X, Z, W, G, f, R, D), V = B(J, Y, K, q, f, R, D), s.moveTo(z.cx + z.x01, z.cy + z.y01), R < I ? s.arc(z.cx, z.cy, R, g(z.y01, z.x01), g(V.y01, V.x01), !D) : (s.arc(z.cx, z.cy, R, g(z.y01, z.x01), g(z.y11, z.x11), !D), s.arc(0, 0, f, g(z.cy + z.y11, z.cx + z.x11), g(V.cy + V.y11, V.cx + V.x11), !D), s.arc(V.cx, V.cy, R, g(V.y11, V.x11), g(V.y01, V.x01), !D))) : (s.moveTo(W, G), s.arc(0, 0, f, O, k, !D)) : s.moveTo(W, G), !(d > 1e-12) || !(M > 1e-12) ? s.lineTo(K, q) : L > 1e-12 ? (z = B(K, q, J, Y, d, -L, D), V = B(W, G, X, Z, d, -L, D), s.lineTo(z.cx + z.x01, z.cy + z.y01), L < I ? s.arc(z.cx, z.cy, L, g(z.y01, z.x01), g(V.y01, V.x01), !D) : (s.arc(z.cx, z.cy, L, g(z.y01, z.x01), g(z.y11, z.x11), !D), s.arc(0, 0, d, g(z.cy + z.y11, z.cx + z.x11), g(V.cy + V.y11, V.cx + V.x11), D), s.arc(V.cx, V.cy, L, g(V.y11, V.x11), g(V.y01, V.x01), !D))) : s.arc(0, 0, d, j, A, D);
 		}
 		if (s.closePath(), l) return s = null, l + "" || null;
 	}
@@ -174,36 +174,36 @@ function H() {
 }
 //#endregion
 //#region src/client/components/charts/gaugeChartHelpers.ts
-var U = -Math.PI * .75, W = Math.PI * .75, G = "#e2e8f0", K = "#6366f1";
-function q(e) {
+var H = -Math.PI * .75, U = Math.PI * .75, W = "#e2e8f0", G = "#6366f1";
+function K(e) {
 	if (e == null) return null;
 	let t = typeof e == "number" ? e : parseFloat(String(e));
 	return isNaN(t) ? null : t;
 }
-function J(e, t, n) {
+function q(e, t, n) {
 	return Math.max(t, Math.min(n, e));
 }
-function Y(e, t, n) {
+function J(e, t, n) {
 	let r = n === t ? 1 : n - t;
-	return U + J((e - t) / r, 0, 1) * (W - U);
+	return H + q((e - t) / r, 0, 1) * (U - H);
 }
-function X(e, t) {
-	let n = [...t].sort((e, t) => e.value - t.value), r = K;
+function Y(e, t) {
+	let n = [...t].sort((e, t) => e.value - t.value), r = G;
 	for (let t of n) e >= t.value && (r = t.color);
 	return r;
 }
-function Z(e, t, n, r) {
-	return H()({
+function X(e, t, n, r) {
+	return V()({
 		innerRadius: e,
 		outerRadius: t,
 		startAngle: n,
 		endAngle: r
 	}) ?? "";
 }
-function Q(e) {
+function Z(e) {
 	return typeof e == "object" && !!e && typeof e.value == "number" && typeof e.color == "string";
 }
-function te(e) {
+function Q(e) {
 	let t = null;
 	if (Array.isArray(e)) t = e;
 	else if (typeof e == "string" && e.trim()) try {
@@ -212,19 +212,19 @@ function te(e) {
 	} catch (e) {
 		return console.warn("GaugeChart: invalid threshold JSON", e), [];
 	}
-	return t ? t.filter(Q) : [];
+	return t ? t.filter(Z) : [];
 }
-function ne(e) {
+function te(e) {
 	if (e.length === 0) return [];
 	let t = [...e].sort((e, t) => e.value - t.value);
 	return t.map((e, n) => ({
 		color: e.color,
-		start: n === 0 ? U : Y(t[n - 1].value, 0, 1),
-		end: Y(e.value, 0, 1)
+		start: n === 0 ? H : J(t[n - 1].value, 0, 1),
+		end: J(e.value, 0, 1)
 	}));
 }
-function re(e, t, n, r) {
-	let i = n === t ? t + 1 : n, a = J(e, t, i), o = (a - t) / (i - t), s = r.length > 0 ? X(o, r) : K, c = Y(a, t, i);
+function ne(e, t, n, r) {
+	let i = n === t ? t + 1 : n, a = q(e, t, i), o = (a - t) / (i - t), s = r.length > 0 ? Y(o, r) : G, c = J(a, t, i);
 	return {
 		effectiveMax: i,
 		clampedValue: a,
@@ -239,8 +239,8 @@ function $(e, t) {
 }
 //#endregion
 //#region src/client/components/charts/GaugeChart.tsx
-var ie = /* @__PURE__ */ e({ default: () => oe });
-function ae({ angle: e, radius: t }) {
+var re = /* @__PURE__ */ e({ default: () => ae });
+function ie({ angle: e, radius: t }) {
 	let n = t * .72, r = t * .06, i = Math.cos(e - Math.PI / 2) * n, a = Math.sin(e - Math.PI / 2) * n;
 	return /* @__PURE__ */ p("g", {
 		"data-testid": "gauge-needle",
@@ -260,7 +260,7 @@ function ae({ angle: e, radius: t }) {
 		})]
 	});
 }
-var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, height: m = "100%" }) {
+var ae = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, height: m = "100%" }) {
 	let { t: h } = t(), g = n(), _ = u(null), [v, y] = d({
 		width: 0,
 		height: 0
@@ -295,23 +295,23 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 			maxField: n,
 			configError: "Gauge requires at least 1 measure in Y-Axis (current value)"
 		};
-	}, [r]), C = l(() => te(s?.thresholds), [s?.thresholds]), w = ne(C);
+	}, [r]), C = l(() => Q(s?.thresholds), [s?.thresholds]), w = te(C);
 	try {
-		if (!e || e.length === 0) return /* @__PURE__ */ f(o, {
+		if (!e || e.length === 0) return /* @__PURE__ */ f(a, {
 			height: m,
 			hint: h("chart.runtime.noDataHint.gauge")
 		});
-		if (S) return /* @__PURE__ */ f(a, {
+		if (S) return /* @__PURE__ */ f(i, {
 			height: m,
 			hint: S
 		});
-		let t = e[0], n = q(t[b]);
-		if (n === null) return /* @__PURE__ */ f(o, {
+		let t = e[0], n = K(t[b]);
+		if (n === null) return /* @__PURE__ */ f(a, {
 			height: m,
 			titleKey: "chart.runtime.noValidData",
 			hint: h("chart.runtime.noValidDataHint.gauge")
 		});
-		let r = s?.minValue ?? 0, i = x ? q(t[x]) : null, { effectiveMax: c, fraction: l, fillColor: u, fillAngle: d, needleAngle: y } = re(n, r, s?.maxValue ?? i ?? 100, C), T = s?.showCenterLabel ?? !0, E = s?.showPercentage ?? !1, D = s?.leftYAxisFormat, O = v.width || 300, k = typeof m == "number" ? m : v.height || 200, A = Math.min(O / 2, k * .9) * .85, j = A, M = A * .6, N = O / 2, P = k * .7, F = Z(M, j, U, W), I = Z(M, j, U, d), L = E ? `${(l * 100).toFixed(1)}%` : $(n, D), R = g(b);
+		let r = s?.minValue ?? 0, o = x ? K(t[x]) : null, { effectiveMax: c, fraction: l, fillColor: u, fillAngle: d, needleAngle: y } = ne(n, r, s?.maxValue ?? o ?? 100, C), T = s?.showCenterLabel ?? !0, E = s?.showPercentage ?? !1, D = s?.leftYAxisFormat, O = v.width || 300, k = typeof m == "number" ? m : v.height || 200, A = Math.min(O / 2, k * .9) * .85, j = A, M = A * .6, N = O / 2, P = k * .7, F = X(M, j, H, U), I = X(M, j, H, d), L = E ? `${(l * 100).toFixed(1)}%` : $(n, D), R = g(b);
 		return /* @__PURE__ */ f("div", {
 			ref: _,
 			className: "dc:relative dc:w-full",
@@ -327,11 +327,11 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 					children: [
 						/* @__PURE__ */ f("path", {
 							d: F,
-							fill: G,
+							fill: W,
 							"data-testid": "gauge-track"
 						}),
 						w.map((e, t) => /* @__PURE__ */ f("path", {
-							d: Z(j + 4, j + 8, e.start, e.end),
+							d: X(j + 4, j + 8, e.start, e.end),
 							fill: e.color,
 							"data-testid": `gauge-band-${t}`
 						}, t)),
@@ -341,7 +341,7 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 							"data-testid": "gauge-fill",
 							"data-fraction": l.toFixed(4)
 						}),
-						/* @__PURE__ */ f(ae, {
+						/* @__PURE__ */ f(ie, {
 							angle: y,
 							radius: A
 						}),
@@ -366,8 +366,8 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 							})]
 						}),
 						/* @__PURE__ */ f("text", {
-							x: Math.cos(U - Math.PI / 2) * (j + 14),
-							y: Math.sin(U - Math.PI / 2) * (j + 14),
+							x: Math.cos(H - Math.PI / 2) * (j + 14),
+							y: Math.sin(H - Math.PI / 2) * (j + 14),
 							textAnchor: "middle",
 							fontSize: A * .12,
 							fill: "currentColor",
@@ -376,8 +376,8 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 							children: $(r, D)
 						}),
 						/* @__PURE__ */ f("text", {
-							x: Math.cos(W - Math.PI / 2) * (j + 14),
-							y: Math.sin(W - Math.PI / 2) * (j + 14),
+							x: Math.cos(U - Math.PI / 2) * (j + 14),
+							y: Math.sin(U - Math.PI / 2) * (j + 14),
 							textAnchor: "middle",
 							fontSize: A * .12,
 							fill: "currentColor",
@@ -390,7 +390,7 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 			})
 		});
 	} catch (e) {
-		return /* @__PURE__ */ f(i, {
+		return /* @__PURE__ */ f(o, {
 			height: m,
 			chartType: "Gauge Chart",
 			error: e
@@ -398,6 +398,6 @@ var oe = s.memo(function({ data: e, chartConfig: r, displayConfig: s = {}, heigh
 	}
 });
 //#endregion
-export { ie as t };
+export { re as t };
 
-//# sourceMappingURL=chart-gauge-DXQ4r3cb.js.map
+//# sourceMappingURL=chart-gauge-DHIGq3TH.js.map