@burdenoff/microfe-bigconsole 2026.613.2 → 2026.613.4

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

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

@@ -1 +1 @@
-{"version":3,"file":"LineChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/LineChart.tsx"],"sourcesContent":["/**\n * LineChart Component\n *\n * Line chart using Recharts.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  LineChart as RechartsLineChart,\n  Line,\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 LineChartProps {\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 LineChart: FC<LineChartProps> = memo(function LineChart({\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      <RechartsLineChart\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} />\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          label={\n            config.xAxisLabel\n              ? {\n                  value: config.xAxisLabel,\n                  position: 'insideBottom',\n                  offset: -5,\n                  fill: 'var(--color-text-secondary)',\n                }\n              : undefined\n          }\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          label={\n            config.yAxisLabel\n              ? {\n                  value: config.yAxisLabel,\n                  angle: -90,\n                  position: 'insideLeft',\n                  fill: 'var(--color-text-secondary)',\n                }\n              : undefined\n          }\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          <Line\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            dot={config.showDots !== false}\n            activeDot={{ r: 6 }}\n            hide={hiddenSeries.includes(key)}\n            connectNulls\n          />\n        ))}\n      </RechartsLineChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default LineChart;\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;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;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,OACE,EAAO,aACH;MACE,OAAO,EAAO;MACd,UAAU;MACV,QAAQ;MACR,MAAM;MACP,GACD,KAAA;KAEN,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,OACE,EAAO,aACH;MACE,OAAO,EAAO;MACd,OAAO;MACP,UAAU;MACV,MAAM;MACP,GACD,KAAA;KAEN,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,KAAK,EAAO,aAAa;KACzB,WAAW,EAAE,GAAG,GAAG;KACnB,MAAM,EAAa,SAAS,EAAI;KAChC,cAAA;KACA,EAVK,EAUL,CACF;IACgB;;EACA,CAAA,GA/Ef;EAiFT"}
+{"version":3,"file":"LineChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/LineChart.tsx"],"sourcesContent":["/**\n * LineChart Component\n *\n * Line chart using Recharts.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  LineChart as RechartsLineChart,\n  Line,\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 LineChartProps {\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 LineChart: FC<LineChartProps> = memo(function LineChart({\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      <RechartsLineChart\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} />\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          label={\n            config.xAxisLabel\n              ? {\n                  value: config.xAxisLabel,\n                  position: 'insideBottom',\n                  offset: -5,\n                  fill: 'var(--color-text-secondary)',\n                }\n              : undefined\n          }\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          label={\n            config.yAxisLabel\n              ? {\n                  value: config.yAxisLabel,\n                  angle: -90,\n                  position: 'insideLeft',\n                  fill: 'var(--color-text-secondary)',\n                }\n              : undefined\n          }\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          <Line\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            dot={config.showDots !== false}\n            activeDot={{ r: 6 }}\n            hide={hiddenSeries.includes(key)}\n            connectNulls\n          />\n        ))}\n      </RechartsLineChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default LineChart;\n"],"mappings":";;;;;;AAwCA,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;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;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,OACE,EAAO,aACH;MACE,OAAO,EAAO;MACd,UAAU;MACV,QAAQ;MACR,MAAM;MACP,GACD,KAAA;KAEN,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,OACE,EAAO,aACH;MACE,OAAO,EAAO;MACd,OAAO;MACP,UAAU;MACV,MAAM;MACP,GACD,KAAA;KAEN,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,EAAuB,EAAO,eAAe;IAE7C,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,KAAK,EAAO,aAAa;KACzB,WAAW,EAAE,GAAG,GAAG;KACnB,MAAM,EAAa,SAAS,EAAI;KAChC,cAAA;KACA,EAVK,EAUL,CACF;IACgB;;EACA,CAAA,GApFf;EAsFT"}

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

