@burdenoff/microfe-bigconsole 2026.613.3 → 2026.613.4

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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"}

package/dist/bigconsole/components/widgets/chart/charts/LineChart.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 { CartesianGrid as a, Legend as o, Line as s, LineChart 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 { CartesianGrid as o, Legend as s, Line as c, LineChart as l, ResponsiveContainer as u, Tooltip as d, XAxis as f, YAxis as p } from "recharts";
 //#region src/bigconsole/components/widgets/chart/charts/LineChart.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(c, {
-			data: t,
+		children: /* @__PURE__ */ a(l, {
+			data: n,
 			margin: {
 				top: 10,
 				right: 10,
@@ -26,64 +27,68 @@ 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(a, {
+				h.showGrid !== !1 && /* @__PURE__ */ i(o, {
 					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
 					},
 					tickLine: { stroke: "var(--color-border-default)" },
 					axisLine: { stroke: "var(--color-border-default)" },
-					label: m.xAxisLabel ? {
-						value: m.xAxisLabel,
+					label: h.xAxisLabel ? {
+						value: h.xAxisLabel,
 						position: "insideBottom",
 						offset: -5,
 						fill: "var(--color-text-secondary)"
 					} : void 0
 				}),
-				/* @__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,
-					label: m.yAxisLabel ? {
-						value: m.yAxisLabel,
+					tickFormatter: y,
+					scale: h.logScale ? "log" : "auto",
+					domain: h.logScale ? ["auto", "auto"] : void 0,
+					allowDataOverflow: h.logScale || void 0,
+					label: h.yAxisLabel ? {
+						value: h.yAxisLabel,
 						angle: -90,
 						position: "insideLeft",
 						fill: "var(--color-text-secondary)"
 					} : 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(o, {
+				h.showLegend !== !1 && /* @__PURE__ */ i(s, {
 					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(s, {
-					type: m.curveType || "monotone",
+				t(h.referenceLines),
+				v.map((e, t) => /* @__PURE__ */ i(c, {
+					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,
-					dot: m.showDots !== !1,
+					dot: h.showDots !== !1,
 					activeDot: { r: 6 },
-					hide: h.includes(e),
+					hide: g.includes(e),
 					connectNulls: !0
 				}, e))
 			]
@@ -91,6 +96,6 @@ var p = [
 	}) : null;
 });
 //#endregion
-export { m as default };
+export { h as default };
 
 //# sourceMappingURL=LineChart.js.map