@burdenoff/microfe-bigconsole 2026.613.2 → 2026.613.4

package/dist/bigconsole/components/widgets/chart/ChartWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/chart/ChartWidget.tsx"],"sourcesContent":["/**\n * ChartWidget Component\n *\n * Wrapper component that renders the appropriate chart type.\n */\n\nimport { type FC, memo, useState, useMemo, useCallback } from 'react';\nimport type { Widget, ChartConfig as WidgetChartConfig } from '../../../types';\nimport { LineChart } from './charts/LineChart';\nimport { BarChart } from './charts/BarChart';\nimport { AreaChart } from './charts/AreaChart';\nimport { PieChart } from './charts/PieChart';\nimport { FunnelChart } from './charts/FunnelChart';\nimport { ChartLegend, type LegendItem } from './ChartLegend';\nimport type { ChartConfig, ChartData, ChartType, CurveType } from './charts/types';\n// Phase 2: Cross-filtering support\nimport { useWidgetCrossFilter, useCrossFilterContext } from '../../../contexts';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ChartWidgetProps {\n  /** Widget configuration */\n  widget: Widget;\n  /** Chart data */\n  data?: ChartData[];\n  /** Click handler for drilldown */\n  onClick?: (dataPoint: ChartData, index: number) => void;\n  /** Drilldown handler - receives selected data point */\n  onDrilldown?: (selectedData: Record<string, unknown>) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ChartWidget: FC<ChartWidgetProps> = memo(function ChartWidget({\n  widget,\n  data = [],\n  onClick,\n  onDrilldown,\n}) {\n  const widgetConfig = widget.config as unknown as WidgetChartConfig | undefined;\n  const [hiddenSeries, setHiddenSeries] = useState<string[]>([]);\n\n  // Phase 2: Cross-filtering support\n  const { handleDataClick: triggerCrossFilter, enabled: crossFilterEnabled } = useWidgetCrossFilter(\n    widget.id,\n    // Map chart data fields to filter IDs\n    widgetConfig?.crossFilterMappings || [\n      { sourceField: widgetConfig?.labelField || 'name', targetFilterId: 'category' },\n    ]\n  );\n  const { clearAllCrossFilters, hasCrossFilters } = useCrossFilterContext();\n\n  // Normalize widget config to chart config\n  const chartConfig: ChartConfig = useMemo(\n    () =>\n      ({\n        type: (widgetConfig?.chartType?.toLowerCase() || 'line') as ChartType,\n        xAxisKey: widgetConfig?.xAxisField || 'name',\n        xAxisLabel: widgetConfig?.xAxisLabel,\n        yAxisLabel: widgetConfig?.yAxisLabel,\n        showGrid: widgetConfig?.showGrid,\n        showLegend: widgetConfig?.showLegend,\n        legendPosition: widgetConfig?.legendPosition,\n        showDots: widgetConfig?.showDataPoints,\n        curveType: widgetConfig?.curveType as CurveType | undefined,\n        colors: widgetConfig?.colors,\n        seriesNames: widgetConfig?.seriesLabels,\n        stacked: widgetConfig?.stacked,\n        isDonut: widgetConfig?.showAsDonut,\n        innerRadius: widgetConfig?.innerRadius,\n        outerRadius: widgetConfig?.outerRadius,\n      }) as ChartConfig,\n    [widgetConfig]\n  );\n\n  // Extract legend items for cartesian charts\n  const legendItems: LegendItem[] = useMemo(() => {\n    if (!data.length) return [];\n\n    // For pie/funnel charts, legend is handled internally\n    if (chartConfig.type === 'pie' || chartConfig.type === 'funnel') {\n      return [];\n    }\n\n    // Get selected fields from widget config (if specified)\n    const selectedFields = widgetConfig?.selectedFields as string[] | undefined;\n\n    // Filter to numeric fields, and apply selectedFields filter if configured\n    const keys = Object.keys(data[0]).filter((key) => {\n      // Must not be the x-axis key and must be numeric\n      const isValidNumericField = key !== chartConfig.xAxisKey && typeof data[0][key] === 'number';\n\n      // If selectedFields is configured and not empty, only include those fields\n      if (selectedFields && selectedFields.length > 0) {\n        return isValidNumericField && selectedFields.includes(key);\n      }\n\n      // Otherwise, show all numeric fields\n      return isValidNumericField;\n    });\n\n    return keys.map((key, index) => ({\n      dataKey: key,\n      name: chartConfig.seriesNames?.[key] || key,\n      color: chartConfig.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length],\n      hidden: hiddenSeries.includes(key),\n    }));\n  }, [data, chartConfig, hiddenSeries, widgetConfig?.selectedFields]);\n\n  // Toggle series visibility\n  const handleLegendClick = useCallback((dataKey: string) => {\n    setHiddenSeries((prev) => (prev.includes(dataKey) ? prev.filter((k) => k !== dataKey) : [...prev, dataKey]));\n  }, []);\n\n  // Handle data point click\n  // Clicking a bar/slice triggers BOTH cross-filtering AND drilldown:\n  //   1. Cross-filter: highlights the clicked item across all widgets\n  //   2. Drilldown: opens the detail modal/page for the clicked item\n  const handleDataClick = useCallback(\n    (dataPoint: ChartData, index: number) => {\n      // Trigger cross-filtering on data click when enabled\n      if (crossFilterEnabled) {\n        const label = dataPoint[widgetConfig?.labelField || 'name'] as string;\n        triggerCrossFilter(dataPoint as Record<string, unknown>, label);\n      }\n\n      // Trigger drilldown if configured\n      if (onDrilldown) {\n        onDrilldown(dataPoint as Record<string, unknown>);\n      } else if (onClick && widget.drilldowns?.length) {\n        onClick(dataPoint, index);\n      }\n    },\n    [onClick, onDrilldown, widget.drilldowns, crossFilterEnabled, triggerCrossFilter, widgetConfig?.labelField]\n  );\n\n  // Render the appropriate chart\n  const renderChart = () => {\n    switch (chartConfig.type) {\n      case 'bar':\n        return <BarChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n\n      case 'area':\n        return <AreaChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n\n      case 'pie':\n        return (\n          <PieChart\n            data={data}\n            config={chartConfig}\n            dataKey={widgetConfig?.valueField || 'value'}\n            nameKey={widgetConfig?.labelField || 'name'}\n            onDataClick={handleDataClick}\n          />\n        );\n\n      case 'funnel':\n        return (\n          <FunnelChart\n            data={data}\n            config={chartConfig}\n            dataKey={widgetConfig?.valueField || 'value'}\n            nameKey={widgetConfig?.labelField || 'name'}\n            onDataClick={handleDataClick}\n          />\n        );\n\n      case 'line':\n      default:\n        return <LineChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n    }\n  };\n\n  return (\n    <div className=\"flex flex-col h-full p-4\">\n      {/* Cross-filter active indicator with clear button */}\n      {hasCrossFilters && (\n        <div className=\"flex items-center gap-2 mb-2 -mt-1\">\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              clearAllCrossFilters();\n            }}\n            className=\"\n              inline-flex items-center gap-1.5\n              px-2.5 py-1 rounded-md\n              text-xs font-medium\n              bg-action-primary-bg/10 text-action-primary-text\n              hover:bg-action-primary-bg/20\n              transition-colors\n            \"\n          >\n            <svg className=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M10 19l-7-7m0 0l7-7m-7 7h18\" />\n            </svg>\n            Clear Filter\n          </button>\n        </div>\n      )}\n\n      {/* Custom legend (for line/bar/area charts with external legend) */}\n      {chartConfig.legendPosition === 'top' && legendItems.length > 0 && (\n        <ChartLegend items={legendItems} position=\"top\" onItemClick={handleLegendClick} />\n      )}\n\n      {/* Chart container */}\n      <div className=\"flex-1 min-h-0\">{renderChart()}</div>\n\n      {/* Custom legend (bottom) */}\n      {chartConfig.legendPosition === 'bottom' && legendItems.length > 0 && (\n        <ChartLegend items={legendItems} position=\"bottom\" onItemClick={handleLegendClick} />\n      )}\n    </div>\n  );\n});\n\nexport default ChartWidget;\n"],"mappings":"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"}
+{"version":3,"file":"ChartWidget.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/chart/ChartWidget.tsx"],"sourcesContent":["/**\n * ChartWidget Component\n *\n * Wrapper component that renders the appropriate chart type.\n */\n\nimport { type FC, memo, useState, useMemo, useCallback } from 'react';\nimport type { Widget, ChartConfig as WidgetChartConfig } from '../../../types';\nimport { LineChart } from './charts/LineChart';\nimport { BarChart } from './charts/BarChart';\nimport { AreaChart } from './charts/AreaChart';\nimport { PieChart } from './charts/PieChart';\nimport { FunnelChart } from './charts/FunnelChart';\nimport { ComboChart } from './charts/ComboChart';\nimport { WaterfallChart } from './charts/WaterfallChart';\nimport { ScatterChart } from './charts/ScatterChart';\nimport { ChartLegend, type LegendItem } from './ChartLegend';\nimport type { ChartConfig, ChartData, ChartType, CurveType, ReferenceLineConfig, SeriesConfig } from './charts/types';\n// Phase 2: Cross-filtering support\nimport { useWidgetCrossFilter, useCrossFilterContext } from '../../../contexts';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ChartWidgetProps {\n  /** Widget configuration */\n  widget: Widget;\n  /** Chart data */\n  data?: ChartData[];\n  /** Click handler for drilldown */\n  onClick?: (dataPoint: ChartData, index: number) => void;\n  /** Drilldown handler - receives selected data point */\n  onDrilldown?: (selectedData: Record<string, unknown>) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ChartWidget: FC<ChartWidgetProps> = memo(function ChartWidget({\n  widget,\n  data = [],\n  onClick,\n  onDrilldown,\n}) {\n  const widgetConfig = widget.config as unknown as WidgetChartConfig | undefined;\n  const [hiddenSeries, setHiddenSeries] = useState<string[]>([]);\n\n  // Phase 2: Cross-filtering support\n  const { handleDataClick: triggerCrossFilter, enabled: crossFilterEnabled } = useWidgetCrossFilter(\n    widget.id,\n    // Map chart data fields to filter IDs\n    widgetConfig?.crossFilterMappings || [\n      { sourceField: widgetConfig?.labelField || 'name', targetFilterId: 'category' },\n    ]\n  );\n  const { clearAllCrossFilters, hasCrossFilters } = useCrossFilterContext();\n\n  // Normalize widget config to chart config\n  const chartConfig: ChartConfig = useMemo(\n    () =>\n      ({\n        type: (widgetConfig?.chartType?.toLowerCase() || 'line') as ChartType,\n        xAxisKey: widgetConfig?.xAxisField || 'name',\n        xAxisLabel: widgetConfig?.xAxisLabel,\n        yAxisLabel: widgetConfig?.yAxisLabel,\n        showGrid: widgetConfig?.showGrid,\n        showLegend: widgetConfig?.showLegend,\n        legendPosition: widgetConfig?.legendPosition,\n        showDots: widgetConfig?.showDataPoints,\n        curveType: widgetConfig?.curveType as CurveType | undefined,\n        colors: widgetConfig?.colors,\n        seriesNames: widgetConfig?.seriesLabels,\n        stacked: widgetConfig?.stacked,\n        isDonut: widgetConfig?.showAsDonut,\n        innerRadius: widgetConfig?.innerRadius,\n        outerRadius: widgetConfig?.outerRadius,\n        referenceLines: widgetConfig?.referenceLines as ReferenceLineConfig[] | undefined,\n        series: widgetConfig?.series as SeriesConfig[] | undefined,\n        dualAxis: widgetConfig?.dualAxis,\n        yAxisRightLabel: widgetConfig?.yAxisRightLabel,\n        logScale: (widgetConfig as { logScale?: boolean } | undefined)?.logScale,\n        valueField: widgetConfig?.valueField,\n        labelField: widgetConfig?.labelField,\n        showTotal: (widgetConfig as { showTotal?: boolean } | undefined)?.showTotal,\n        totalLabel: (widgetConfig as { totalLabel?: string } | undefined)?.totalLabel,\n        xField: (widgetConfig as { xField?: string } | undefined)?.xField,\n        yField: (widgetConfig as { yField?: string } | undefined)?.yField,\n        sizeField: (widgetConfig as { sizeField?: string } | undefined)?.sizeField,\n        colorField: (widgetConfig as { colorField?: string } | undefined)?.colorField,\n      }) as ChartConfig,\n    [widgetConfig]\n  );\n\n  // Extract legend items for cartesian charts\n  const legendItems: LegendItem[] = useMemo(() => {\n    if (!data.length) return [];\n\n    // For pie/funnel/scatter/waterfall charts, legend is handled internally\n    if (\n      chartConfig.type === 'pie' ||\n      chartConfig.type === 'funnel' ||\n      chartConfig.type === 'scatter' ||\n      chartConfig.type === 'waterfall'\n    ) {\n      return [];\n    }\n\n    // Get selected fields from widget config (if specified)\n    const selectedFields = widgetConfig?.selectedFields as string[] | undefined;\n\n    // Filter to numeric fields, and apply selectedFields filter if configured\n    const keys = Object.keys(data[0]).filter((key) => {\n      // Must not be the x-axis key and must be numeric\n      const isValidNumericField = key !== chartConfig.xAxisKey && typeof data[0][key] === 'number';\n\n      // If selectedFields is configured and not empty, only include those fields\n      if (selectedFields && selectedFields.length > 0) {\n        return isValidNumericField && selectedFields.includes(key);\n      }\n\n      // Otherwise, show all numeric fields\n      return isValidNumericField;\n    });\n\n    return keys.map((key, index) => ({\n      dataKey: key,\n      name: chartConfig.seriesNames?.[key] || key,\n      color: chartConfig.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length],\n      hidden: hiddenSeries.includes(key),\n    }));\n  }, [data, chartConfig, hiddenSeries, widgetConfig?.selectedFields]);\n\n  // Toggle series visibility\n  const handleLegendClick = useCallback((dataKey: string) => {\n    setHiddenSeries((prev) => (prev.includes(dataKey) ? prev.filter((k) => k !== dataKey) : [...prev, dataKey]));\n  }, []);\n\n  // Handle data point click\n  // Clicking a bar/slice triggers BOTH cross-filtering AND drilldown:\n  //   1. Cross-filter: highlights the clicked item across all widgets\n  //   2. Drilldown: opens the detail modal/page for the clicked item\n  const handleDataClick = useCallback(\n    (dataPoint: ChartData, index: number) => {\n      // Trigger cross-filtering on data click when enabled\n      if (crossFilterEnabled) {\n        const label = dataPoint[widgetConfig?.labelField || 'name'] as string;\n        triggerCrossFilter(dataPoint as Record<string, unknown>, label);\n      }\n\n      // Trigger drilldown if configured\n      if (onDrilldown) {\n        onDrilldown(dataPoint as Record<string, unknown>);\n      } else if (onClick && widget.drilldowns?.length) {\n        onClick(dataPoint, index);\n      }\n    },\n    [onClick, onDrilldown, widget.drilldowns, crossFilterEnabled, triggerCrossFilter, widgetConfig?.labelField]\n  );\n\n  // A combo chart is requested explicitly, or implied by a dual axis / a\n  // per-series config that mixes bar+line or binds a series to the right axis.\n  const isCombo =\n    chartConfig.type === 'combo' ||\n    chartConfig.dualAxis === true ||\n    (chartConfig.series?.some((s) => s.axis === 'right' || s.type === 'bar') &&\n      chartConfig.series?.some((s) => s.type === 'line')) ||\n    false;\n\n  // Render the appropriate chart\n  const renderChart = () => {\n    if (isCombo) {\n      return <ComboChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n    }\n    switch (chartConfig.type) {\n      case 'waterfall':\n        return <WaterfallChart data={data} config={chartConfig} onDataClick={handleDataClick} />;\n\n      case 'scatter':\n        return <ScatterChart data={data} config={chartConfig} onDataClick={handleDataClick} />;\n\n      case 'bar':\n        return <BarChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n\n      case 'area':\n        return <AreaChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n\n      case 'pie':\n        return (\n          <PieChart\n            data={data}\n            config={chartConfig}\n            dataKey={widgetConfig?.valueField || 'value'}\n            nameKey={widgetConfig?.labelField || 'name'}\n            onDataClick={handleDataClick}\n          />\n        );\n\n      case 'funnel':\n        return (\n          <FunnelChart\n            data={data}\n            config={chartConfig}\n            dataKey={widgetConfig?.valueField || 'value'}\n            nameKey={widgetConfig?.labelField || 'name'}\n            onDataClick={handleDataClick}\n          />\n        );\n\n      case 'line':\n      default:\n        return <LineChart data={data} config={chartConfig} hiddenSeries={hiddenSeries} onDataClick={handleDataClick} />;\n    }\n  };\n\n  return (\n    <div className=\"flex flex-col h-full p-4\">\n      {/* Cross-filter active indicator with clear button */}\n      {hasCrossFilters && (\n        <div className=\"flex items-center gap-2 mb-2 -mt-1\">\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              clearAllCrossFilters();\n            }}\n            className=\"\n              inline-flex items-center gap-1.5\n              px-2.5 py-1 rounded-md\n              text-xs font-medium\n              bg-action-primary-bg/10 text-action-primary-text\n              hover:bg-action-primary-bg/20\n              transition-colors\n            \"\n          >\n            <svg className=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M10 19l-7-7m0 0l7-7m-7 7h18\" />\n            </svg>\n            Clear Filter\n          </button>\n        </div>\n      )}\n\n      {/* Custom legend (for line/bar/area charts with external legend) */}\n      {chartConfig.legendPosition === 'top' && legendItems.length > 0 && (\n        <ChartLegend items={legendItems} position=\"top\" onItemClick={handleLegendClick} />\n      )}\n\n      {/* Chart container */}\n      <div className=\"flex-1 min-h-0\">{renderChart()}</div>\n\n      {/* Custom legend (bottom) */}\n      {chartConfig.legendPosition === 'bottom' && legendItems.length > 0 && (\n        <ChartLegend items={legendItems} position=\"bottom\" onItemClick={handleLegendClick} />\n      )}\n    </div>\n  );\n});\n\nexport default ChartWidget;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/chart/charts/AreaChart.js

@@ -1,24 +1,25 @@
 import e from "../ChartTooltip.js";
-import { memo as t, useMemo as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Area as a, AreaChart as o, CartesianGrid as s, Legend as c, ResponsiveContainer as l, Tooltip as u, XAxis as d, YAxis as f } from "recharts";
+import { buildReferenceElements as t } from "./referenceElements.js";
+import { memo as n, useMemo as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Area as o, AreaChart as s, CartesianGrid as c, Legend as l, ResponsiveContainer as u, Tooltip as d, XAxis as f, YAxis as p } from "recharts";
 //#region src/bigconsole/components/widgets/chart/charts/AreaChart.tsx
-var p = [
+var m = [
 	"var(--color-chart-1)",
 	"var(--color-chart-2)",
 	"var(--color-chart-3)",
 	"var(--color-chart-4)",
 	"var(--color-chart-5)"
-], m = t(function({ data: t = [], config: m, hiddenSeries: h = [], onDataClick: g }) {
-	let _ = n(() => t?.length ? Object.keys(t[0]).filter((e) => e !== m.xAxisKey && typeof t[0][e] == "number") : [], [t, m.xAxisKey]), v = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
+], h = n(function({ data: n = [], config: h, hiddenSeries: g = [], onDataClick: _ }) {
+	let v = r(() => n?.length ? Object.keys(n[0]).filter((e) => e !== h.xAxisKey && typeof n[0][e] == "number") : [], [n, h.xAxisKey]), y = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
 		notation: e >= 1e4 ? "compact" : "standard",
 		maximumFractionDigits: 2
-	}).format(e) : String(e), y = (e) => `gradient-${e}`;
-	return t?.length ? /* @__PURE__ */ r(l, {
+	}).format(e) : String(e), b = (e) => `gradient-${e}`;
+	return n?.length ? /* @__PURE__ */ i(u, {
 		width: "100%",
 		height: "100%",
-		children: /* @__PURE__ */ i(o, {
-			data: t,
+		children: /* @__PURE__ */ a(s, {
+			data: n,
 			margin: {
 				top: 10,
 				right: 10,
@@ -26,35 +27,35 @@ var p = [
 				bottom: 0
 			},
 			onClick: (e) => {
-				e?.activePayload?.[0] && g && g(e.activePayload[0].payload, e.activeTooltipIndex || 0);
+				e?.activePayload?.[0] && _ && _(e.activePayload[0].payload, e.activeTooltipIndex || 0);
 			},
 			children: [
-				/* @__PURE__ */ r("defs", { children: _.map((e, t) => {
-					let n = m.colors?.[t] || p[t % p.length];
-					return /* @__PURE__ */ i("linearGradient", {
-						id: y(e),
+				/* @__PURE__ */ i("defs", { children: v.map((e, t) => {
+					let n = h.colors?.[t] || m[t % m.length];
+					return /* @__PURE__ */ a("linearGradient", {
+						id: b(e),
 						x1: "0",
 						y1: "0",
 						x2: "0",
 						y2: "1",
-						children: [/* @__PURE__ */ r("stop", {
+						children: [/* @__PURE__ */ i("stop", {
 							offset: "0%",
 							stopColor: n,
 							stopOpacity: .4
-						}), /* @__PURE__ */ r("stop", {
+						}), /* @__PURE__ */ i("stop", {
 							offset: "95%",
 							stopColor: n,
 							stopOpacity: .05
 						})]
 					}, e);
 				}) }),
-				m.showGrid !== !1 && /* @__PURE__ */ r(s, {
+				h.showGrid !== !1 && /* @__PURE__ */ i(c, {
 					strokeDasharray: "3 3",
 					stroke: "var(--color-border-default)",
 					opacity: .5
 				}),
-				/* @__PURE__ */ r(d, {
-					dataKey: m.xAxisKey || "name",
+				/* @__PURE__ */ i(f, {
+					dataKey: h.xAxisKey || "name",
 					tick: {
 						fill: "var(--color-text-secondary)",
 						fontSize: 12
@@ -62,43 +63,47 @@ var p = [
 					tickLine: { stroke: "var(--color-border-default)" },
 					axisLine: { stroke: "var(--color-border-default)" }
 				}),
-				/* @__PURE__ */ r(f, {
+				/* @__PURE__ */ i(p, {
 					tick: {
 						fill: "var(--color-text-secondary)",
 						fontSize: 12
 					},
 					tickLine: { stroke: "var(--color-border-default)" },
 					axisLine: { stroke: "var(--color-border-default)" },
-					tickFormatter: v
+					tickFormatter: y,
+					scale: h.logScale ? "log" : "auto",
+					domain: h.logScale ? ["auto", "auto"] : void 0,
+					allowDataOverflow: h.logScale || void 0
 				}),
-				/* @__PURE__ */ r(u, {
-					content: /* @__PURE__ */ r(e, { valueFormatter: v }),
+				/* @__PURE__ */ i(d, {
+					content: /* @__PURE__ */ i(e, { valueFormatter: y }),
 					cursor: { stroke: "var(--color-border-default)" }
 				}),
-				m.showLegend !== !1 && /* @__PURE__ */ r(c, {
+				h.showLegend !== !1 && /* @__PURE__ */ i(l, {
 					wrapperStyle: { paddingTop: 20 },
-					formatter: (e) => /* @__PURE__ */ r("span", {
+					formatter: (e) => /* @__PURE__ */ i("span", {
 						style: { color: "var(--color-text-primary)" },
 						children: e
 					})
 				}),
-				_.map((e, t) => /* @__PURE__ */ r(a, {
-					type: m.curveType || "monotone",
+				t(h.referenceLines),
+				v.map((e, t) => /* @__PURE__ */ i(o, {
+					type: h.curveType || "monotone",
 					dataKey: e,
-					name: m.seriesNames?.[e] || e,
-					stroke: m.colors?.[t] || p[t % p.length],
+					name: h.seriesNames?.[e] || e,
+					stroke: h.colors?.[t] || m[t % m.length],
 					strokeWidth: 2,
-					fill: `url(#${y(e)})`,
-					dot: m.showDots,
+					fill: `url(#${b(e)})`,
+					dot: h.showDots,
 					activeDot: { r: 6 },
-					hide: h.includes(e),
-					stackId: m.stacked ? "stack" : void 0
+					hide: g.includes(e),
+					stackId: h.stacked ? "stack" : void 0
 				}, e))
 			]
 		})
 	}) : null;
 });
 //#endregion
-export { m as default };
+export { h as default };
 
 //# sourceMappingURL=AreaChart.js.map

package/dist/bigconsole/components/widgets/chart/charts/AreaChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"AreaChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/AreaChart.tsx"],"sourcesContent":["/**\n * AreaChart Component\n *\n * Area chart using Recharts.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  AreaChart as RechartsAreaChart,\n  Area,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Tooltip,\n  ResponsiveContainer,\n  Legend,\n} from 'recharts';\nimport { ChartTooltip } from '../ChartTooltip';\nimport type { ChartConfig, ChartData } from './types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface AreaChartProps {\n  /** Chart data */\n  data: ChartData[];\n  /** Chart configuration */\n  config: ChartConfig;\n  /** Series to hide */\n  hiddenSeries?: string[];\n  /** Click handler for data points */\n  onDataClick?: (data: ChartData, index: number) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const AreaChart: FC<AreaChartProps> = memo(function AreaChart({\n  data = [],\n  config,\n  hiddenSeries = [],\n  onDataClick,\n}) {\n  // Extract data keys (series)\n  const dataKeys = useMemo(() => {\n    if (!data?.length) return [];\n    const keys = Object.keys(data[0]).filter((key) => key !== config.xAxisKey && typeof data[0][key] === 'number');\n    return keys;\n  }, [data, config.xAxisKey]);\n\n  // Format value\n  const formatValue = (value: number | string): string => {\n    if (typeof value !== 'number') return String(value);\n    return new Intl.NumberFormat('en-US', {\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  // Generate gradient ID\n  const getGradientId = (key: string) => `gradient-${key}`;\n\n  if (!data?.length) {\n    return null;\n  }\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <RechartsAreaChart\n        data={data}\n        margin={{ top: 10, right: 10, left: 0, bottom: 0 }}\n        onClick={(e) => {\n          if (e?.activePayload?.[0] && onDataClick) {\n            onDataClick(e.activePayload[0].payload, e.activeTooltipIndex || 0);\n          }\n        }}\n      >\n        {/* Gradients */}\n        <defs>\n          {dataKeys.map((key, index) => {\n            const color = config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length];\n            return (\n              <linearGradient key={key} id={getGradientId(key)} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n                <stop offset=\"0%\" stopColor={color} stopOpacity={0.4} />\n                <stop offset=\"95%\" stopColor={color} stopOpacity={0.05} />\n              </linearGradient>\n            );\n          })}\n        </defs>\n\n        {config.showGrid !== false && (\n          <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--color-border-default)\" opacity={0.5} />\n        )}\n\n        <XAxis\n          dataKey={config.xAxisKey || 'name'}\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        <YAxis\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n          tickFormatter={formatValue}\n        />\n\n        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        {config.showLegend !== false && (\n          <Legend\n            wrapperStyle={{ paddingTop: 20 }}\n            formatter={(value) => <span style={{ color: 'var(--color-text-primary)' }}>{value}</span>}\n          />\n        )}\n\n        {dataKeys.map((key, index) => (\n          <Area\n            key={key}\n            type={config.curveType || 'monotone'}\n            dataKey={key}\n            name={config.seriesNames?.[key] || key}\n            stroke={config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length]}\n            strokeWidth={2}\n            fill={`url(#${getGradientId(key)})`}\n            dot={config.showDots}\n            activeDot={{ r: 6 }}\n            hide={hiddenSeries.includes(key)}\n            stackId={config.stacked ? 'stack' : undefined}\n          />\n        ))}\n      </RechartsAreaChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default AreaChart;\n"],"mappings":";;;;;AAuCA,IAAM,IAAiB;CACrB;CACA;CACA;CACA;CACA;CACD,EAMY,IAAgC,EAAK,SAAmB,EACnE,UAAO,EAAE,EACT,WACA,kBAAe,EAAE,EACjB,kBACC;CAED,IAAM,IAAW,QACV,GAAM,SACE,OAAO,KAAK,EAAK,GAAG,CAAC,QAAQ,MAAQ,MAAQ,EAAO,YAAY,OAAO,EAAK,GAAG,MAAS,SAAS,GADpF,EAAE,EAG3B,CAAC,GAAM,EAAO,SAAS,CAAC,EAGrB,KAAe,MACf,OAAO,KAAU,WACd,IAAI,KAAK,aAAa,SAAS;EACpC,UAAU,KAAS,MAAQ,YAAY;EACvC,uBAAuB;EACxB,CAAC,CAAC,OAAO,EAAM,GAJsB,OAAO,EAAM,EAQ/C,KAAiB,MAAgB,YAAY;AAMnD,QAJK,GAAM,SAKT,kBAAC,GAAD;EAAqB,OAAM;EAAO,QAAO;YACvC,kBAAC,GAAD;GACQ;GACN,QAAQ;IAAE,KAAK;IAAI,OAAO;IAAI,MAAM;IAAG,QAAQ;IAAG;GAClD,UAAU,MAAM;AACd,IAAI,GAAG,gBAAgB,MAAM,KAC3B,EAAY,EAAE,cAAc,GAAG,SAAS,EAAE,sBAAsB,EAAE;;aALxE;IAUE,kBAAC,QAAD,EAAA,UACG,EAAS,KAAK,GAAK,MAAU;KAC5B,IAAM,IAAQ,EAAO,SAAS,MAAU,EAAe,IAAQ,EAAe;AAC9E,YACE,kBAAC,kBAAD;MAA0B,IAAI,EAAc,EAAI;MAAE,IAAG;MAAI,IAAG;MAAI,IAAG;MAAI,IAAG;gBAA1E,CACE,kBAAC,QAAD;OAAM,QAAO;OAAK,WAAW;OAAO,aAAa;OAAO,CAAA,EACxD,kBAAC,QAAD;OAAM,QAAO;OAAM,WAAW;OAAO,aAAa;OAAQ,CAAA,CAC3C;QAHI,EAGJ;MAEnB,EACG,CAAA;IAEN,EAAO,aAAa,MACnB,kBAAC,GAAD;KAAe,iBAAgB;KAAM,QAAO;KAA8B,SAAS;KAAO,CAAA;IAG5F,kBAAC,GAAD;KACE,SAAS,EAAO,YAAY;KAC5B,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,CAAA;IAEF,kBAAC,GAAD;KACE,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,eAAe;KACf,CAAA;IAEF,kBAAC,GAAD;KACE,SAAS,kBAAC,GAAD,EAAc,gBAAgB,GAAe,CAAA;KACtD,QAAQ,EAAE,QAAQ,+BAA+B;KACjD,CAAA;IAED,EAAO,eAAe,MACrB,kBAAC,GAAD;KACE,cAAc,EAAE,YAAY,IAAI;KAChC,YAAY,MAAU,kBAAC,QAAD;MAAM,OAAO,EAAE,OAAO,6BAA6B;gBAAG;MAAa,CAAA;KACzF,CAAA;IAGH,EAAS,KAAK,GAAK,MAClB,kBAAC,GAAD;KAEE,MAAM,EAAO,aAAa;KAC1B,SAAS;KACT,MAAM,EAAO,cAAc,MAAQ;KACnC,QAAQ,EAAO,SAAS,MAAU,EAAe,IAAQ,EAAe;KACxE,aAAa;KACb,MAAM,QAAQ,EAAc,EAAI,CAAC;KACjC,KAAK,EAAO;KACZ,WAAW,EAAE,GAAG,GAAG;KACnB,MAAM,EAAa,SAAS,EAAI;KAChC,SAAS,EAAO,UAAU,UAAU,KAAA;KACpC,EAXK,EAWL,CACF;IACgB;;EACA,CAAA,GAzEf;EA2ET"}
+{"version":3,"file":"AreaChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/AreaChart.tsx"],"sourcesContent":["/**\n * AreaChart Component\n *\n * Area chart using Recharts.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  AreaChart as RechartsAreaChart,\n  Area,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Tooltip,\n  ResponsiveContainer,\n  Legend,\n} from 'recharts';\nimport { ChartTooltip } from '../ChartTooltip';\nimport type { ChartConfig, ChartData } from './types';\nimport { buildReferenceElements } from './referenceElements';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface AreaChartProps {\n  /** Chart data */\n  data: ChartData[];\n  /** Chart configuration */\n  config: ChartConfig;\n  /** Series to hide */\n  hiddenSeries?: string[];\n  /** Click handler for data points */\n  onDataClick?: (data: ChartData, index: number) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const AreaChart: FC<AreaChartProps> = memo(function AreaChart({\n  data = [],\n  config,\n  hiddenSeries = [],\n  onDataClick,\n}) {\n  // Extract data keys (series)\n  const dataKeys = useMemo(() => {\n    if (!data?.length) return [];\n    const keys = Object.keys(data[0]).filter((key) => key !== config.xAxisKey && typeof data[0][key] === 'number');\n    return keys;\n  }, [data, config.xAxisKey]);\n\n  // Format value\n  const formatValue = (value: number | string): string => {\n    if (typeof value !== 'number') return String(value);\n    return new Intl.NumberFormat('en-US', {\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  // Generate gradient ID\n  const getGradientId = (key: string) => `gradient-${key}`;\n\n  if (!data?.length) {\n    return null;\n  }\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <RechartsAreaChart\n        data={data}\n        margin={{ top: 10, right: 10, left: 0, bottom: 0 }}\n        onClick={(e) => {\n          if (e?.activePayload?.[0] && onDataClick) {\n            onDataClick(e.activePayload[0].payload, e.activeTooltipIndex || 0);\n          }\n        }}\n      >\n        {/* Gradients */}\n        <defs>\n          {dataKeys.map((key, index) => {\n            const color = config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length];\n            return (\n              <linearGradient key={key} id={getGradientId(key)} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n                <stop offset=\"0%\" stopColor={color} stopOpacity={0.4} />\n                <stop offset=\"95%\" stopColor={color} stopOpacity={0.05} />\n              </linearGradient>\n            );\n          })}\n        </defs>\n\n        {config.showGrid !== false && (\n          <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--color-border-default)\" opacity={0.5} />\n        )}\n\n        <XAxis\n          dataKey={config.xAxisKey || 'name'}\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        <YAxis\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n          tickFormatter={formatValue}\n          scale={config.logScale ? 'log' : 'auto'}\n          domain={config.logScale ? ['auto', 'auto'] : undefined}\n          allowDataOverflow={config.logScale || undefined}\n        />\n\n        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        {config.showLegend !== false && (\n          <Legend\n            wrapperStyle={{ paddingTop: 20 }}\n            formatter={(value) => <span style={{ color: 'var(--color-text-primary)' }}>{value}</span>}\n          />\n        )}\n\n        {buildReferenceElements(config.referenceLines)}\n\n        {dataKeys.map((key, index) => (\n          <Area\n            key={key}\n            type={config.curveType || 'monotone'}\n            dataKey={key}\n            name={config.seriesNames?.[key] || key}\n            stroke={config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length]}\n            strokeWidth={2}\n            fill={`url(#${getGradientId(key)})`}\n            dot={config.showDots}\n            activeDot={{ r: 6 }}\n            hide={hiddenSeries.includes(key)}\n            stackId={config.stacked ? 'stack' : undefined}\n          />\n        ))}\n      </RechartsAreaChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default AreaChart;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/chart/charts/BarChart.js

@@ -1,24 +1,25 @@
 import e from "../ChartTooltip.js";
-import { memo as t, useMemo as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Bar as a, BarChart as o, CartesianGrid as s, Legend as c, ResponsiveContainer as l, Tooltip as u, XAxis as d, YAxis as f } from "recharts";
+import { buildReferenceElements as t } from "./referenceElements.js";
+import { memo as n, useMemo as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Bar as o, BarChart as s, CartesianGrid as c, Legend as l, ResponsiveContainer as u, Tooltip as d, XAxis as f, YAxis as p } from "recharts";
 //#region src/bigconsole/components/widgets/chart/charts/BarChart.tsx
-var p = [
+var m = [
 	"var(--color-chart-1)",
 	"var(--color-chart-2)",
 	"var(--color-chart-3)",
 	"var(--color-chart-4)",
 	"var(--color-chart-5)"
-], m = t(function({ data: t = [], config: m, hiddenSeries: h = [], onDataClick: g }) {
-	let _ = n(() => t?.length ? Object.keys(t[0]).filter((e) => e !== m.xAxisKey && typeof t[0][e] == "number") : [], [t, m.xAxisKey]), v = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
+], h = n(function({ data: n = [], config: h, hiddenSeries: g = [], onDataClick: _ }) {
+	let v = r(() => n?.length ? Object.keys(n[0]).filter((e) => e !== h.xAxisKey && typeof n[0][e] == "number") : [], [n, h.xAxisKey]), y = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
 		notation: e >= 1e4 ? "compact" : "standard",
 		maximumFractionDigits: 2
 	}).format(e) : String(e);
-	return t?.length ? /* @__PURE__ */ r(l, {
+	return n?.length ? /* @__PURE__ */ i(u, {
 		width: "100%",
 		height: "100%",
-		children: /* @__PURE__ */ i(o, {
-			data: t,
+		children: /* @__PURE__ */ a(s, {
+			data: n,
 			margin: {
 				top: 10,
 				right: 10,
@@ -26,17 +27,17 @@ var p = [
 				bottom: 0
 			},
 			onClick: (e) => {
-				e?.activePayload?.[0] && g && g(e.activePayload[0].payload, e.activeTooltipIndex || 0);
+				e?.activePayload?.[0] && _ && _(e.activePayload[0].payload, e.activeTooltipIndex || 0);
 			},
 			children: [
-				m.showGrid !== !1 && /* @__PURE__ */ r(s, {
+				h.showGrid !== !1 && /* @__PURE__ */ i(c, {
 					strokeDasharray: "3 3",
 					stroke: "var(--color-border-default)",
 					opacity: .5,
 					vertical: !1
 				}),
-				/* @__PURE__ */ r(d, {
-					dataKey: m.xAxisKey || "name",
+				/* @__PURE__ */ i(f, {
+					dataKey: h.xAxisKey || "name",
 					tick: {
 						fill: "var(--color-text-secondary)",
 						fontSize: 12
@@ -44,47 +45,51 @@ var p = [
 					tickLine: { stroke: "var(--color-border-default)" },
 					axisLine: { stroke: "var(--color-border-default)" }
 				}),
-				/* @__PURE__ */ r(f, {
+				/* @__PURE__ */ i(p, {
 					tick: {
 						fill: "var(--color-text-secondary)",
 						fontSize: 12
 					},
 					tickLine: { stroke: "var(--color-border-default)" },
 					axisLine: { stroke: "var(--color-border-default)" },
-					tickFormatter: v
+					tickFormatter: y,
+					scale: h.logScale ? "log" : "auto",
+					domain: h.logScale ? ["auto", "auto"] : void 0,
+					allowDataOverflow: h.logScale || void 0
 				}),
-				/* @__PURE__ */ r(u, {
-					content: /* @__PURE__ */ r(e, { valueFormatter: v }),
+				/* @__PURE__ */ i(d, {
+					content: /* @__PURE__ */ i(e, { valueFormatter: y }),
 					cursor: {
 						fill: "var(--color-bg-muted)",
 						opacity: .5
 					}
 				}),
-				m.showLegend !== !1 && /* @__PURE__ */ r(c, {
+				h.showLegend !== !1 && /* @__PURE__ */ i(l, {
 					wrapperStyle: { paddingTop: 20 },
-					formatter: (e) => /* @__PURE__ */ r("span", {
+					formatter: (e) => /* @__PURE__ */ i("span", {
 						style: { color: "var(--color-text-primary)" },
 						children: e
 					})
 				}),
-				_.map((e, t) => /* @__PURE__ */ r(a, {
+				t(h.referenceLines),
+				v.map((e, t) => /* @__PURE__ */ i(o, {
 					dataKey: e,
-					name: m.seriesNames?.[e] || e,
-					fill: m.colors?.[t] || p[t % p.length],
+					name: h.seriesNames?.[e] || e,
+					fill: h.colors?.[t] || m[t % m.length],
 					radius: [
 						4,
 						4,
 						0,
 						0
 					],
-					hide: h.includes(e),
-					stackId: m.stacked ? "stack" : void 0
+					hide: g.includes(e),
+					stackId: h.stacked ? "stack" : void 0
 				}, e))
 			]
 		})
 	}) : null;
 });
 //#endregion
-export { m as default };
+export { h as default };
 
 //# sourceMappingURL=BarChart.js.map

package/dist/bigconsole/components/widgets/chart/charts/BarChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"BarChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/BarChart.tsx"],"sourcesContent":["/**\n * BarChart Component\n *\n * Bar chart using Recharts.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  BarChart as RechartsBarChart,\n  Bar,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Tooltip,\n  ResponsiveContainer,\n  Legend,\n} from 'recharts';\nimport { ChartTooltip } from '../ChartTooltip';\nimport type { ChartConfig, ChartData } from './types';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface BarChartProps {\n  /** Chart data */\n  data: ChartData[];\n  /** Chart configuration */\n  config: ChartConfig;\n  /** Series to hide */\n  hiddenSeries?: string[];\n  /** Click handler for bars */\n  onDataClick?: (data: ChartData, index: number) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const BarChart: FC<BarChartProps> = memo(function BarChart({\n  data = [],\n  config,\n  hiddenSeries = [],\n  onDataClick,\n}) {\n  // Extract data keys (series)\n  const dataKeys = useMemo(() => {\n    if (!data?.length) return [];\n    const keys = Object.keys(data[0]).filter((key) => key !== config.xAxisKey && typeof data[0][key] === 'number');\n    return keys;\n  }, [data, config.xAxisKey]);\n\n  // Format value\n  const formatValue = (value: number | string): string => {\n    if (typeof value !== 'number') return String(value);\n    return new Intl.NumberFormat('en-US', {\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  if (!data?.length) {\n    return null;\n  }\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <RechartsBarChart\n        data={data}\n        margin={{ top: 10, right: 10, left: 0, bottom: 0 }}\n        onClick={(e) => {\n          if (e?.activePayload?.[0] && onDataClick) {\n            onDataClick(e.activePayload[0].payload, e.activeTooltipIndex || 0);\n          }\n        }}\n      >\n        {config.showGrid !== false && (\n          <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--color-border-default)\" opacity={0.5} vertical={false} />\n        )}\n\n        <XAxis\n          dataKey={config.xAxisKey || 'name'}\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        <YAxis\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n          tickFormatter={formatValue}\n        />\n\n        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ fill: 'var(--color-bg-muted)', opacity: 0.5 }}\n        />\n\n        {config.showLegend !== false && (\n          <Legend\n            wrapperStyle={{ paddingTop: 20 }}\n            formatter={(value) => <span style={{ color: 'var(--color-text-primary)' }}>{value}</span>}\n          />\n        )}\n\n        {dataKeys.map((key, index) => (\n          <Bar\n            key={key}\n            dataKey={key}\n            name={config.seriesNames?.[key] || key}\n            fill={config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length]}\n            radius={[4, 4, 0, 0]}\n            hide={hiddenSeries.includes(key)}\n            stackId={config.stacked ? 'stack' : undefined}\n          />\n        ))}\n      </RechartsBarChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default BarChart;\n"],"mappings":";;;;;AAuCA,IAAM,IAAiB;CACrB;CACA;CACA;CACA;CACA;CACD,EAMY,IAA8B,EAAK,SAAkB,EAChE,UAAO,EAAE,EACT,WACA,kBAAe,EAAE,EACjB,kBACC;CAED,IAAM,IAAW,QACV,GAAM,SACE,OAAO,KAAK,EAAK,GAAG,CAAC,QAAQ,MAAQ,MAAQ,EAAO,YAAY,OAAO,EAAK,GAAG,MAAS,SAAS,GADpF,EAAE,EAG3B,CAAC,GAAM,EAAO,SAAS,CAAC,EAGrB,KAAe,MACf,OAAO,KAAU,WACd,IAAI,KAAK,aAAa,SAAS;EACpC,UAAU,KAAS,MAAQ,YAAY;EACvC,uBAAuB;EACxB,CAAC,CAAC,OAAO,EAAM,GAJsB,OAAO,EAAM;AAWrD,QAJK,GAAM,SAKT,kBAAC,GAAD;EAAqB,OAAM;EAAO,QAAO;YACvC,kBAAC,GAAD;GACQ;GACN,QAAQ;IAAE,KAAK;IAAI,OAAO;IAAI,MAAM;IAAG,QAAQ;IAAG;GAClD,UAAU,MAAM;AACd,IAAI,GAAG,gBAAgB,MAAM,KAC3B,EAAY,EAAE,cAAc,GAAG,SAAS,EAAE,sBAAsB,EAAE;;aALxE;IASG,EAAO,aAAa,MACnB,kBAAC,GAAD;KAAe,iBAAgB;KAAM,QAAO;KAA8B,SAAS;KAAK,UAAU;KAAS,CAAA;IAG7G,kBAAC,GAAD;KACE,SAAS,EAAO,YAAY;KAC5B,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,CAAA;IAEF,kBAAC,GAAD;KACE,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,eAAe;KACf,CAAA;IAEF,kBAAC,GAAD;KACE,SAAS,kBAAC,GAAD,EAAc,gBAAgB,GAAe,CAAA;KACtD,QAAQ;MAAE,MAAM;MAAyB,SAAS;MAAK;KACvD,CAAA;IAED,EAAO,eAAe,MACrB,kBAAC,GAAD;KACE,cAAc,EAAE,YAAY,IAAI;KAChC,YAAY,MAAU,kBAAC,QAAD;MAAM,OAAO,EAAE,OAAO,6BAA6B;gBAAG;MAAa,CAAA;KACzF,CAAA;IAGH,EAAS,KAAK,GAAK,MAClB,kBAAC,GAAD;KAEE,SAAS;KACT,MAAM,EAAO,cAAc,MAAQ;KACnC,MAAM,EAAO,SAAS,MAAU,EAAe,IAAQ,EAAe;KACtE,QAAQ;MAAC;MAAG;MAAG;MAAG;MAAE;KACpB,MAAM,EAAa,SAAS,EAAI;KAChC,SAAS,EAAO,UAAU,UAAU,KAAA;KACpC,EAPK,EAOL,CACF;IACe;;EACC,CAAA,GAxDf;EA0DT"}
+{"version":3,"file":"BarChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/BarChart.tsx"],"sourcesContent":["/**\n * BarChart Component\n *\n * Bar chart using Recharts.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  BarChart as RechartsBarChart,\n  Bar,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Tooltip,\n  ResponsiveContainer,\n  Legend,\n} from 'recharts';\nimport { ChartTooltip } from '../ChartTooltip';\nimport type { ChartConfig, ChartData } from './types';\nimport { buildReferenceElements } from './referenceElements';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface BarChartProps {\n  /** Chart data */\n  data: ChartData[];\n  /** Chart configuration */\n  config: ChartConfig;\n  /** Series to hide */\n  hiddenSeries?: string[];\n  /** Click handler for bars */\n  onDataClick?: (data: ChartData, index: number) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const BarChart: FC<BarChartProps> = memo(function BarChart({\n  data = [],\n  config,\n  hiddenSeries = [],\n  onDataClick,\n}) {\n  // Extract data keys (series)\n  const dataKeys = useMemo(() => {\n    if (!data?.length) return [];\n    const keys = Object.keys(data[0]).filter((key) => key !== config.xAxisKey && typeof data[0][key] === 'number');\n    return keys;\n  }, [data, config.xAxisKey]);\n\n  // Format value\n  const formatValue = (value: number | string): string => {\n    if (typeof value !== 'number') return String(value);\n    return new Intl.NumberFormat('en-US', {\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  if (!data?.length) {\n    return null;\n  }\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <RechartsBarChart\n        data={data}\n        margin={{ top: 10, right: 10, left: 0, bottom: 0 }}\n        onClick={(e) => {\n          if (e?.activePayload?.[0] && onDataClick) {\n            onDataClick(e.activePayload[0].payload, e.activeTooltipIndex || 0);\n          }\n        }}\n      >\n        {config.showGrid !== false && (\n          <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--color-border-default)\" opacity={0.5} vertical={false} />\n        )}\n\n        <XAxis\n          dataKey={config.xAxisKey || 'name'}\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        <YAxis\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n          tickFormatter={formatValue}\n          scale={config.logScale ? 'log' : 'auto'}\n          domain={config.logScale ? ['auto', 'auto'] : undefined}\n          allowDataOverflow={config.logScale || undefined}\n        />\n\n        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ fill: 'var(--color-bg-muted)', opacity: 0.5 }}\n        />\n\n        {config.showLegend !== false && (\n          <Legend\n            wrapperStyle={{ paddingTop: 20 }}\n            formatter={(value) => <span style={{ color: 'var(--color-text-primary)' }}>{value}</span>}\n          />\n        )}\n\n        {buildReferenceElements(config.referenceLines)}\n\n        {dataKeys.map((key, index) => (\n          <Bar\n            key={key}\n            dataKey={key}\n            name={config.seriesNames?.[key] || key}\n            fill={config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length]}\n            radius={[4, 4, 0, 0]}\n            hide={hiddenSeries.includes(key)}\n            stackId={config.stacked ? 'stack' : undefined}\n          />\n        ))}\n      </RechartsBarChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default BarChart;\n"],"mappings":";;;;;;AAwCA,IAAM,IAAiB;CACrB;CACA;CACA;CACA;CACA;CACD,EAMY,IAA8B,EAAK,SAAkB,EAChE,UAAO,EAAE,EACT,WACA,kBAAe,EAAE,EACjB,kBACC;CAED,IAAM,IAAW,QACV,GAAM,SACE,OAAO,KAAK,EAAK,GAAG,CAAC,QAAQ,MAAQ,MAAQ,EAAO,YAAY,OAAO,EAAK,GAAG,MAAS,SAAS,GADpF,EAAE,EAG3B,CAAC,GAAM,EAAO,SAAS,CAAC,EAGrB,KAAe,MACf,OAAO,KAAU,WACd,IAAI,KAAK,aAAa,SAAS;EACpC,UAAU,KAAS,MAAQ,YAAY;EACvC,uBAAuB;EACxB,CAAC,CAAC,OAAO,EAAM,GAJsB,OAAO,EAAM;AAWrD,QAJK,GAAM,SAKT,kBAAC,GAAD;EAAqB,OAAM;EAAO,QAAO;YACvC,kBAAC,GAAD;GACQ;GACN,QAAQ;IAAE,KAAK;IAAI,OAAO;IAAI,MAAM;IAAG,QAAQ;IAAG;GAClD,UAAU,MAAM;AACd,IAAI,GAAG,gBAAgB,MAAM,KAC3B,EAAY,EAAE,cAAc,GAAG,SAAS,EAAE,sBAAsB,EAAE;;aALxE;IASG,EAAO,aAAa,MACnB,kBAAC,GAAD;KAAe,iBAAgB;KAAM,QAAO;KAA8B,SAAS;KAAK,UAAU;KAAS,CAAA;IAG7G,kBAAC,GAAD;KACE,SAAS,EAAO,YAAY;KAC5B,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,CAAA;IAEF,kBAAC,GAAD;KACE,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,eAAe;KACf,OAAO,EAAO,WAAW,QAAQ;KACjC,QAAQ,EAAO,WAAW,CAAC,QAAQ,OAAO,GAAG,KAAA;KAC7C,mBAAmB,EAAO,YAAY,KAAA;KACtC,CAAA;IAEF,kBAAC,GAAD;KACE,SAAS,kBAAC,GAAD,EAAc,gBAAgB,GAAe,CAAA;KACtD,QAAQ;MAAE,MAAM;MAAyB,SAAS;MAAK;KACvD,CAAA;IAED,EAAO,eAAe,MACrB,kBAAC,GAAD;KACE,cAAc,EAAE,YAAY,IAAI;KAChC,YAAY,MAAU,kBAAC,QAAD;MAAM,OAAO,EAAE,OAAO,6BAA6B;gBAAG;MAAa,CAAA;KACzF,CAAA;IAGH,EAAuB,EAAO,eAAe;IAE7C,EAAS,KAAK,GAAK,MAClB,kBAAC,GAAD;KAEE,SAAS;KACT,MAAM,EAAO,cAAc,MAAQ;KACnC,MAAM,EAAO,SAAS,MAAU,EAAe,IAAQ,EAAe;KACtE,QAAQ;MAAC;MAAG;MAAG;MAAG;MAAE;KACpB,MAAM,EAAa,SAAS,EAAI;KAChC,SAAS,EAAO,UAAU,UAAU,KAAA;KACpC,EAPK,EAOL,CACF;IACe;;EACC,CAAA,GA7Df;EA+DT"}

package/dist/bigconsole/components/widgets/chart/charts/ComboChart.js

@@ -0,0 +1,139 @@
+import e from "../ChartTooltip.js";
+import { buildReferenceElements as t } from "./referenceElements.js";
+import { memo as n, useMemo as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Bar as o, CartesianGrid as s, ComposedChart as c, Legend as l, Line as u, ResponsiveContainer as d, Tooltip as f, XAxis as p, YAxis as m } from "recharts";
+//#region src/bigconsole/components/widgets/chart/charts/ComboChart.tsx
+var h = [
+	"var(--color-chart-1)",
+	"var(--color-chart-2)",
+	"var(--color-chart-3)",
+	"var(--color-chart-4)",
+	"var(--color-chart-5)"
+], g = n(function({ data: n = [], config: g, hiddenSeries: _ = [], onDataClick: v }) {
+	let y = r(() => g.series?.length ? g.series : n.length ? Object.keys(n[0]).filter((e) => e !== g.xAxisKey && typeof n[0][e] == "number").map((e, t) => ({
+		field: e,
+		type: t === 0 ? "bar" : "line",
+		axis: t === 0 ? "left" : "right"
+	})) : [], [
+		g.series,
+		n,
+		g.xAxisKey
+	]), b = r(() => y.some((e) => e.axis === "right"), [y]), x = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
+		notation: e >= 1e4 ? "compact" : "standard",
+		maximumFractionDigits: 2
+	}).format(e) : String(e);
+	return n?.length ? /* @__PURE__ */ i(d, {
+		width: "100%",
+		height: "100%",
+		children: /* @__PURE__ */ a(c, {
+			data: n,
+			margin: {
+				top: 10,
+				right: 10,
+				left: 0,
+				bottom: 0
+			},
+			onClick: (e) => {
+				e?.activePayload?.[0] && v && v(e.activePayload[0].payload, e.activeTooltipIndex || 0);
+			},
+			children: [
+				g.showGrid !== !1 && /* @__PURE__ */ i(s, {
+					strokeDasharray: "3 3",
+					stroke: "var(--color-border-default)",
+					opacity: .5,
+					vertical: !1
+				}),
+				/* @__PURE__ */ i(p, {
+					dataKey: g.xAxisKey || "name",
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" }
+				}),
+				/* @__PURE__ */ i(m, {
+					yAxisId: "left",
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" },
+					tickFormatter: x,
+					label: g.yAxisLabel ? {
+						value: g.yAxisLabel,
+						angle: -90,
+						position: "insideLeft",
+						fill: "var(--color-text-secondary)"
+					} : void 0
+				}),
+				b && /* @__PURE__ */ i(m, {
+					yAxisId: "right",
+					orientation: "right",
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" },
+					tickFormatter: x,
+					label: g.yAxisRightLabel ? {
+						value: g.yAxisRightLabel,
+						angle: 90,
+						position: "insideRight",
+						fill: "var(--color-text-secondary)"
+					} : void 0
+				}),
+				/* @__PURE__ */ i(f, {
+					content: /* @__PURE__ */ i(e, { valueFormatter: x }),
+					cursor: {
+						fill: "var(--color-bg-muted)",
+						opacity: .5
+					}
+				}),
+				g.showLegend !== !1 && /* @__PURE__ */ i(l, {
+					wrapperStyle: { paddingTop: 20 },
+					formatter: (e) => /* @__PURE__ */ i("span", {
+						style: { color: "var(--color-text-primary)" },
+						children: e
+					})
+				}),
+				y.map((e, t) => {
+					let n = e.color || g.colors?.[t] || h[t % h.length], r = e.axis === "right" && b ? "right" : "left", a = e.label || g.seriesNames?.[e.field] || e.field, s = _.includes(e.field);
+					return e.type === "line" ? /* @__PURE__ */ i(u, {
+						yAxisId: r,
+						type: g.curveType || "monotone",
+						dataKey: e.field,
+						name: a,
+						stroke: n,
+						strokeWidth: 2,
+						dot: g.showDots !== !1,
+						activeDot: { r: 6 },
+						hide: s,
+						connectNulls: !0
+					}, e.field) : /* @__PURE__ */ i(o, {
+						yAxisId: r,
+						dataKey: e.field,
+						name: a,
+						fill: n,
+						radius: [
+							4,
+							4,
+							0,
+							0
+						],
+						hide: s,
+						stackId: g.stacked ? "stack" : void 0
+					}, e.field);
+				}),
+				t(g.referenceLines, { yAxisId: "left" })
+			]
+		})
+	}) : null;
+});
+//#endregion
+export { g as default };
+
+//# sourceMappingURL=ComboChart.js.map

package/dist/bigconsole/components/widgets/chart/charts/ComboChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComboChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/ComboChart.tsx"],"sourcesContent":["/**\n * ComboChart Component\n *\n * Combo / dual-axis chart (mix of bars and lines, optional secondary Y-axis)\n * using Recharts `ComposedChart`. Drives the marketed\n * \"spend (bars) vs conversions (line)\" dual-axis view.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport { ComposedChart, Bar, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, Legend } from 'recharts';\nimport { ChartTooltip } from '../ChartTooltip';\nimport type { ChartConfig, ChartData, SeriesConfig } from './types';\nimport { buildReferenceElements } from './referenceElements';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ComboChartProps {\n  data: ChartData[];\n  config: ChartConfig;\n  hiddenSeries?: string[];\n  onDataClick?: (data: ChartData, index: number) => void;\n}\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_COLORS = [\n  'var(--color-chart-1)',\n  'var(--color-chart-2)',\n  'var(--color-chart-3)',\n  'var(--color-chart-4)',\n  'var(--color-chart-5)',\n];\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ComboChart: FC<ComboChartProps> = memo(function ComboChart({\n  data = [],\n  config,\n  hiddenSeries = [],\n  onDataClick,\n}) {\n  // Resolve series: explicit config wins; otherwise derive from numeric keys\n  // (first → bar on the left axis, the rest → lines on the right axis).\n  const series: SeriesConfig[] = useMemo(() => {\n    if (config.series?.length) return config.series;\n    if (!data.length) return [];\n    const keys = Object.keys(data[0]).filter((k) => k !== config.xAxisKey && typeof data[0][k] === 'number');\n    return keys.map((field, i) => ({\n      field,\n      type: i === 0 ? 'bar' : 'line',\n      axis: i === 0 ? 'left' : 'right',\n    }));\n  }, [config.series, data, config.xAxisKey]);\n\n  const hasRightAxis = useMemo(() => series.some((s) => s.axis === 'right'), [series]);\n\n  const formatValue = (value: number | string): string => {\n    if (typeof value !== 'number') return String(value);\n    return new Intl.NumberFormat('en-US', {\n      notation: value >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  if (!data?.length) {\n    return null;\n  }\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <ComposedChart\n        data={data}\n        margin={{ top: 10, right: 10, left: 0, bottom: 0 }}\n        onClick={(e) => {\n          if (e?.activePayload?.[0] && onDataClick) {\n            onDataClick(e.activePayload[0].payload, e.activeTooltipIndex || 0);\n          }\n        }}\n      >\n        {config.showGrid !== false && (\n          <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--color-border-default)\" opacity={0.5} vertical={false} />\n        )}\n\n        <XAxis\n          dataKey={config.xAxisKey || 'name'}\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n        />\n\n        <YAxis\n          yAxisId=\"left\"\n          tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n          tickLine={{ stroke: 'var(--color-border-default)' }}\n          axisLine={{ stroke: 'var(--color-border-default)' }}\n          tickFormatter={formatValue}\n          label={\n            config.yAxisLabel\n              ? { value: config.yAxisLabel, angle: -90, position: 'insideLeft', fill: 'var(--color-text-secondary)' }\n              : undefined\n          }\n        />\n\n        {hasRightAxis && (\n          <YAxis\n            yAxisId=\"right\"\n            orientation=\"right\"\n            tick={{ fill: 'var(--color-text-secondary)', fontSize: 12 }}\n            tickLine={{ stroke: 'var(--color-border-default)' }}\n            axisLine={{ stroke: 'var(--color-border-default)' }}\n            tickFormatter={formatValue}\n            label={\n              config.yAxisRightLabel\n                ? {\n                    value: config.yAxisRightLabel,\n                    angle: 90,\n                    position: 'insideRight',\n                    fill: 'var(--color-text-secondary)',\n                  }\n                : undefined\n            }\n          />\n        )}\n\n        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ fill: 'var(--color-bg-muted)', opacity: 0.5 }}\n        />\n\n        {config.showLegend !== false && (\n          <Legend\n            wrapperStyle={{ paddingTop: 20 }}\n            formatter={(value) => <span style={{ color: 'var(--color-text-primary)' }}>{value}</span>}\n          />\n        )}\n\n        {series.map((s, index) => {\n          const color = s.color || config.colors?.[index] || DEFAULT_COLORS[index % DEFAULT_COLORS.length];\n          const yAxisId = s.axis === 'right' && hasRightAxis ? 'right' : 'left';\n          const name = s.label || config.seriesNames?.[s.field] || s.field;\n          const hidden = hiddenSeries.includes(s.field);\n\n          if (s.type === 'line') {\n            return (\n              <Line\n                key={s.field}\n                yAxisId={yAxisId}\n                type={config.curveType || 'monotone'}\n                dataKey={s.field}\n                name={name}\n                stroke={color}\n                strokeWidth={2}\n                dot={config.showDots !== false}\n                activeDot={{ r: 6 }}\n                hide={hidden}\n                connectNulls\n              />\n            );\n          }\n          return (\n            <Bar\n              key={s.field}\n              yAxisId={yAxisId}\n              dataKey={s.field}\n              name={name}\n              fill={color}\n              radius={[4, 4, 0, 0]}\n              hide={hidden}\n              stackId={config.stacked ? 'stack' : undefined}\n            />\n          );\n        })}\n\n        {buildReferenceElements(config.referenceLines, { yAxisId: 'left' })}\n      </ComposedChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default ComboChart;\n"],"mappings":"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"}