@@ -0,0 +1,128 @@
+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 { CartesianGrid as o, Legend as s, ResponsiveContainer as c, Scatter as l, ScatterChart as u, Tooltip as d, XAxis as f, YAxis as p, ZAxis as m } from "recharts";
+//#region src/bigconsole/components/widgets/chart/charts/ScatterChart.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, onDataClick: _ }) {
+	let { xKey: v, yKey: y } = r(() => {
+		if (g.xField && g.yField) return {
+			xKey: g.xField,
+			yKey: g.yField
+		};
+		let e = n.length ? Object.keys(n[0]).filter((e) => typeof n[0][e] == "number") : [];
+		return {
+			xKey: g.xField || e[0] || "x",
+			yKey: g.yField || e[1] || "y"
+		};
+	}, [
+		g.xField,
+		g.yField,
+		n
+	]), b = g.sizeField, x = g.colorField, S = r(() => {
+		if (!x) return [{
+			name: g.seriesNames?.[y] || y,
+			points: n
+		}];
+		let e = /* @__PURE__ */ new Map();
+		for (let t of n) {
+			let n = String(t[x] ?? "—");
+			e.has(n) || e.set(n, []), e.get(n).push(t);
+		}
+		return Array.from(e.entries()).map(([e, t]) => ({
+			name: e,
+			points: t
+		}));
+	}, [
+		n,
+		x,
+		y,
+		g.seriesNames
+	]), C = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
+		notation: Math.abs(e) >= 1e4 ? "compact" : "standard",
+		maximumFractionDigits: 2
+	}).format(e) : String(e);
+	return n?.length ? /* @__PURE__ */ i(c, {
+		width: "100%",
+		height: "100%",
+		children: /* @__PURE__ */ a(u, {
+			margin: {
+				top: 10,
+				right: 10,
+				left: 0,
+				bottom: 0
+			},
+			children: [
+				g.showGrid !== !1 && /* @__PURE__ */ i(o, {
+					strokeDasharray: "3 3",
+					stroke: "var(--color-border-default)",
+					opacity: .5
+				}),
+				/* @__PURE__ */ i(f, {
+					type: "number",
+					dataKey: v,
+					name: g.xAxisLabel || v,
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" },
+					tickFormatter: C,
+					scale: g.logScale ? "log" : "auto",
+					domain: g.logScale ? ["auto", "auto"] : void 0
+				}),
+				/* @__PURE__ */ i(p, {
+					type: "number",
+					dataKey: y,
+					name: g.yAxisLabel || y,
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" },
+					tickFormatter: C,
+					scale: g.logScale ? "log" : "auto",
+					domain: g.logScale ? ["auto", "auto"] : void 0
+				}),
+				b && /* @__PURE__ */ i(m, {
+					type: "number",
+					dataKey: b,
+					range: [40, 400],
+					name: b
+				}),
+				/* @__PURE__ */ i(d, {
+					content: /* @__PURE__ */ i(e, { valueFormatter: C }),
+					cursor: {
+						strokeDasharray: "3 3",
+						stroke: "var(--color-border-default)"
+					}
+				}),
+				S.length > 1 && g.showLegend !== !1 && /* @__PURE__ */ i(s, { formatter: (e) => /* @__PURE__ */ i("span", {
+					style: { color: "var(--color-text-primary)" },
+					children: e
+				}) }),
+				t(g.referenceLines),
+				S.map((e, t) => /* @__PURE__ */ i(l, {
+					name: e.name,
+					data: e.points,
+					fill: g.colors?.[t] || h[t % h.length],
+					onClick: (e) => {
+						_ && e?.payload && _(e.payload, 0);
+					}
+				}, e.name))
+			]
+		})
+	}) : null;
+});
+//#endregion
+export { g as default };
+
+//# sourceMappingURL=ScatterChart.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScatterChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/ScatterChart.tsx"],"sourcesContent":["/**\n * ScatterChart Component\n *\n * Scatter / bubble chart using Recharts `ScatterChart`. Plots `xField` vs\n * `yField`; an optional `sizeField` drives bubble radius (ZAxis) and an\n * optional `colorField` splits points into colored groups.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport {\n  ScatterChart as RechartsScatterChart,\n  Scatter,\n  XAxis,\n  YAxis,\n  ZAxis,\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\nexport interface ScatterChartProps {\n  data: ChartData[];\n  config: ChartConfig;\n  hiddenSeries?: string[];\n  onDataClick?: (data: ChartData, index: number) => void;\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\nexport const ScatterChart: FC<ScatterChartProps> = memo(function ScatterChart({ data = [], config, onDataClick }) {\n  // Resolve axis fields, falling back to the first two numeric fields.\n  const { xKey, yKey } = useMemo(() => {\n    if (config.xField && config.yField) return { xKey: config.xField, yKey: config.yField };\n    const numeric = data.length ? Object.keys(data[0]).filter((k) => typeof data[0][k] === 'number') : [];\n    return { xKey: config.xField || numeric[0] || 'x', yKey: config.yField || numeric[1] || 'y' };\n  }, [config.xField, config.yField, data]);\n\n  const sizeKey = config.sizeField;\n  const colorKey = config.colorField;\n\n  // Group points by colorField (single group when absent).\n  const groups = useMemo(() => {\n    if (!colorKey) return [{ name: config.seriesNames?.[yKey] || yKey, points: data }];\n    const map = new Map<string, ChartData[]>();\n    for (const row of data) {\n      const key = String(row[colorKey] ?? '—');\n      if (!map.has(key)) map.set(key, []);\n      map.get(key)!.push(row);\n    }\n    return Array.from(map.entries()).map(([name, points]) => ({ name, points }));\n  }, [data, colorKey, yKey, config.seriesNames]);\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: Math.abs(value) >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  if (!data?.length) return null;\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <RechartsScatterChart margin={{ top: 10, right: 10, left: 0, bottom: 0 }}>\n        {config.showGrid !== false && (\n          <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--color-border-default)\" opacity={0.5} />\n        )}\n        <XAxis\n          type=\"number\"\n          dataKey={xKey}\n          name={config.xAxisLabel || xKey}\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        />\n        <YAxis\n          type=\"number\"\n          dataKey={yKey}\n          name={config.yAxisLabel || yKey}\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        />\n        {sizeKey && <ZAxis type=\"number\" dataKey={sizeKey} range={[40, 400]} name={sizeKey} />}\n        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ strokeDasharray: '3 3', stroke: 'var(--color-border-default)' }}\n        />\n        {groups.length > 1 && config.showLegend !== false && (\n          <Legend formatter={(value) => <span style={{ color: 'var(--color-text-primary)' }}>{value}</span>} />\n        )}\n        {buildReferenceElements(config.referenceLines)}\n        {groups.map((g, i) => (\n          <Scatter\n            key={g.name}\n            name={g.name}\n            data={g.points}\n            fill={config.colors?.[i] || DEFAULT_COLORS[i % DEFAULT_COLORS.length]}\n            onClick={(point) => {\n              if (onDataClick && point?.payload) onDataClick(point.payload as ChartData, 0);\n            }}\n          />\n        ))}\n      </RechartsScatterChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default ScatterChart;\n"],"mappings":"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"}

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

