drizzle-cube 0.4.52 → 0.5.0

package/dist/client/chunks/{chart-sankey-BOyxfG1Q.js → chart-sankey-WwkZAhLy.js}

@@ -1,28 +1,28 @@
 import { n as e } from "./rolldown-runtime-CCl2IeXn.js";
-import { n as t } from "./chart-activity-grid-DLktOINm.js";
-import n, { useEffect as r, useMemo as i, useRef as a, useState as o } from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { ResponsiveContainer as l, Sankey as u, Tooltip as d } from "recharts";
+import { k as t, n } from "./chart-activity-grid-CWT0gLv4.js";
+import r, { useEffect as i, useMemo as a, useRef as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { ResponsiveContainer as u, Sankey as d, Tooltip as f } from "recharts";
 //#region src/client/types/flow.ts
-function f(e) {
+function p(e) {
 	if (!e || typeof e != "object") return !1;
 	let t = e;
 	return Array.isArray(t.nodes) && Array.isArray(t.links) && (t.nodes.length === 0 || typeof t.nodes[0] == "object" && t.nodes[0] !== null && "id" in t.nodes[0]);
 }
-function p(e) {
+function m(e) {
 	return typeof e == "object" && !!e && "flow" in e && typeof e.flow == "object";
 }
 //#endregion
 //#region src/client/components/charts/SankeyChart.tsx
-var m = /* @__PURE__ */ e({ default: () => x }), h = {
+var h = /* @__PURE__ */ e({ default: () => S }), g = {
 	before: "#F97316",
 	start: "#3B82F6",
 	after: "#10B981"
 };
-function g(e, t) {
-	return t && t.length > 0 ? t[Math.abs(e) % t.length] : e < 0 ? h.before : e === 0 ? h.start : h.after;
-}
 function _(e, t) {
+	return t && t.length > 0 ? t[Math.abs(e) % t.length] : e < 0 ? g.before : e === 0 ? g.start : g.after;
+}
+function v(e, t) {
 	if (!e.nodes || e.nodes.length === 0) return null;
 	let n = /* @__PURE__ */ new Map();
 	return e.nodes.forEach((e, t) => {
@@ -30,7 +30,7 @@ function _(e, t) {
 	}), {
 		nodes: e.nodes.map((e) => ({
 			name: e.name,
-			fill: g(e.layer, t),
+			fill: _(e.layer, t),
 			layer: e.layer,
 			value: e.value
 		})),
@@ -44,16 +44,16 @@ function _(e, t) {
 		}).filter((e) => e !== null)
 	};
 }
-function v(e) {
+function y(e) {
 	if (!e || e.length === 0) return null;
-	if (f(e[0])) return e[0];
-	if (f(e)) return e;
+	if (p(e[0])) return e[0];
+	if (p(e)) return e;
 	let t = e;
 	return t.nodes && t.links ? t : null;
 }
-function y({ x: e, y: t, width: n, height: r, payload: i, containerWidth: a, showLabels: o = !0 }) {
-	let l = e > a / 2, u = l ? e - 6 : e + n + 6, d = l ? "end" : "start";
-	return /* @__PURE__ */ c("g", { children: [/* @__PURE__ */ s("rect", {
+function b({ x: e, y: t, width: n, height: r, payload: i, containerWidth: a, showLabels: o = !0 }) {
+	let s = e > a / 2, u = s ? e - 6 : e + n + 6, d = s ? "end" : "start";
+	return /* @__PURE__ */ l("g", { children: [/* @__PURE__ */ c("rect", {
 		x: e,
 		y: t,
 		width: n,
@@ -61,14 +61,14 @@ function y({ x: e, y: t, width: n, height: r, payload: i, containerWidth: a, sho
 		fill: i.fill,
 		rx: 2,
 		ry: 2
-	}), o && /* @__PURE__ */ c("text", {
+	}), o && /* @__PURE__ */ l("text", {
 		x: u,
 		y: t + r / 2,
 		textAnchor: d,
 		dominantBaseline: "middle",
 		className: "dc:text-xs dc:fill-dc-text",
 		style: { fontSize: 11 },
-		children: [i.name, i.value !== void 0 && /* @__PURE__ */ c("tspan", {
+		children: [i.name, i.value !== void 0 && /* @__PURE__ */ l("tspan", {
 			className: "dc:fill-dc-text-secondary",
 			dx: 4,
 			children: [
@@ -79,52 +79,52 @@ function y({ x: e, y: t, width: n, height: r, payload: i, containerWidth: a, sho
 		})]
 	})] });
 }
-function b({ active: e, payload: t }) {
+function x({ active: e, payload: t }) {
 	if (!e || !t || t.length === 0) return null;
 	let n = t[0].payload;
-	return n.source && n.target ? /* @__PURE__ */ c("div", {
+	return n.source && n.target ? /* @__PURE__ */ l("div", {
 		className: "bg-dc-surface dc:border border-dc-border dc:rounded-md dc:px-3 dc:py-2 dc:shadow-lg dc:text-sm",
-		children: [/* @__PURE__ */ c("div", {
+		children: [/* @__PURE__ */ l("div", {
 			className: "dc:font-medium text-dc-text",
 			children: [
 				n.source.name,
 				" → ",
 				n.target.name
 			]
-		}), /* @__PURE__ */ c("div", {
+		}), /* @__PURE__ */ l("div", {
 			className: "text-dc-text-secondary dc:mt-1",
-			children: [/* @__PURE__ */ s("span", {
+			children: [/* @__PURE__ */ c("span", {
 				className: "dc:font-medium",
 				children: n.value.toLocaleString()
 			}), " entities"]
 		})]
-	}) : /* @__PURE__ */ c("div", {
+	}) : /* @__PURE__ */ l("div", {
 		className: "bg-dc-surface dc:border border-dc-border dc:rounded-md dc:px-3 dc:py-2 dc:shadow-lg dc:text-sm",
-		children: [/* @__PURE__ */ s("div", {
+		children: [/* @__PURE__ */ c("div", {
 			className: "dc:font-medium text-dc-text",
 			children: n.name
-		}), n.value !== void 0 && /* @__PURE__ */ c("div", {
+		}), n.value !== void 0 && /* @__PURE__ */ l("div", {
 			className: "text-dc-text-secondary dc:mt-1",
-			children: [/* @__PURE__ */ s("span", {
+			children: [/* @__PURE__ */ c("span", {
 				className: "dc:font-medium",
 				children: n.value.toLocaleString()
 			}), " entities"]
 		})]
 	});
 }
-var x = n.memo(function({ data: e, height: n = "100%", colorPalette: f, displayConfig: p }) {
-	let m = a(null), [h, g] = o(800);
-	r(() => {
+var S = r.memo(function({ data: e, height: r = "100%", colorPalette: p, displayConfig: m }) {
+	let { t: h } = t(), g = o(null), [_, S] = s(800);
+	i(() => {
 		let e = () => {
-			m.current && g(m.current.offsetWidth);
+			g.current && S(g.current.offsetWidth);
 		};
 		return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
 	}, []);
-	let x = p, S = parseFloat(String(x?.linkOpacity || "0.5")), C = x?.nodeWidth ?? 10, w = x?.nodePadding ?? 50, T = x?.showNodeLabels !== !1, E = i(() => {
-		let n = v(e || []);
-		return n ? _(n, f?.colors || t) : null;
-	}, [e, f]), D = i(() => {
-		let t = v(e || []);
+	let C = m, w = parseFloat(String(C?.linkOpacity || "0.5")), T = C?.nodeWidth ?? 10, E = C?.nodePadding ?? 50, D = C?.showNodeLabels !== !1, O = a(() => {
+		let t = y(e || []);
+		return t ? v(t, p?.colors || n) : null;
+	}, [e, p]), k = a(() => {
+		let t = y(e || []);
 		if (!t) return null;
 		let n = t.nodes.filter((e) => e.layer === 0).reduce((e, t) => e + (t.value || 0), 0), r = t.links.reduce((e, t) => e + t.value, 0);
 		return {
@@ -134,32 +134,32 @@ var x = n.memo(function({ data: e, height: n = "100%", colorPalette: f, displayC
 			totalPaths: r
 		};
 	}, [e]);
-	return !e || e.length === 0 || !E || E.nodes.length === 0 ? /* @__PURE__ */ s("div", {
+	return !e || e.length === 0 || !O || O.nodes.length === 0 ? /* @__PURE__ */ c("div", {
 		className: "dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted",
-		style: { height: n },
-		children: /* @__PURE__ */ c("div", {
+		style: { height: r },
+		children: /* @__PURE__ */ l("div", {
 			className: "dc:text-center",
-			children: [/* @__PURE__ */ s("div", {
+			children: [/* @__PURE__ */ c("div", {
 				className: "dc:text-sm dc:font-semibold dc:mb-1",
-				children: "No flow data"
-			}), /* @__PURE__ */ s("div", {
+				children: h("chart.runtime.flow.noData")
+			}), /* @__PURE__ */ c("div", {
 				className: "dc:text-xs text-dc-text-secondary",
-				children: "Configure a flow analysis with a starting step and event dimension"
+				children: h("chart.runtime.noDataHint.flow")
 			})]
 		})
-	}) : /* @__PURE__ */ c("div", {
-		ref: m,
+	}) : /* @__PURE__ */ l("div", {
+		ref: g,
 		className: "dc:relative dc:w-full dc:h-full dc:flex dc:flex-col",
-		style: { height: n },
-		children: [/* @__PURE__ */ s("div", {
+		style: { height: r },
+		children: [/* @__PURE__ */ c("div", {
 			className: "dc:flex-1 dc:min-h-0",
-			children: /* @__PURE__ */ s(l, {
+			children: /* @__PURE__ */ c(u, {
 				width: "100%",
 				height: "100%",
-				children: /* @__PURE__ */ s(u, {
-					data: E,
-					nodeWidth: C,
-					nodePadding: w,
+				children: /* @__PURE__ */ c(d, {
+					data: O,
+					nodeWidth: T,
+					nodePadding: E,
 					margin: {
 						top: 20,
 						right: 20,
@@ -168,47 +168,47 @@ var x = n.memo(function({ data: e, height: n = "100%", colorPalette: f, displayC
 					},
 					link: {
 						stroke: "var(--dc-border)",
-						strokeOpacity: S
+						strokeOpacity: w
 					},
-					node: (e) => /* @__PURE__ */ s(y, {
+					node: (e) => /* @__PURE__ */ c(b, {
 						...e,
-						containerWidth: h,
-						showLabels: T
+						containerWidth: _,
+						showLabels: D
 					}),
-					children: /* @__PURE__ */ s(d, { content: /* @__PURE__ */ s(b, {}) })
+					children: /* @__PURE__ */ c(f, { content: /* @__PURE__ */ c(x, {}) })
 				})
 			})
-		}), !x?.hideSummaryFooter && D && /* @__PURE__ */ s("div", {
+		}), !C?.hideSummaryFooter && k && /* @__PURE__ */ c("div", {
 			className: "dc:flex-shrink-0 dc:px-4 dc:py-2 dc:border-t border-dc-border bg-dc-surface-secondary",
-			children: /* @__PURE__ */ c("div", {
+			children: /* @__PURE__ */ l("div", {
 				className: "dc:flex dc:items-center dc:justify-between dc:text-sm",
 				children: [
-					/* @__PURE__ */ c("div", {
+					/* @__PURE__ */ l("div", {
 						className: "text-dc-text-muted",
-						children: [/* @__PURE__ */ s("span", {
+						children: [/* @__PURE__ */ c("span", {
 							className: "dc:font-medium",
-							children: D.nodeCount
+							children: k.nodeCount
 						}), " events"]
 					}),
-					/* @__PURE__ */ c("div", {
+					/* @__PURE__ */ l("div", {
 						className: "text-dc-text",
 						children: [
-							/* @__PURE__ */ s("span", {
+							/* @__PURE__ */ c("span", {
 								className: "text-dc-text-muted",
-								children: "Paths:"
+								children: h("chart.runtime.flow.paths")
 							}),
 							" ",
-							/* @__PURE__ */ s("span", {
+							/* @__PURE__ */ c("span", {
 								className: "dc:font-medium",
-								children: D.linkCount
+								children: k.linkCount
 							})
 						]
 					}),
-					/* @__PURE__ */ c("div", {
+					/* @__PURE__ */ l("div", {
 						className: "text-dc-text-muted",
-						children: [/* @__PURE__ */ s("span", {
+						children: [/* @__PURE__ */ c("span", {
 							className: "dc:font-medium",
-							children: D.totalEntities.toLocaleString()
+							children: k.totalEntities.toLocaleString()
 						}), " starting entities"]
 					})
 				]
@@ -217,6 +217,6 @@ var x = n.memo(function({ data: e, height: n = "100%", colorPalette: f, displayC
 	});
 });
 //#endregion
-export { f as n, p as r, m as t };
+export { p as n, m as r, h as t };
 
-//# sourceMappingURL=chart-sankey-BOyxfG1Q.js.map
+//# sourceMappingURL=chart-sankey-WwkZAhLy.js.map

package/dist/client/chunks/chart-sankey-WwkZAhLy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-sankey-WwkZAhLy.js","names":[],"sources":["../../../src/client/types/flow.ts","../../../src/client/components/charts/SankeyChart.tsx"],"sourcesContent":["/**\n * Flow Analysis Types\n *\n * Types for Flow analysis mode which visualizes user journeys using Sankey diagrams.\n * Flow analysis explores paths BEFORE and AFTER a defined starting step (bidirectional),\n * unlike funnel which only tracks linear forward progression.\n */\n\nimport type { Filter } from '../types'\nimport type { FunnelBindingKey } from './funnel'\n\n// ============================================================================\n// Starting Step Definition\n// ============================================================================\n\n/**\n * Starting step definition for flow analysis\n * The starting step is the anchor point from which we explore paths\n * in both directions (before and after)\n */\nexport interface FlowStartingStep {\n  /** Display name for the starting step */\n  name: string\n  /** Filters that define which events qualify as the starting step */\n  filters: Filter[]\n}\n\n// ============================================================================\n// Server Query Format\n// ============================================================================\n\n/**\n * Server flow query format\n * This is the shape sent to the server for execution\n * Wrapped in { flow: {...} } similar to funnel queries\n */\nexport interface ServerFlowQuery {\n  flow: FlowQueryConfig\n}\n\n/**\n * Flow query configuration\n * Contains all parameters needed for server-side flow analysis\n */\nexport interface FlowQueryConfig {\n  /**\n   * Binding key that identifies individual entities (e.g., userId)\n   * Can be a single string like 'Events.userId' or array for multi-cube\n   */\n  bindingKey: string | { cube: string; dimension: string }[]\n\n  /**\n   * Time dimension used for ordering events\n   * Can be a single string like 'Events.timestamp' or array for multi-cube\n   */\n  timeDimension: string | { cube: string; dimension: string }[]\n\n  /**\n   * The starting step from which we explore paths\n   * Defines the anchor point for bidirectional flow analysis\n   */\n  startingStep: {\n    /** Display name for the starting step */\n    name: string\n    /** Filter(s) that identify events for this starting step */\n    filter?: Filter | Filter[]\n  }\n\n  /** Number of steps to explore BEFORE the starting step (0-5) */\n  stepsBefore: number\n\n  /** Number of steps to explore AFTER the starting step (0-5) */\n  stepsAfter: number\n\n  /**\n   * Event dimension that categorizes events (e.g., 'Events.eventType')\n   * This dimension's values become the node labels in the Sankey diagram\n   */\n  eventDimension: string\n\n  /**\n   * Optional limit on the number of entities to process\n   * Useful for performance on large datasets\n   */\n  entityLimit?: number\n\n  /**\n   * Output mode for flow data aggregation\n   * - 'sankey': Aggregate by (layer, event_type) - standard flow visualization where paths can converge\n   * - 'sunburst': Path-qualified nodes for hierarchical tree visualization where each path is unique\n   * @default 'sankey'\n   */\n  outputMode?: 'sankey' | 'sunburst'\n\n  /**\n   * Join strategy for fetching steps\n   * - 'auto' (default): use lateral when supported, otherwise window\n   * - 'lateral': force lateral joins\n   * - 'window': force window function strategy\n   */\n  joinStrategy: 'auto' | 'lateral' | 'window'\n}\n\n// ============================================================================\n// Sankey Result Types\n// ============================================================================\n\n/**\n * A node in the Sankey diagram\n * Represents an event type at a specific layer (distance from starting step)\n */\nexport interface SankeyNode {\n  /**\n   * Unique identifier for this node\n   * Format: \"before_{depth}_{eventType}\" or \"after_{depth}_{eventType}\" or \"start_{eventType}\"\n   * Examples: \"before_2_Signup\", \"start_Purchase\", \"after_1_Checkout\"\n   */\n  id: string\n\n  /** Display name (typically the event type value) */\n  name: string\n\n  /**\n   * Layer position in the Sankey diagram\n   * Negative for steps before starting step, 0 for starting step, positive for after\n   * Example: -2, -1, 0, 1, 2 for a flow with 2 steps before and 2 after\n   */\n  layer: number\n\n  /** Total count of entities passing through this node */\n  value?: number\n}\n\n/**\n * A link (edge) in the Sankey diagram\n * Represents a transition between two nodes\n */\nexport interface SankeyLink {\n  /** Source node ID */\n  source: string\n\n  /** Target node ID */\n  target: string\n\n  /** Count of entities that follow this path */\n  value: number\n}\n\n/**\n * Complete flow result row returned from server\n * Contains the full Sankey diagram data\n */\nexport interface FlowResultRow {\n  nodes: SankeyNode[]\n  links: SankeyLink[]\n}\n\n/**\n * Chart-ready flow data format\n * Same structure as FlowResultRow, used for chart components\n */\nexport interface FlowChartData {\n  nodes: SankeyNode[]\n  links: SankeyLink[]\n}\n\n// ============================================================================\n// Flow Slice State (for Zustand store)\n// ============================================================================\n\n/**\n * Flow mode state for the AnalysisBuilder store\n * Contains all UI state needed to configure a flow analysis\n */\nexport interface FlowSliceState {\n  /** Selected cube for flow analysis (must be an eventStream cube) */\n  flowCube: string | null\n\n  /** Binding key that identifies entities (reuses funnel binding key type) */\n  flowBindingKey: FunnelBindingKey | null\n\n  /** Time dimension for ordering events */\n  flowTimeDimension: string | null\n\n  /** Starting step configuration */\n  startingStep: FlowStartingStep\n\n  /** Number of steps to explore before starting step (0-5, default 3) */\n  stepsBefore: number\n\n  /** Number of steps to explore after starting step (0-5, default 3) */\n  stepsAfter: number\n\n  /** Event dimension that categorizes events */\n  eventDimension: string | null\n\n  /** Join strategy for flow execution */\n  joinStrategy: 'auto' | 'lateral' | 'window'\n}\n\n/**\n * Flow slice actions for the store\n */\nexport interface FlowSliceActions {\n  setFlowCube: (cube: string | null) => void\n  setFlowBindingKey: (key: FunnelBindingKey | null) => void\n  setFlowTimeDimension: (dim: string | null) => void\n  setEventDimension: (dim: string | null) => void\n  setStartingStepName: (name: string) => void\n  setStartingStepFilters: (filters: Filter[]) => void\n  addStartingStepFilter: (filter: Filter) => void\n  removeStartingStepFilter: (index: number) => void\n  updateStartingStepFilter: (index: number, filter: Filter) => void\n  setStepsBefore: (count: number) => void\n  setStepsAfter: (count: number) => void\n  setJoinStrategy: (strategy: 'auto' | 'lateral' | 'window') => void\n  isFlowMode: () => boolean\n  isFlowModeEnabled: () => boolean\n  buildFlowQuery: () => ServerFlowQuery | null\n}\n\n// ============================================================================\n// Type Guards\n// ============================================================================\n\n/**\n * Type guard to check if data is Sankey/Flow chart data\n */\nexport function isSankeyData(data: unknown): data is FlowChartData {\n  if (!data || typeof data !== 'object') return false\n  const d = data as Record<string, unknown>\n  return (\n    Array.isArray(d.nodes) &&\n    Array.isArray(d.links) &&\n    (d.nodes.length === 0 ||\n      (typeof d.nodes[0] === 'object' &&\n        d.nodes[0] !== null &&\n        'id' in d.nodes[0]))\n  )\n}\n\n/**\n * Type guard to detect server flow query format\n * Used to distinguish { flow: {...} } from CubeQuery, MultiQueryConfig, or ServerFunnelQuery\n */\nexport function isServerFlowQuery(obj: unknown): obj is ServerFlowQuery {\n  return (\n    typeof obj === 'object' &&\n    obj !== null &&\n    'flow' in obj &&\n    typeof (obj as { flow: unknown }).flow === 'object'\n  )\n}\n\n// ============================================================================\n// Default Values\n// ============================================================================\n\n/**\n * Default flow slice state for store initialization\n */\nexport const defaultFlowSliceState: FlowSliceState = {\n  flowCube: null,\n  flowBindingKey: null,\n  flowTimeDimension: null,\n  startingStep: {\n    name: '',\n    filters: [],\n  },\n  stepsBefore: 3,\n  stepsAfter: 3,\n  eventDimension: null,\n  joinStrategy: 'auto',\n}\n\n/**\n * Minimum and maximum values for step depth\n */\nexport const FLOW_MIN_DEPTH = 0\nexport const FLOW_MAX_DEPTH = 5\n","/**\n * SankeyChart Component\n *\n * Visualizes flow data using Sankey diagrams showing paths between states.\n * Works with data from flow queries which provide nodes and links.\n *\n * The chart displays:\n * - Nodes representing events at different layers (before, start, after)\n * - Links showing the flow of entities between adjacent nodes\n * - Values indicating count of entities following each path\n */\n\nimport React, { useMemo, useRef, useState, useEffect } from 'react'\nimport { useTranslation } from '../../hooks/useTranslation'\nimport { Sankey, Tooltip, ResponsiveContainer } from 'recharts'\nimport { CHART_COLORS } from '../../utils/chartConstants'\nimport type { ChartProps } from '../../types'\nimport type { FlowChartData } from '../../types/flow'\nimport { isSankeyData } from '../../types/flow'\n\n/**\n * Color palette for Sankey nodes based on layer\n */\nconst SANKEY_COLORS = {\n  before: '#F97316', // orange-500 - for steps before\n  start: '#3B82F6', // blue-500 - for starting step\n  after: '#10B981', // emerald-500 - for steps after\n}\n\n/**\n * Get color for a node based on its layer\n */\nfunction getNodeColor(layer: number, colorPalette?: string[]): string {\n  if (colorPalette && colorPalette.length > 0) {\n    // Use palette colors cycling through\n    const absLayer = Math.abs(layer)\n    return colorPalette[absLayer % colorPalette.length]\n  }\n\n  if (layer < 0) return SANKEY_COLORS.before\n  if (layer === 0) return SANKEY_COLORS.start\n  return SANKEY_COLORS.after\n}\n\n/**\n * Transform FlowChartData to Recharts Sankey format\n */\nfunction transformToRechartsFormat(\n  data: FlowChartData,\n  colorPalette?: string[]\n): {\n  nodes: Array<{ name: string; fill: string; layer: number; value?: number }>\n  links: Array<{ source: number; target: number; value: number }>\n} | null {\n  if (!data.nodes || data.nodes.length === 0) return null\n\n  // Create node index map for link resolution\n  const nodeIndexMap = new Map<string, number>()\n  data.nodes.forEach((node, index) => {\n    nodeIndexMap.set(node.id, index)\n  })\n\n  // Transform nodes\n  const nodes = data.nodes.map((node) => ({\n    name: node.name,\n    fill: getNodeColor(node.layer, colorPalette),\n    layer: node.layer,\n    value: node.value,\n  }))\n\n  // Transform links - resolve string IDs to numeric indices\n  const links = data.links\n    .map((link) => {\n      const sourceIndex = nodeIndexMap.get(link.source)\n      const targetIndex = nodeIndexMap.get(link.target)\n\n      if (sourceIndex === undefined || targetIndex === undefined) {\n        console.warn(`Sankey: Could not resolve link ${link.source} -> ${link.target}`)\n        return null\n      }\n\n      return {\n        source: sourceIndex,\n        target: targetIndex,\n        value: link.value,\n      }\n    })\n    .filter((link): link is { source: number; target: number; value: number } => link !== null)\n\n  return { nodes, links }\n}\n\n/**\n * Extract FlowChartData from various data formats\n */\nfunction extractFlowData(data: unknown[]): FlowChartData | null {\n  if (!data || data.length === 0) return null\n\n  // If first element is already FlowChartData (server returns as single-row array)\n  if (isSankeyData(data[0])) {\n    return data[0] as FlowChartData\n  }\n\n  // If data itself is FlowChartData shape\n  if (isSankeyData(data)) {\n    return data as unknown as FlowChartData\n  }\n\n  // Check if data is an array with nodes and links at top level\n  const asAny = data as unknown as Record<string, unknown>\n  if (asAny.nodes && asAny.links) {\n    return asAny as unknown as FlowChartData\n  }\n\n  return null\n}\n\n/**\n * Custom node renderer for Sankey chart\n * Displays the node rectangle with label and value\n */\nfunction SankeyNode({\n  x,\n  y,\n  width,\n  height,\n  payload,\n  containerWidth,\n  showLabels = true,\n}: {\n  x: number\n  y: number\n  width: number\n  height: number\n  payload: { name: string; value?: number; fill: string }\n  containerWidth: number\n  showLabels?: boolean\n}) {\n  // Determine if label should be on the left or right based on position\n  const isRightSide = x > containerWidth / 2\n  const labelX = isRightSide ? x - 6 : x + width + 6\n  const textAnchor = isRightSide ? 'end' : 'start'\n\n  return (\n    <g>\n      {/* Node rectangle */}\n      <rect\n        x={x}\n        y={y}\n        width={width}\n        height={height}\n        fill={payload.fill}\n        rx={2}\n        ry={2}\n      />\n      {/* Node label - only shown if showLabels is true */}\n      {showLabels && (\n        <text\n          x={labelX}\n          y={y + height / 2}\n          textAnchor={textAnchor}\n          dominantBaseline=\"middle\"\n          className=\"dc:text-xs dc:fill-dc-text\"\n          style={{ fontSize: 11 }}\n        >\n          {payload.name}\n          {payload.value !== undefined && (\n            <tspan className=\"dc:fill-dc-text-secondary\" dx={4}>\n              ({payload.value.toLocaleString()})\n            </tspan>\n          )}\n        </text>\n      )}\n    </g>\n  )\n}\n\n/**\n * Custom tooltip for Sankey chart\n */\nfunction SankeyTooltip({ active, payload }: {\n  active?: boolean\n  payload?: Array<{ payload: { name: string; value: number; source?: { name: string }; target?: { name: string } } }>\n}) {\n  if (!active || !payload || payload.length === 0) return null\n\n  const data = payload[0].payload\n\n  // Check if this is a link (has source/target) or a node\n  if (data.source && data.target) {\n    return (\n      <div className=\"bg-dc-surface dc:border border-dc-border dc:rounded-md dc:px-3 dc:py-2 dc:shadow-lg dc:text-sm\">\n        <div className=\"dc:font-medium text-dc-text\">\n          {data.source.name} → {data.target.name}\n        </div>\n        <div className=\"text-dc-text-secondary dc:mt-1\">\n          <span className=\"dc:font-medium\">{data.value.toLocaleString()}</span> entities\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"bg-dc-surface dc:border border-dc-border dc:rounded-md dc:px-3 dc:py-2 dc:shadow-lg dc:text-sm\">\n      <div className=\"dc:font-medium text-dc-text\">{data.name}</div>\n      {data.value !== undefined && (\n        <div className=\"text-dc-text-secondary dc:mt-1\">\n          <span className=\"dc:font-medium\">{data.value.toLocaleString()}</span> entities\n        </div>\n      )}\n    </div>\n  )\n}\n\n/**\n * SankeyChart Component\n *\n * Renders a Sankey diagram visualization from FlowChartData.\n * Shows flow paths with nodes at each layer and links between them.\n */\nconst SankeyChart = React.memo(function SankeyChart({\n  data,\n  height = '100%',\n  colorPalette,\n  displayConfig,\n}: ChartProps) {\n  const { t } = useTranslation()\n  // Track container width for label positioning\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [containerWidth, setContainerWidth] = useState(800)\n\n  useEffect(() => {\n    const updateWidth = () => {\n      if (containerRef.current) {\n        setContainerWidth(containerRef.current.offsetWidth)\n      }\n    }\n    updateWidth()\n    window.addEventListener('resize', updateWidth)\n    return () => window.removeEventListener('resize', updateWidth)\n  }, [])\n\n  // Get display config options\n  // Use custom properties from displayConfig if available, otherwise use defaults\n  const displayConfigAny = displayConfig as Record<string, unknown> | undefined\n  const linkOpacity = parseFloat(String(displayConfigAny?.linkOpacity || '0.5'))\n  const nodeWidth = (displayConfigAny?.nodeWidth as number) ?? 10\n  const nodePadding = (displayConfigAny?.nodePadding as number) ?? 50\n  const showNodeLabels = displayConfigAny?.showNodeLabels !== false // Default true\n\n  // Extract and transform data\n  const flowData = useMemo(() => {\n    const extracted = extractFlowData(data || [])\n    if (!extracted) return null\n\n    return transformToRechartsFormat(extracted, colorPalette?.colors || CHART_COLORS)\n  }, [data, colorPalette])\n\n  // Calculate summary stats\n  const summaryStats = useMemo(() => {\n    const extracted = extractFlowData(data || [])\n    if (!extracted) return null\n\n    const totalEntities = extracted.nodes\n      .filter((n) => n.layer === 0)\n      .reduce((sum, n) => sum + (n.value || 0), 0)\n\n    const totalPaths = extracted.links.reduce((sum, l) => sum + l.value, 0)\n\n    return {\n      nodeCount: extracted.nodes.length,\n      linkCount: extracted.links.length,\n      totalEntities,\n      totalPaths,\n    }\n  }, [data])\n\n  // Handle no data\n  if (!data || data.length === 0 || !flowData || flowData.nodes.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.flow.noData')}</div>\n          <div className=\"dc:text-xs text-dc-text-secondary\">\n            {t('chart.runtime.noDataHint.flow')}\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div ref={containerRef} className=\"dc:relative dc:w-full dc:h-full dc:flex dc:flex-col\" style={{ height }}>\n      {/* Sankey Diagram */}\n      <div className=\"dc:flex-1 dc:min-h-0\">\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <Sankey\n            data={flowData}\n            nodeWidth={nodeWidth}\n            nodePadding={nodePadding}\n            margin={{ top: 20, right: 20, bottom: 20, left: 20 }}\n            link={{\n              stroke: 'var(--dc-border)',\n              strokeOpacity: linkOpacity,\n            }}\n            node={(props: any) => (\n              <SankeyNode {...props} containerWidth={containerWidth} showLabels={showNodeLabels} />\n            )}\n          >\n            <Tooltip content={<SankeyTooltip />} />\n          </Sankey>\n        </ResponsiveContainer>\n      </div>\n\n      {/* Summary Footer */}\n      {!(displayConfigAny?.hideSummaryFooter) && summaryStats && (\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\">{summaryStats.nodeCount}</span> events\n            </div>\n            <div className=\"text-dc-text\">\n              <span className=\"text-dc-text-muted\">{t('chart.runtime.flow.paths')}</span>{' '}\n              <span className=\"dc:font-medium\">{summaryStats.linkCount}</span>\n            </div>\n            <div className=\"text-dc-text-muted\">\n              <span className=\"dc:font-medium\">{summaryStats.totalEntities.toLocaleString()}</span> starting entities\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  )\n})\n\nexport default SankeyChart\n"],"mappings":"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"}

package/dist/client/chunks/chart-scatter-D8krEYsA.js

@@ -0,0 +1,255 @@
+import { n as e } from "./rolldown-runtime-CCl2IeXn.js";
+import { S as t, T as n, _ as r, i, k as a, n as o, w as s, x as c, y as l } from "./chart-activity-grid-CWT0gLv4.js";
+import { l as u } from "./chart-area-D63kG8OT.js";
+import d, { useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { CartesianGrid as h, Legend as g, Scatter as _, ScatterChart as v, Tooltip as y, XAxis as b, YAxis as x } from "recharts";
+//#region src/client/components/charts/ScatterChart.tsx
+var S = /* @__PURE__ */ e({ default: () => C }), C = d.memo(function({ data: e, chartConfig: d, displayConfig: S = {}, queryObject: C, height: w = "100%", colorPalette: T }) {
+	let { t: E } = a(), [D, O] = f(null), k = r();
+	try {
+		let r = {
+			showLegend: S?.showLegend ?? !0,
+			showGrid: S?.showGrid ?? !0,
+			showTooltip: S?.showTooltip ?? !0
+		}, a = S?.xAxisFormat, f = S?.leftYAxisFormat;
+		if (!e || e.length === 0) return /* @__PURE__ */ p("div", {
+			className: "dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted",
+			style: { height: w },
+			children: /* @__PURE__ */ m("div", {
+				className: "dc:text-center",
+				children: [/* @__PURE__ */ p("div", {
+					className: "dc:text-sm dc:font-semibold dc:mb-1",
+					children: E("chart.runtime.noData")
+				}), /* @__PURE__ */ p("div", {
+					className: "dc:text-xs text-dc-text-secondary",
+					children: E("chart.runtime.noDataHint.scatter")
+				})]
+			})
+		});
+		let A, j, M = [];
+		if (d?.xAxis && d?.yAxis) {
+			A = Array.isArray(d.xAxis) ? d.xAxis[0] : d.xAxis, j = Array.isArray(d.yAxis) ? d.yAxis[0] : d.yAxis;
+			let e = d.series;
+			M = e ? Array.isArray(e) ? e : [e] : [];
+		} else if (d?.x && d?.y) A = d.x, j = Array.isArray(d.y) ? d.y[0] : d.y;
+		else return /* @__PURE__ */ p("div", {
+			className: "dc:flex dc:items-center dc:justify-center dc:w-full text-dc-warning",
+			style: { height: w },
+			children: /* @__PURE__ */ m("div", {
+				className: "dc:text-center",
+				children: [/* @__PURE__ */ p("div", {
+					className: "dc:text-sm dc:font-semibold dc:mb-1",
+					children: E("chart.runtime.configError")
+				}), /* @__PURE__ */ p("div", {
+					className: "dc:text-xs",
+					children: E("chart.runtime.configErrorHint.axisInvalid")
+				})]
+			})
+		});
+		if (!A || !j) return /* @__PURE__ */ p("div", {
+			className: "dc:flex dc:items-center dc:justify-center dc:w-full text-dc-warning",
+			style: { height: w },
+			children: /* @__PURE__ */ m("div", {
+				className: "dc:text-center",
+				children: [/* @__PURE__ */ p("div", {
+					className: "dc:text-sm dc:font-semibold dc:mb-1",
+					children: E("chart.runtime.configError")
+				}), /* @__PURE__ */ p("div", {
+					className: "dc:text-xs",
+					children: E("chart.runtime.configErrorHint.axisFields")
+				})]
+			})
+		});
+		let N = (C?.timeDimensions || []).map((e) => e.dimension), P, F = {};
+		if (M.length > 0) {
+			let r = M[0];
+			e.forEach((e) => {
+				let i = String(e[r] || "Default");
+				F[i] || (F[i] = []);
+				let a = t(C, A), o = c(e[A], a) || e[A], l = n(e[j]), u = typeof o == "string" ? parseFloat(o) : o;
+				if (s(u) && l !== null) {
+					let n = {};
+					N.forEach((r) => {
+						if (e[r]) {
+							let i = t(C, r);
+							n[r] = c(e[r], i);
+						}
+					}), F[i].push({
+						x: u,
+						y: l,
+						name: i,
+						timeValues: n,
+						originalItem: e
+					});
+				}
+			}), P = Object.keys(F).flatMap((e) => F[e]);
+		} else {
+			let r = t(C, A);
+			P = e.map((e) => {
+				let i = c(e[A], r) || e[A], a = n(e[j]), o = typeof i == "string" ? parseFloat(i) : i, l = {};
+				return N.forEach((n) => {
+					if (e[n]) {
+						let r = t(C, n);
+						l[n] = c(e[n], r);
+					}
+				}), {
+					x: o,
+					y: a,
+					name: "Point",
+					timeValues: l,
+					originalItem: e,
+					isValid: s(o) && a !== null
+				};
+			}).filter((e) => e.isValid);
+		}
+		if (!P || P.length === 0) return /* @__PURE__ */ p("div", {
+			className: "dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted",
+			style: { height: w },
+			children: /* @__PURE__ */ m("div", {
+				className: "dc:text-center",
+				children: [/* @__PURE__ */ p("div", {
+					className: "dc:text-sm dc:font-semibold dc:mb-1",
+					children: E("chart.runtime.noValidData")
+				}), /* @__PURE__ */ p("div", {
+					className: "dc:text-xs text-dc-text-secondary",
+					children: "No valid data points for scatter chart after transformation"
+				})]
+			})
+		});
+		let I = Object.keys(F), L = I.length > 1 && I.length <= 20, R = r.showLegend && L;
+		return /* @__PURE__ */ p(u, {
+			height: w,
+			children: /* @__PURE__ */ m(v, {
+				margin: {
+					...i,
+					left: 40
+				},
+				accessibilityLayer: !1,
+				children: [
+					r.showGrid && /* @__PURE__ */ p(h, { strokeDasharray: "3 3" }),
+					/* @__PURE__ */ p(b, {
+						type: "number",
+						dataKey: "x",
+						name: a?.label || k(A),
+						tick: { fontSize: 12 },
+						tickFormatter: a ? (e) => l(e, a) : void 0
+					}),
+					/* @__PURE__ */ p(x, {
+						type: "number",
+						dataKey: "y",
+						name: f?.label || k(j),
+						tick: { fontSize: 12 },
+						tickFormatter: f ? (e) => l(e, f) : void 0,
+						label: {
+							value: f?.label || k(j),
+							angle: -90,
+							position: "left",
+							style: {
+								textAnchor: "middle",
+								fontSize: "12px"
+							}
+						}
+					}),
+					r.showTooltip && /* @__PURE__ */ p(y, {
+						cursor: { strokeDasharray: "3 3" },
+						content: ({ active: e, payload: t }) => {
+							if (!e || !t || t.length === 0) return null;
+							let n = t[0]?.payload;
+							return n ? /* @__PURE__ */ m("div", {
+								style: {
+									backgroundColor: "white",
+									border: "1px solid #e5e7eb",
+									borderRadius: "0.5rem",
+									fontSize: "0.875rem",
+									color: "#1f2937",
+									boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1)",
+									padding: "8px 12px"
+								},
+								children: [
+									/* @__PURE__ */ p("div", {
+										style: {
+											fontWeight: 600,
+											marginBottom: "4px"
+										},
+										children: n.name
+									}),
+									n.timeValues && Object.keys(n.timeValues).length > 0 && /* @__PURE__ */ p("div", {
+										style: {
+											marginBottom: "4px",
+											color: "#6b7280"
+										},
+										children: Object.entries(n.timeValues).map(([e, t]) => /* @__PURE__ */ m("div", { children: [
+											k(e),
+											": ",
+											t
+										] }, e))
+									}),
+									/* @__PURE__ */ m("div", { children: [
+										a?.label || k(A),
+										": ",
+										l(n.x, a)
+									] }),
+									/* @__PURE__ */ m("div", { children: [
+										f?.label || k(j),
+										": ",
+										l(n.y, f)
+									] })
+								]
+							}) : null;
+						}
+					}),
+					R && /* @__PURE__ */ p(g, {
+						wrapperStyle: {
+							fontSize: "12px",
+							paddingTop: "10px"
+						},
+						iconType: "circle",
+						iconSize: 8,
+						layout: "horizontal",
+						align: "center",
+						verticalAlign: "bottom",
+						onMouseEnter: (e) => O(String(e.dataKey || "")),
+						onMouseLeave: () => O(null)
+					}),
+					L ? I.map((e, t) => /* @__PURE__ */ p(_, {
+						name: e,
+						data: F[e],
+						fill: T?.colors && T.colors[t % T.colors.length] || o[t % o.length],
+						fillOpacity: D ? D === e ? 1 : .3 : 1
+					}, e)) : /* @__PURE__ */ p(_, {
+						name: "Data",
+						data: P,
+						fill: T?.colors && T.colors[0] || o[0]
+					})
+				]
+			})
+		});
+	} catch (e) {
+		return /* @__PURE__ */ p("div", {
+			className: "dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full text-dc-error dc:p-4",
+			style: { height: w },
+			children: /* @__PURE__ */ m("div", {
+				className: "dc:text-center",
+				children: [
+					/* @__PURE__ */ p("div", {
+						className: "dc:text-sm dc:font-semibold dc:mb-1",
+						children: E("chart.runtime.chartError", { chartType: "Scatter Chart" })
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "dc:text-xs dc:mb-2",
+						children: e instanceof Error ? e.message : E("chart.runtime.unknownError")
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "dc:text-xs text-dc-text-muted",
+						children: E("chart.runtime.checkConfig")
+					})
+				]
+			})
+		});
+	}
+});
+//#endregion
+export { S as n, C as t };
+
+//# sourceMappingURL=chart-scatter-D8krEYsA.js.map

package/dist/client/chunks/chart-scatter-D8krEYsA.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-scatter-D8krEYsA.js","names":[],"sources":["../../../src/client/components/charts/ScatterChart.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { useTranslation } from '../../hooks/useTranslation'\nimport { ScatterChart as RechartsScatterChart, Scatter, XAxis, YAxis, CartesianGrid, Legend, Tooltip } from 'recharts'\nimport ChartContainer from './ChartContainer'\nimport { CHART_COLORS, CHART_MARGINS } from '../../utils/chartConstants'\nimport { formatTimeValue, getFieldGranularity, parseNumericValue, isValidNumericValue, formatAxisValue } from '../../utils/chartUtils'\nimport { useCubeFieldLabel } from '../../hooks/useCubeFieldLabel'\nimport type { ChartProps } from '../../types'\n\nconst ScatterChart = React.memo(function ScatterChart({\n  data,\n  chartConfig,\n  displayConfig = {},\n  queryObject,\n  height = \"100%\",\n  colorPalette\n}: ChartProps) {\n  const { t } = useTranslation()\n  const [hoveredLegend, setHoveredLegend] = useState<string | null>(null)\n  // Use specialized hook to avoid re-renders from unrelated context changes\n  const getFieldLabel = useCubeFieldLabel()\n  \n  try {\n    const safeDisplayConfig = {\n      showLegend: displayConfig?.showLegend ?? true,\n      showGrid: displayConfig?.showGrid ?? true,\n      showTooltip: displayConfig?.showTooltip ?? true\n    }\n\n    // Extract axis format configs\n    // For scatter charts, xAxis uses xAxisFormat, yAxis uses leftYAxisFormat\n    const xAxisFormat = displayConfig?.xAxisFormat\n    const yAxisFormat = displayConfig?.leftYAxisFormat\n\n    if (!data || data.length === 0) {\n      return (\n        <div className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\" style={{ height }}>\n          <div className=\"dc:text-center\">\n            <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">{t('chart.runtime.noData')}</div>\n            <div className=\"dc:text-xs text-dc-text-secondary\">{t('chart.runtime.noDataHint.scatter')}</div>\n          </div>\n        </div>\n      )\n    }\n\n    // Validate chartConfig - support both legacy and new formats\n    let xAxisField: string\n    let yAxisField: string\n    let seriesFields: string[] = []\n    \n    if (chartConfig?.xAxis && chartConfig?.yAxis) {\n      // New format - handle both string and array values\n      xAxisField = Array.isArray(chartConfig.xAxis) ? chartConfig.xAxis[0] : chartConfig.xAxis\n      yAxisField = Array.isArray(chartConfig.yAxis) ? chartConfig.yAxis[0] : chartConfig.yAxis\n      // Normalize series to array\n      const seriesConfig = chartConfig.series\n      seriesFields = seriesConfig ? (Array.isArray(seriesConfig) ? seriesConfig : [seriesConfig]) : []\n    } else if (chartConfig?.x && chartConfig?.y) {\n      // Legacy format (adapt for scatter chart)\n      xAxisField = chartConfig.x\n      yAxisField = Array.isArray(chartConfig.y) ? chartConfig.y[0] : chartConfig.y\n    } else {\n      return (\n        <div className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-warning\" style={{ height }}>\n          <div className=\"dc:text-center\">\n            <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">{t('chart.runtime.configError')}</div>\n            <div className=\"dc:text-xs\">{t('chart.runtime.configErrorHint.axisInvalid')}</div>\n          </div>\n        </div>\n      )\n    }\n\n    if (!xAxisField || !yAxisField) {\n      return (\n        <div className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-warning\" style={{ height }}>\n          <div className=\"dc:text-center\">\n            <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">{t('chart.runtime.configError')}</div>\n            <div className=\"dc:text-xs\">{t('chart.runtime.configErrorHint.axisFields')}</div>\n          </div>\n        </div>\n      )\n    }\n\n    // Extract time dimensions from query for tooltip display\n    const timeDimensions = queryObject?.timeDimensions || []\n    const timeDimensionFields = timeDimensions.map((td: any) => td.dimension)\n\n    // Transform data for scatter plot\n    // Null handling: Filter out data points where x or y coordinates are null\n    let scatterData: any[]\n    let seriesGroups: { [key: string]: any[] } = {}\n\n    if (seriesFields.length > 0) {\n      // Group data by series field\n      const seriesField = seriesFields[0]\n      data.forEach(item => {\n        const seriesValue = String(item[seriesField] || 'Default')\n        if (!seriesGroups[seriesValue]) {\n          seriesGroups[seriesValue] = []\n        }\n\n        const xGranularity = getFieldGranularity(queryObject, xAxisField)\n        const xValue = formatTimeValue(item[xAxisField], xGranularity) || item[xAxisField]\n        const yValue = parseNumericValue(item[yAxisField])\n\n        // Only add point if both x and y are valid numbers\n        const xNum = typeof xValue === 'string' ? parseFloat(xValue) : xValue\n        if (isValidNumericValue(xNum) && yValue !== null) {\n          // Extract time dimension values for tooltip\n          const timeValues: { [key: string]: string } = {}\n          timeDimensionFields.forEach((field: string) => {\n            if (item[field]) {\n              const granularity = getFieldGranularity(queryObject, field)\n              timeValues[field] = formatTimeValue(item[field], granularity)\n            }\n          })\n\n          seriesGroups[seriesValue].push({\n            x: xNum,\n            y: yValue,\n            name: seriesValue,\n            timeValues,\n            originalItem: item\n          })\n        }\n      })\n\n      // Collect all valid points from all series for validation\n      // (The actual rendering uses seriesGroups with series separated)\n      const seriesKeys = Object.keys(seriesGroups)\n      scatterData = seriesKeys.flatMap(key => seriesGroups[key])\n    } else {\n      // Single series scatter plot\n      const xGranularity = getFieldGranularity(queryObject, xAxisField)\n      scatterData = data\n        .map(item => {\n          const xValue = formatTimeValue(item[xAxisField], xGranularity) || item[xAxisField]\n          const yValue = parseNumericValue(item[yAxisField])\n          const xNum = typeof xValue === 'string' ? parseFloat(xValue) : xValue\n\n          // Extract time dimension values for tooltip\n          const timeValues: { [key: string]: string } = {}\n          timeDimensionFields.forEach((field: string) => {\n            if (item[field]) {\n              const granularity = getFieldGranularity(queryObject, field)\n              timeValues[field] = formatTimeValue(item[field], granularity)\n            }\n          })\n\n          return {\n            x: xNum,\n            y: yValue,\n            name: `Point`,\n            timeValues,\n            originalItem: item,\n            isValid: isValidNumericValue(xNum) && yValue !== null\n          }\n        })\n        .filter(point => point.isValid)\n    }\n    \n    // Validate transformed data\n    if (!scatterData || scatterData.length === 0) {\n      return (\n        <div className=\"dc:flex dc:items-center dc:justify-center dc:w-full text-dc-text-muted\" style={{ height }}>\n          <div className=\"dc:text-center\">\n            <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">{t('chart.runtime.noValidData')}</div>\n            <div className=\"dc:text-xs text-dc-text-secondary\">No valid data points for scatter chart after transformation</div>\n          </div>\n        </div>\n      )\n    }\n\n    const seriesKeys = Object.keys(seriesGroups)\n    // Limit series to prevent performance issues with high-cardinality fields (e.g., dates)\n    // If more than 20 unique series, fall back to single-series mode\n    const MAX_SERIES = 20\n    const hasSeries = seriesKeys.length > 1 && seriesKeys.length <= MAX_SERIES\n    \n    // Determine if legend will be shown\n    const showLegend = safeDisplayConfig.showLegend && hasSeries\n    \n    // Use custom chart margins with extra left space for Y-axis label\n    const chartMargins = {\n      ...CHART_MARGINS,\n      left: 40 // Increased from 20 to 40 for Y-axis label space\n    }\n\n    return (\n      <ChartContainer height={height}>\n        <RechartsScatterChart margin={chartMargins} accessibilityLayer={false}>\n          {safeDisplayConfig.showGrid && (\n            <CartesianGrid strokeDasharray=\"3 3\" />\n          )}\n          <XAxis\n            type=\"number\"\n            dataKey=\"x\"\n            name={xAxisFormat?.label || getFieldLabel(xAxisField)}\n            tick={{ fontSize: 12 }}\n            tickFormatter={xAxisFormat ? (value) => formatAxisValue(value, xAxisFormat) : undefined}\n          />\n          <YAxis\n            type=\"number\"\n            dataKey=\"y\"\n            name={yAxisFormat?.label || getFieldLabel(yAxisField)}\n            tick={{ fontSize: 12 }}\n            tickFormatter={yAxisFormat ? (value) => formatAxisValue(value, yAxisFormat) : undefined}\n            label={{ value: yAxisFormat?.label || getFieldLabel(yAxisField), angle: -90, position: 'left', style: { textAnchor: 'middle', fontSize: '12px' } }}\n          />\n          {safeDisplayConfig.showTooltip && (\n            <Tooltip\n              cursor={{ strokeDasharray: '3 3' }}\n              content={({ active, payload }) => {\n                if (!active || !payload || payload.length === 0) return null\n                // Only show the first (active) point\n                const point = payload[0]?.payload\n                if (!point) return null\n\n                return (\n                  <div style={{\n                    backgroundColor: 'white',\n                    border: '1px solid #e5e7eb',\n                    borderRadius: '0.5rem',\n                    fontSize: '0.875rem',\n                    color: '#1f2937',\n                    boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.1)',\n                    padding: '8px 12px'\n                  }}>\n                    <div style={{ fontWeight: 600, marginBottom: '4px' }}>{point.name}</div>\n                    {/* Show time dimension values if present */}\n                    {point.timeValues && Object.keys(point.timeValues).length > 0 && (\n                      <div style={{ marginBottom: '4px', color: '#6b7280' }}>\n                        {Object.entries(point.timeValues).map(([field, value]) => (\n                          <div key={field}>{getFieldLabel(field)}: {value as string}</div>\n                        ))}\n                      </div>\n                    )}\n                    <div>{xAxisFormat?.label || getFieldLabel(xAxisField)}: {formatAxisValue(point.x, xAxisFormat)}</div>\n                    <div>{yAxisFormat?.label || getFieldLabel(yAxisField)}: {formatAxisValue(point.y, yAxisFormat)}</div>\n                  </div>\n                )\n              }}\n            />\n          )}\n          {showLegend && (\n            <Legend \n              wrapperStyle={{ fontSize: '12px', paddingTop: '10px' }}\n              iconType=\"circle\"\n              iconSize={8}\n              layout=\"horizontal\"\n              align=\"center\"\n              verticalAlign=\"bottom\"\n              onMouseEnter={(o) => setHoveredLegend(String(o.dataKey || ''))}\n              onMouseLeave={() => setHoveredLegend(null)}\n            />\n          )}\n          {hasSeries ? (\n            // Multiple series\n            seriesKeys.map((seriesKey, index) => (\n              <Scatter\n                key={seriesKey}\n                name={seriesKey}\n                data={seriesGroups[seriesKey]}\n                fill={(colorPalette?.colors && colorPalette.colors[index % colorPalette.colors.length]) || CHART_COLORS[index % CHART_COLORS.length]}\n                fillOpacity={hoveredLegend ? (hoveredLegend === seriesKey ? 1 : 0.3) : 1}\n              />\n            ))\n          ) : (\n            // Single series\n            <Scatter\n              name=\"Data\"\n              data={scatterData}\n              fill={(colorPalette?.colors && colorPalette.colors[0]) || CHART_COLORS[0]}\n            />\n          )}\n        </RechartsScatterChart>\n      </ChartContainer>\n    )\n  } catch (error) {\n    // 'ScatterChart rendering error\n    return (\n      <div className=\"dc:flex dc:flex-col dc:items-center dc:justify-center dc:w-full text-dc-error dc:p-4\" style={{ height }}>\n        <div className=\"dc:text-center\">\n          <div className=\"dc:text-sm dc:font-semibold dc:mb-1\">{t('chart.runtime.chartError', { chartType: 'Scatter Chart' })}</div>\n          <div className=\"dc:text-xs dc:mb-2\">{error instanceof Error ? error.message : t('chart.runtime.unknownError')}</div>\n          <div className=\"dc:text-xs text-dc-text-muted\">{t('chart.runtime.checkConfig')}</div>\n        </div>\n      </div>\n    )\n  }\n})\n\nexport default ScatterChart"],"mappings":"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"}