@@ -0,0 +1,111 @@
+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, BarChart as s, CartesianGrid as c, Cell as l, ResponsiveContainer as u, Tooltip as d, XAxis as f, YAxis as p } from "recharts";
+//#region src/bigconsole/components/widgets/chart/charts/WaterfallChart.tsx
+var m = "var(--color-status-success)", h = "var(--color-status-error)", g = "var(--color-chart-1)", _ = n(function({ data: n = [], config: _, onDataClick: v }) {
+	let y = _.labelField || _.xAxisKey || "name", b = _.valueField || "value", x = r(() => {
+		if (!n.length) return [];
+		let e = 0, t = n.map((t) => {
+			let n = typeof t[b] == "number" ? t[b] : Number(t[b]) || 0, r = n >= 0 ? e : e + n;
+			return e += n, {
+				name: String(t[y] ?? ""),
+				base: r,
+				delta: Math.abs(n),
+				cumulative: e,
+				isTotal: !1,
+				sign: n >= 0 ? "up" : "down"
+			};
+		});
+		return _.showTotal && t.push({
+			name: _.totalLabel || "Total",
+			base: 0,
+			delta: e,
+			cumulative: e,
+			isTotal: !0,
+			sign: "total"
+		}), t;
+	}, [
+		n,
+		y,
+		b,
+		_.showTotal,
+		_.totalLabel
+	]), S = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
+		notation: Math.abs(e) >= 1e4 ? "compact" : "standard",
+		maximumFractionDigits: 2
+	}).format(e) : String(e);
+	return x.length ? /* @__PURE__ */ i(u, {
+		width: "100%",
+		height: "100%",
+		children: /* @__PURE__ */ a(s, {
+			data: x,
+			margin: {
+				top: 10,
+				right: 10,
+				left: 0,
+				bottom: 0
+			},
+			onClick: (e) => {
+				e?.activePayload?.[0] && v && v(e.activePayload[0].payload, e.activeTooltipIndex || 0);
+			},
+			children: [
+				_.showGrid !== !1 && /* @__PURE__ */ i(c, {
+					strokeDasharray: "3 3",
+					stroke: "var(--color-border-default)",
+					opacity: .5,
+					vertical: !1
+				}),
+				/* @__PURE__ */ i(f, {
+					dataKey: "name",
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" }
+				}),
+				/* @__PURE__ */ i(p, {
+					tick: {
+						fill: "var(--color-text-secondary)",
+						fontSize: 12
+					},
+					tickLine: { stroke: "var(--color-border-default)" },
+					axisLine: { stroke: "var(--color-border-default)" },
+					tickFormatter: S
+				}),
+				/* @__PURE__ */ i(d, {
+					content: /* @__PURE__ */ i(e, { valueFormatter: S }),
+					cursor: {
+						fill: "var(--color-bg-muted)",
+						opacity: .5
+					}
+				}),
+				t(_.referenceLines),
+				/* @__PURE__ */ i(o, {
+					dataKey: "base",
+					stackId: "wf",
+					fill: "transparent",
+					isAnimationActive: !1
+				}),
+				/* @__PURE__ */ i(o, {
+					dataKey: "delta",
+					stackId: "wf",
+					radius: [
+						4,
+						4,
+						0,
+						0
+					],
+					name: "Change",
+					children: x.map((e, t) => /* @__PURE__ */ i(l, { fill: e.sign === "total" ? g : e.sign === "up" ? m : h }, t))
+				})
+			]
+		})
+	}) : null;
+});
+//#endregion
+export { _ as default };
+
+//# sourceMappingURL=WaterfallChart.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"WaterfallChart.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/WaterfallChart.tsx"],"sourcesContent":["/**\n * WaterfallChart Component\n *\n * Bridge / waterfall chart (budget-vs-actual, P&L) using a Recharts stacked\n * BarChart: a transparent \"base\" bar floats each visible delta bar to its\n * running cumulative position. Positive steps render success-toned, negative\n * steps danger-toned, and an optional final bar shows the cumulative total.\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  Cell,\n} from 'recharts';\nimport { ChartTooltip } from '../ChartTooltip';\nimport type { ChartConfig, ChartData } from './types';\nimport { buildReferenceElements } from './referenceElements';\n\nexport interface WaterfallChartProps {\n  data: ChartData[];\n  config: ChartConfig;\n  hiddenSeries?: string[];\n  onDataClick?: (data: ChartData, index: number) => void;\n}\n\ninterface WaterfallRow {\n  name: string;\n  base: number;\n  delta: number;\n  cumulative: number;\n  isTotal: boolean;\n  sign: 'up' | 'down' | 'total';\n}\n\nconst COLOR_UP = 'var(--color-status-success)';\nconst COLOR_DOWN = 'var(--color-status-error)';\nconst COLOR_TOTAL = 'var(--color-chart-1)';\n\nexport const WaterfallChart: FC<WaterfallChartProps> = memo(function WaterfallChart({\n  data = [],\n  config,\n  onDataClick,\n}) {\n  const labelKey = config.labelField || config.xAxisKey || 'name';\n  const valueKey = config.valueField || 'value';\n\n  const rows: WaterfallRow[] = useMemo(() => {\n    if (!data.length) return [];\n    let cumulative = 0;\n    const out: WaterfallRow[] = data.map((d) => {\n      const delta = typeof d[valueKey] === 'number' ? (d[valueKey] as number) : Number(d[valueKey]) || 0;\n      const base = delta >= 0 ? cumulative : cumulative + delta;\n      cumulative += delta;\n      return {\n        name: String(d[labelKey] ?? ''),\n        base,\n        delta: Math.abs(delta),\n        cumulative,\n        isTotal: false,\n        sign: delta >= 0 ? 'up' : 'down',\n      };\n    });\n    if (config.showTotal) {\n      out.push({\n        name: config.totalLabel || 'Total',\n        base: 0,\n        delta: cumulative,\n        cumulative,\n        isTotal: true,\n        sign: 'total',\n      });\n    }\n    return out;\n  }, [data, labelKey, valueKey, config.showTotal, config.totalLabel]);\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: Math.abs(value) >= 10000 ? 'compact' : 'standard',\n      maximumFractionDigits: 2,\n    }).format(value);\n  };\n\n  if (!rows.length) return null;\n\n  return (\n    <ResponsiveContainer width=\"100%\" height=\"100%\">\n      <RechartsBarChart\n        data={rows}\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        <XAxis\n          dataKey=\"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        <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        <Tooltip\n          content={<ChartTooltip valueFormatter={formatValue} />}\n          cursor={{ fill: 'var(--color-bg-muted)', opacity: 0.5 }}\n        />\n        {buildReferenceElements(config.referenceLines)}\n        {/* Transparent floating base */}\n        <Bar dataKey=\"base\" stackId=\"wf\" fill=\"transparent\" isAnimationActive={false} />\n        {/* Visible delta, colored by direction */}\n        <Bar dataKey=\"delta\" stackId=\"wf\" radius={[4, 4, 0, 0]} name=\"Change\">\n          {rows.map((r, i) => (\n            <Cell key={i} fill={r.sign === 'total' ? COLOR_TOTAL : r.sign === 'up' ? COLOR_UP : COLOR_DOWN} />\n          ))}\n        </Bar>\n      </RechartsBarChart>\n    </ResponsiveContainer>\n  );\n});\n\nexport default WaterfallChart;\n"],"mappings":";;;;;;AAwCA,IAAM,IAAW,+BACX,IAAa,6BACb,IAAc,wBAEP,IAA0C,EAAK,SAAwB,EAClF,UAAO,EAAE,EACT,WACA,kBACC;CACD,IAAM,IAAW,EAAO,cAAc,EAAO,YAAY,QACnD,IAAW,EAAO,cAAc,SAEhC,IAAuB,QAAc;AACzC,MAAI,CAAC,EAAK,OAAQ,QAAO,EAAE;EAC3B,IAAI,IAAa,GACX,IAAsB,EAAK,KAAK,MAAM;GAC1C,IAAM,IAAQ,OAAO,EAAE,MAAc,WAAY,EAAE,KAAuB,OAAO,EAAE,GAAU,IAAI,GAC3F,IAAO,KAAS,IAAI,IAAa,IAAa;AAEpD,UADA,KAAc,GACP;IACL,MAAM,OAAO,EAAE,MAAa,GAAG;IAC/B;IACA,OAAO,KAAK,IAAI,EAAM;IACtB;IACA,SAAS;IACT,MAAM,KAAS,IAAI,OAAO;IAC3B;IACD;AAWF,SAVI,EAAO,aACT,EAAI,KAAK;GACP,MAAM,EAAO,cAAc;GAC3B,MAAM;GACN,OAAO;GACP;GACA,SAAS;GACT,MAAM;GACP,CAAC,EAEG;IACN;EAAC;EAAM;EAAU;EAAU,EAAO;EAAW,EAAO;EAAW,CAAC,EAE7D,KAAe,MACf,OAAO,KAAU,WACd,IAAI,KAAK,aAAa,SAAS;EACpC,UAAU,KAAK,IAAI,EAAM,IAAI,MAAQ,YAAY;EACjD,uBAAuB;EACxB,CAAC,CAAC,OAAO,EAAM,GAJsB,OAAO,EAAM;AASrD,QAFK,EAAK,SAGR,kBAAC,GAAD;EAAqB,OAAM;EAAO,QAAO;YACvC,kBAAC,GAAD;GACE,MAAM;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;IAE7G,kBAAC,GAAD;KACE,SAAQ;KACR,MAAM;MAAE,MAAM;MAA+B,UAAU;MAAI;KAC3D,UAAU,EAAE,QAAQ,+BAA+B;KACnD,UAAU,EAAE,QAAQ,+BAA+B;KACnD,CAAA;IACF,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;IACF,kBAAC,GAAD;KACE,SAAS,kBAAC,GAAD,EAAc,gBAAgB,GAAe,CAAA;KACtD,QAAQ;MAAE,MAAM;MAAyB,SAAS;MAAK;KACvD,CAAA;IACD,EAAuB,EAAO,eAAe;IAE9C,kBAAC,GAAD;KAAK,SAAQ;KAAO,SAAQ;KAAK,MAAK;KAAc,mBAAmB;KAAS,CAAA;IAEhF,kBAAC,GAAD;KAAK,SAAQ;KAAQ,SAAQ;KAAK,QAAQ;MAAC;MAAG;MAAG;MAAG;MAAE;KAAE,MAAK;eAC1D,EAAK,KAAK,GAAG,MACZ,kBAAC,GAAD,EAAc,MAAM,EAAE,SAAS,UAAU,IAAc,EAAE,SAAS,OAAO,IAAW,GAAc,EAAvF,EAAuF,CAClG;KACE,CAAA;IACW;;EACC,CAAA,GA1CC;EA4CzB"}

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

@@ -1,5 +1,9 @@
+import "./referenceElements.js";
 import "./LineChart.js";
 import "./BarChart.js";
 import "./AreaChart.js";
 import "./PieChart.js";
 import "./FunnelChart.js";
+import "./ComboChart.js";
+import "./WaterfallChart.js";
+import "./ScatterChart.js";

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

@@ -0,0 +1,49 @@
+import { intentToCssVar as e } from "../../utils/conditionalFormat.js";
+import { jsx as t } from "react/jsx-runtime";
+import { ReferenceArea as n, ReferenceLine as r } from "recharts";
+//#region src/bigconsole/components/widgets/chart/charts/referenceElements.tsx
+function i(i, a) {
+	return i?.length ? i.map((i, o) => {
+		let s = e(i.color ?? "danger"), c = (i.axis ?? "y") === "y", l = a?.yAxisId;
+		if (i.value2 != null) {
+			let e = Math.min(i.value, i.value2), r = Math.max(i.value, i.value2);
+			return /* @__PURE__ */ t(n, {
+				...c ? {
+					y1: e,
+					y2: r
+				} : {
+					x1: e,
+					x2: r
+				},
+				...l == null ? {} : { yAxisId: l },
+				fill: s,
+				fillOpacity: .1,
+				stroke: s,
+				strokeOpacity: .3,
+				label: i.label ? {
+					value: i.label,
+					fill: s,
+					fontSize: 11,
+					position: "insideTopLeft"
+				} : void 0
+			}, `ref-band-${o}`);
+		}
+		return /* @__PURE__ */ t(r, {
+			...c ? { y: i.value } : { x: i.value },
+			...l == null ? {} : { yAxisId: l },
+			stroke: s,
+			strokeWidth: 1.5,
+			strokeDasharray: i.dashed === !1 ? void 0 : "6 4",
+			label: i.label ? {
+				value: i.label,
+				fill: s,
+				fontSize: 11,
+				position: "right"
+			} : void 0
+		}, `ref-line-${o}`);
+	}) : [];
+}
+//#endregion
+export { i as buildReferenceElements };
+
+//# sourceMappingURL=referenceElements.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"referenceElements.js","names":[],"sources":["../../../../../../src/bigconsole/components/widgets/chart/charts/referenceElements.tsx"],"sourcesContent":["/**\n * Reference / threshold line & band helpers (Recharts).\n *\n * Builds `ReferenceLine` / `ReferenceArea` elements from a widget's\n * `config.referenceLines`. Colors are resolved from semantic intents so\n * targets / control limits / SLAs stay theme-aware.\n */\n\nimport { ReferenceLine, ReferenceArea } from 'recharts';\nimport type { ReactElement } from 'react';\nimport { intentToCssVar, type SemanticIntent } from '../../utils/conditionalFormat';\n\nexport interface ReferenceLineConfig {\n  axis?: 'x' | 'y';\n  value: number;\n  value2?: number;\n  label?: string;\n  color?: SemanticIntent;\n  dashed?: boolean;\n}\n\n/**\n * Build reference line/band elements for a cartesian chart.\n * `yAxisIds` lets dual-axis charts target the correct axis (defaults to none).\n */\nexport function buildReferenceElements(\n  referenceLines: ReferenceLineConfig[] | undefined,\n  opts?: { yAxisId?: string | number }\n): ReactElement[] {\n  if (!referenceLines?.length) return [];\n\n  return referenceLines.map((ref, index) => {\n    const color = intentToCssVar(ref.color ?? 'danger');\n    const onY = (ref.axis ?? 'y') === 'y';\n    const yAxisId = opts?.yAxisId;\n\n    // Band (shaded area) when a second bound is supplied.\n    if (ref.value2 != null) {\n      const lo = Math.min(ref.value, ref.value2);\n      const hi = Math.max(ref.value, ref.value2);\n      return (\n        <ReferenceArea\n          key={`ref-band-${index}`}\n          {...(onY ? { y1: lo, y2: hi } : { x1: lo, x2: hi })}\n          {...(yAxisId != null ? { yAxisId } : {})}\n          fill={color}\n          fillOpacity={0.1}\n          stroke={color}\n          strokeOpacity={0.3}\n          label={ref.label ? { value: ref.label, fill: color, fontSize: 11, position: 'insideTopLeft' } : undefined}\n        />\n      );\n    }\n\n    return (\n      <ReferenceLine\n        key={`ref-line-${index}`}\n        {...(onY ? { y: ref.value } : { x: ref.value })}\n        {...(yAxisId != null ? { yAxisId } : {})}\n        stroke={color}\n        strokeWidth={1.5}\n        strokeDasharray={ref.dashed === false ? undefined : '6 4'}\n        label={ref.label ? { value: ref.label, fill: color, fontSize: 11, position: 'right' } : undefined}\n      />\n    );\n  });\n}\n"],"mappings":";;;;AAyBA,SAAgB,EACd,GACA,GACgB;AAGhB,QAFK,GAAgB,SAEd,EAAe,KAAK,GAAK,MAAU;EACxC,IAAM,IAAQ,EAAe,EAAI,SAAS,SAAS,EAC7C,KAAO,EAAI,QAAQ,SAAS,KAC5B,IAAU,GAAM;AAGtB,MAAI,EAAI,UAAU,MAAM;GACtB,IAAM,IAAK,KAAK,IAAI,EAAI,OAAO,EAAI,OAAO,EACpC,IAAK,KAAK,IAAI,EAAI,OAAO,EAAI,OAAO;AAC1C,UACE,kBAAC,GAAD;IAEE,GAAK,IAAM;KAAE,IAAI;KAAI,IAAI;KAAI,GAAG;KAAE,IAAI;KAAI,IAAI;KAAI;IAClD,GAAK,KAAW,OAAqB,EAAE,GAAhB,EAAE,YAAS;IAClC,MAAM;IACN,aAAa;IACb,QAAQ;IACR,eAAe;IACf,OAAO,EAAI,QAAQ;KAAE,OAAO,EAAI;KAAO,MAAM;KAAO,UAAU;KAAI,UAAU;KAAiB,GAAG,KAAA;IAChG,EARK,YAAY,IAQjB;;AAIN,SACE,kBAAC,GAAD;GAEE,GAAK,IAAM,EAAE,GAAG,EAAI,OAAO,GAAG,EAAE,GAAG,EAAI,OAAO;GAC9C,GAAK,KAAW,OAAqB,EAAE,GAAhB,EAAE,YAAS;GAClC,QAAQ;GACR,aAAa;GACb,iBAAiB,EAAI,WAAW,KAAQ,KAAA,IAAY;GACpD,OAAO,EAAI,QAAQ;IAAE,OAAO,EAAI;IAAO,MAAM;IAAO,UAAU;IAAI,UAAU;IAAS,GAAG,KAAA;GACxF,EAPK,YAAY,IAOjB;GAEJ,GApCkC,EAAE"}