@burdenoff/microfe-bigconsole 2026.1012.1 → 2026.1012.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/bigconsole/components/dashboard/CreateDashboardDialog.js +328 -308
  2. package/dist/bigconsole/components/dashboard/TemplateLayoutPreview.js +3 -3
  3. package/dist/bigconsole/components/widgets/chart/ChartWidget.js +125 -129
  4. package/dist/bigconsole/components/widgets/chart/charts/AreaChart.js +50 -45
  5. package/dist/bigconsole/components/widgets/chart/charts/BarChart.js +40 -35
  6. package/dist/bigconsole/components/widgets/chart/charts/ComboChart.js +41 -48
  7. package/dist/bigconsole/components/widgets/chart/charts/LineChart.js +41 -36
  8. package/dist/bigconsole/components/widgets/chart/charts/numericSeries.d.ts +6 -0
  9. package/dist/bigconsole/components/widgets/chart/charts/numericSeries.js +26 -0
  10. package/dist/bigconsole/components/widgets/chart/charts/types.d.ts +2 -0
  11. package/package.json +1 -1
package/dist/bigconsole/components/dashboard/TemplateLayoutPreview.js CHANGED
@@ -24,16 +24,16 @@ function i({ content: i }) {
24
24
  gap: "var(--space-controlGap)"
25
25
  },
26
26
  children: Array.isArray(n.widgets) && n.widgets.filter(r).map((n, i) => {
27
- let o = r(n.config) ? n.config : {}, s = typeof o.chartType == "string" ? a("bigconsole.dashboards.templatePreview.chartType", "{type} chart", { type: o.chartType }) : typeof n.type == "string" ? n.type.toLowerCase().replaceAll("_", " ") : a("bigconsole.dashboards.templatePreview.widgetType", "Widget"), c = r(n.position) ? n.position : {};
27
+ let o = r(n.config) ? n.config : {}, s = typeof o._internalWidgetType == "string" && o._internalWidgetType.trim() ? o._internalWidgetType : n.type, c = typeof o.chartType == "string" ? a("bigconsole.dashboards.templatePreview.chartType", "{type} chart", { type: o.chartType }) : typeof s == "string" ? s.toLowerCase().replaceAll("_", " ") : a("bigconsole.dashboards.templatePreview.widgetType", "Widget"), l = r(n.position) ? n.position : {};
28
28
  return /* @__PURE__ */ t("div", {
29
29
  className: "rounded-card border border-border-default bg-bg-sunken p-3",
30
- style: { gridColumn: `span ${typeof c.width == "number" ? Math.min(12, Math.max(1, Math.round(c.width))) : 6}` },
30
+ style: { gridColumn: `span ${typeof l.width == "number" ? Math.min(12, Math.max(1, Math.round(l.width))) : 6}` },
31
31
  children: [/* @__PURE__ */ e("p", {
32
32
  className: "truncate text-xs font-medium",
33
33
  children: typeof n.title == "string" ? n.title : a("bigconsole.dashboards.templatePreview.widget", "Widget {number}", { number: i + 1 })
34
34
  }), /* @__PURE__ */ e("p", {
35
35
  className: "truncate text-xs text-text-muted",
36
- children: s
36
+ children: c
37
37
  })]
38
38
  }, i);
39
39
  })
package/dist/bigconsole/components/widgets/chart/ChartWidget.js CHANGED
@@ -1,106 +1,102 @@
1
1
  import { useCrossFilterContext as e, useWidgetCrossFilter as t } from "../../../contexts/CrossFilterContext.js";
2
2
  import "../../../contexts/index.js";
3
3
  import n from "./ChartLegend.js";
4
- import r from "./charts/LineChart.js";
5
- import i from "./charts/BarChart.js";
6
- import a from "./charts/AreaChart.js";
7
- import o from "./charts/PieChart.js";
8
- import s from "./charts/FunnelChart.js";
9
- import c from "./charts/ComboChart.js";
10
- import l from "./charts/WaterfallChart.js";
11
- import u from "./charts/ScatterChart.js";
12
- import { memo as d, useCallback as f, useMemo as p, useState as m } from "react";
13
- import { jsx as h, jsxs as g } from "react/jsx-runtime";
4
+ import { configuredNumericSeries as r, numericSeriesKeys as i } from "./charts/numericSeries.js";
5
+ import a from "./charts/LineChart.js";
6
+ import o from "./charts/BarChart.js";
7
+ import s from "./charts/AreaChart.js";
8
+ import c from "./charts/PieChart.js";
9
+ import l from "./charts/FunnelChart.js";
10
+ import u from "./charts/ComboChart.js";
11
+ import d from "./charts/WaterfallChart.js";
12
+ import f from "./charts/ScatterChart.js";
13
+ import { memo as p, useCallback as m, useMemo as h, useState as g } from "react";
14
+ import { jsx as _, jsxs as v } from "react/jsx-runtime";
14
15
  //#region src/bigconsole/components/widgets/chart/ChartWidget.tsx
15
- var _ = [
16
+ var y = [
16
17
  "var(--color-chart-1)",
17
18
  "var(--color-chart-2)",
18
19
  "var(--color-chart-3)",
19
20
  "var(--color-chart-4)",
20
21
  "var(--color-chart-5)"
21
- ], v = d(function({ widget: d, data: v = [], onClick: y, onDrilldown: b }) {
22
- let x = d.config, [S, C] = m([]), { handleDataClick: w, enabled: T } = t(d.id, x?.crossFilterMappings || [{
23
- sourceField: x?.labelField || "name",
22
+ ], b = p(function({ widget: p, data: b = [], onClick: x, onDrilldown: S }) {
23
+ let C = p.config, [w, T] = g([]), { handleDataClick: E, enabled: D } = t(p.id, C?.crossFilterMappings || [{
24
+ sourceField: C?.labelField || "name",
24
25
  targetFilterId: "category"
25
- }]), { clearAllCrossFilters: E, hasCrossFilters: D } = e(), O = p(() => ({
26
- type: x?.chartType?.toLowerCase() || "line",
27
- xAxisKey: x?.xAxisField || "name",
28
- xAxisLabel: x?.xAxisLabel,
29
- yAxisLabel: x?.yAxisLabel,
30
- showGrid: x?.showGrid,
31
- showLegend: x?.showLegend,
32
- legendPosition: x?.legendPosition,
33
- showDots: x?.showDataPoints,
34
- curveType: x?.curveType,
35
- colors: x?.colors,
36
- seriesNames: x?.seriesLabels,
37
- stacked: x?.stacked,
38
- isDonut: x?.showAsDonut,
39
- innerRadius: x?.innerRadius,
40
- outerRadius: x?.outerRadius,
41
- referenceLines: x?.referenceLines,
42
- series: x?.series,
43
- dualAxis: x?.dualAxis,
44
- yAxisRightLabel: x?.yAxisRightLabel,
45
- logScale: x?.logScale,
46
- valueField: x?.valueField,
47
- labelField: x?.labelField,
48
- showTotal: x?.showTotal,
49
- totalLabel: x?.totalLabel,
50
- xField: x?.xField,
51
- yField: x?.yField,
52
- sizeField: x?.sizeField,
53
- colorField: x?.colorField
54
- }), [x]), k = p(() => {
55
- if (!v.length || O.type === "pie" || O.type === "funnel" || O.type === "scatter" || O.type === "waterfall") return [];
56
- let e = x?.selectedFields;
57
- return Object.keys(v[0]).filter((t) => {
58
- let n = t !== O.xAxisKey && typeof v[0][t] == "number";
59
- return e && e.length > 0 ? n && e.includes(t) : n;
60
- }).map((e, t) => ({
61
- dataKey: e,
62
- name: O.seriesNames?.[e] || e,
63
- color: O.colors?.[t] || _[t % _.length],
64
- hidden: S.includes(e)
65
- }));
66
- }, [
67
- v,
68
- O,
69
- S,
70
- x?.selectedFields
71
- ]), A = f((e) => {
72
- C((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
73
- }, []), j = f((e, t) => {
74
- if (T) {
75
- let t = e[x?.labelField || "name"];
76
- w(e, t);
77
- }
78
- b ? b(e) : y && d.drilldowns?.length && y(e, t);
79
- }, [
80
- y,
26
+ }]), { clearAllCrossFilters: O, hasCrossFilters: k } = e(), A = h(() => ({
27
+ type: C?.chartType?.toLowerCase() || "line",
28
+ xAxisKey: C?.xAxisField || "name",
29
+ xAxisLabel: C?.xAxisLabel,
30
+ yAxisLabel: C?.yAxisLabel,
31
+ showGrid: C?.showGrid,
32
+ showLegend: C?.showLegend,
33
+ legendPosition: C?.legendPosition,
34
+ showDots: C?.showDataPoints,
35
+ curveType: C?.curveType,
36
+ colors: C?.colors,
37
+ seriesNames: C?.seriesLabels,
38
+ stacked: C?.stacked,
39
+ isDonut: C?.showAsDonut,
40
+ innerRadius: C?.innerRadius,
41
+ outerRadius: C?.outerRadius,
42
+ referenceLines: C?.referenceLines,
43
+ series: C?.series,
44
+ selectedFields: C?.selectedFields,
45
+ dualAxis: C?.dualAxis,
46
+ yAxisRightLabel: C?.yAxisRightLabel,
47
+ logScale: C?.logScale,
48
+ valueField: C?.valueField,
49
+ labelField: C?.labelField,
50
+ showTotal: C?.showTotal,
51
+ totalLabel: C?.totalLabel,
52
+ xField: C?.xField,
53
+ yField: C?.yField,
54
+ sizeField: C?.sizeField,
55
+ colorField: C?.colorField
56
+ }), [C]), j = A.type === "combo" || A.dualAxis === !0 || A.series?.some((e) => e.axis === "right" || e.type === "bar") && A.series?.some((e) => e.type === "line") || !1, M = h(() => !b.length || A.type === "pie" || A.type === "funnel" || A.type === "scatter" || A.type === "waterfall" ? [] : (j && A.selectedFields !== void 0 ? r(b, A).map((e) => e.field) : i(b, A.xAxisKey, A.selectedFields)).map((e, t) => ({
57
+ dataKey: e,
58
+ name: A.seriesNames?.[e] || e,
59
+ color: A.colors?.[t] || y[t % y.length],
60
+ hidden: w.includes(e)
61
+ })), [
81
62
  b,
82
- d.drilldowns,
83
- T,
63
+ A,
84
64
  w,
85
- x?.labelField
86
- ]), M = O.type === "combo" || O.dualAxis === !0 || O.series?.some((e) => e.axis === "right" || e.type === "bar") && O.series?.some((e) => e.type === "line") || !1;
87
- return /* @__PURE__ */ g("div", {
65
+ C?.selectedFields,
66
+ j
67
+ ]), N = m((e) => {
68
+ T((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
69
+ }, []), P = m((e, t) => {
70
+ if (D) {
71
+ let t = e[C?.labelField || "name"];
72
+ E(e, t);
73
+ }
74
+ S ? S(e) : x && p.drilldowns?.length && x(e, t);
75
+ }, [
76
+ x,
77
+ S,
78
+ p.drilldowns,
79
+ D,
80
+ E,
81
+ C?.labelField
82
+ ]);
83
+ return /* @__PURE__ */ v("div", {
88
84
  className: "flex flex-col h-full p-4",
89
85
  children: [
90
- D && /* @__PURE__ */ h("div", {
86
+ k && /* @__PURE__ */ _("div", {
91
87
  className: "flex items-center gap-2 mb-2 -mt-1",
92
- children: /* @__PURE__ */ g("button", {
88
+ children: /* @__PURE__ */ v("button", {
93
89
  type: "button",
94
90
  onClick: (e) => {
95
- e.stopPropagation(), E();
91
+ e.stopPropagation(), O();
96
92
  },
97
93
  className: "\n inline-flex items-center gap-1.5\n px-2.5 py-1 rounded-md\n text-xs font-medium\n bg-action-primary-bg/10 text-action-primary-text\n hover:bg-action-primary-bg/20\n transition-colors\n ",
98
- children: [/* @__PURE__ */ h("svg", {
94
+ children: [/* @__PURE__ */ _("svg", {
99
95
  className: "w-3.5 h-3.5",
100
96
  fill: "none",
101
97
  stroke: "currentColor",
102
98
  viewBox: "0 0 24 24",
103
- children: /* @__PURE__ */ h("path", {
99
+ children: /* @__PURE__ */ _("path", {
104
100
  strokeLinecap: "round",
105
101
  strokeLinejoin: "round",
106
102
  strokeWidth: 2,
@@ -109,73 +105,73 @@ var _ = [
109
105
  }), "Clear Filter"]
110
106
  })
111
107
  }),
112
- O.legendPosition === "top" && k.length > 0 && /* @__PURE__ */ h(n, {
113
- items: k,
108
+ A.legendPosition === "top" && M.length > 0 && /* @__PURE__ */ _(n, {
109
+ items: M,
114
110
  position: "top",
115
- onItemClick: A
111
+ onItemClick: N
116
112
  }),
117
- /* @__PURE__ */ h("div", {
113
+ /* @__PURE__ */ _("div", {
118
114
  className: "flex-1 min-h-0",
119
115
  children: (() => {
120
- if (M) return /* @__PURE__ */ h(c, {
121
- data: v,
122
- config: O,
123
- hiddenSeries: S,
124
- onDataClick: j
116
+ if (j) return /* @__PURE__ */ _(u, {
117
+ data: b,
118
+ config: A,
119
+ hiddenSeries: w,
120
+ onDataClick: P
125
121
  });
126
- switch (O.type) {
127
- case "waterfall": return /* @__PURE__ */ h(l, {
128
- data: v,
129
- config: O,
130
- onDataClick: j
122
+ switch (A.type) {
123
+ case "waterfall": return /* @__PURE__ */ _(d, {
124
+ data: b,
125
+ config: A,
126
+ onDataClick: P
131
127
  });
132
- case "scatter": return /* @__PURE__ */ h(u, {
133
- data: v,
134
- config: O,
135
- onDataClick: j
128
+ case "scatter": return /* @__PURE__ */ _(f, {
129
+ data: b,
130
+ config: A,
131
+ onDataClick: P
136
132
  });
137
- case "bar": return /* @__PURE__ */ h(i, {
138
- data: v,
139
- config: O,
140
- hiddenSeries: S,
141
- onDataClick: j
133
+ case "bar": return /* @__PURE__ */ _(o, {
134
+ data: b,
135
+ config: A,
136
+ hiddenSeries: w,
137
+ onDataClick: P
142
138
  });
143
- case "area": return /* @__PURE__ */ h(a, {
144
- data: v,
145
- config: O,
146
- hiddenSeries: S,
147
- onDataClick: j
139
+ case "area": return /* @__PURE__ */ _(s, {
140
+ data: b,
141
+ config: A,
142
+ hiddenSeries: w,
143
+ onDataClick: P
148
144
  });
149
- case "pie": return /* @__PURE__ */ h(o, {
150
- data: v,
151
- config: O,
152
- dataKey: x?.valueField || "value",
153
- nameKey: x?.labelField || "name",
154
- onDataClick: j
145
+ case "pie": return /* @__PURE__ */ _(c, {
146
+ data: b,
147
+ config: A,
148
+ dataKey: C?.valueField || "value",
149
+ nameKey: C?.labelField || "name",
150
+ onDataClick: P
155
151
  });
156
- case "funnel": return /* @__PURE__ */ h(s, {
157
- data: v,
158
- config: O,
159
- dataKey: x?.valueField || "value",
160
- nameKey: x?.labelField || "name",
161
- onDataClick: j
152
+ case "funnel": return /* @__PURE__ */ _(l, {
153
+ data: b,
154
+ config: A,
155
+ dataKey: C?.valueField || "value",
156
+ nameKey: C?.labelField || "name",
157
+ onDataClick: P
162
158
  });
163
- default: return /* @__PURE__ */ h(r, {
164
- data: v,
165
- config: O,
166
- hiddenSeries: S,
167
- onDataClick: j
159
+ default: return /* @__PURE__ */ _(a, {
160
+ data: b,
161
+ config: A,
162
+ hiddenSeries: w,
163
+ onDataClick: P
168
164
  });
169
165
  }
170
166
  })()
171
167
  }),
172
- O.legendPosition === "bottom" && k.length > 0 && /* @__PURE__ */ h(n, {
173
- items: k,
168
+ A.legendPosition === "bottom" && M.length > 0 && /* @__PURE__ */ _(n, {
169
+ items: M,
174
170
  position: "bottom",
175
- onItemClick: A
171
+ onItemClick: N
176
172
  })
177
173
  ]
178
174
  });
179
175
  });
180
176
  //#endregion
181
- export { v as default };
177
+ export { b as default };
package/dist/bigconsole/components/widgets/chart/charts/AreaChart.js CHANGED
@@ -1,25 +1,30 @@
1
- import e from "../ChartTooltip.js";
2
- import { buildReferenceElements as t } from "./referenceElements.js";
3
- import { memo as n, useMemo as r } from "react";
4
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
5
- 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";
1
+ import { numericSeriesKeys as e } from "./numericSeries.js";
2
+ import t from "../ChartTooltip.js";
3
+ import { buildReferenceElements as n } from "./referenceElements.js";
4
+ import { memo as r, useMemo as i } from "react";
5
+ import { jsx as a, jsxs as o } from "react/jsx-runtime";
6
+ import { Area as s, AreaChart as c, CartesianGrid as l, Legend as u, ResponsiveContainer as d, Tooltip as f, XAxis as p, YAxis as m } from "recharts";
6
7
  //#region src/bigconsole/components/widgets/chart/charts/AreaChart.tsx
7
- var m = [
8
+ var h = [
8
9
  "var(--color-chart-1)",
9
10
  "var(--color-chart-2)",
10
11
  "var(--color-chart-3)",
11
12
  "var(--color-chart-4)",
12
13
  "var(--color-chart-5)"
13
- ], h = n(function({ data: n = [], config: h, hiddenSeries: g = [], onDataClick: _ }) {
14
- 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", {
14
+ ], g = r(function({ data: r = [], config: g, hiddenSeries: _ = [], onDataClick: v }) {
15
+ let y = i(() => e(r, g.xAxisKey, g.selectedFields), [
16
+ r,
17
+ g.xAxisKey,
18
+ g.selectedFields
19
+ ]), b = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
15
20
  notation: e >= 1e4 ? "compact" : "standard",
16
21
  maximumFractionDigits: 2
17
- }).format(e) : String(e), b = (e) => `gradient-${e}`;
18
- return n?.length ? /* @__PURE__ */ i(u, {
22
+ }).format(e) : String(e), x = (e) => `gradient-${e}`;
23
+ return r?.length ? /* @__PURE__ */ a(d, {
19
24
  width: "100%",
20
25
  height: "100%",
21
- children: /* @__PURE__ */ a(s, {
22
- data: n,
26
+ children: /* @__PURE__ */ o(c, {
27
+ data: r,
23
28
  margin: {
24
29
  top: 10,
25
30
  right: 10,
@@ -27,93 +32,93 @@ var m = [
27
32
  bottom: 0
28
33
  },
29
34
  onClick: (e) => {
30
- e?.activePayload?.[0] && _ && _(e.activePayload[0].payload, e.activeTooltipIndex || 0);
35
+ e?.activePayload?.[0] && v && v(e.activePayload[0].payload, e.activeTooltipIndex || 0);
31
36
  },
32
37
  children: [
33
- /* @__PURE__ */ i("defs", { children: v.map((e, t) => {
34
- let n = h.colors?.[t] || m[t % m.length];
35
- return /* @__PURE__ */ a("linearGradient", {
36
- id: b(e),
38
+ /* @__PURE__ */ a("defs", { children: y.map((e, t) => {
39
+ let n = g.colors?.[t] || h[t % h.length];
40
+ return /* @__PURE__ */ o("linearGradient", {
41
+ id: x(e),
37
42
  x1: "0",
38
43
  y1: "0",
39
44
  x2: "0",
40
45
  y2: "1",
41
- children: [/* @__PURE__ */ i("stop", {
46
+ children: [/* @__PURE__ */ a("stop", {
42
47
  offset: "0%",
43
48
  stopColor: n,
44
49
  stopOpacity: .4
45
- }), /* @__PURE__ */ i("stop", {
50
+ }), /* @__PURE__ */ a("stop", {
46
51
  offset: "95%",
47
52
  stopColor: n,
48
53
  stopOpacity: .05
49
54
  })]
50
55
  }, e);
51
56
  }) }),
52
- h.showGrid !== !1 && /* @__PURE__ */ i(c, {
57
+ g.showGrid !== !1 && /* @__PURE__ */ a(l, {
53
58
  strokeDasharray: "3 3",
54
59
  stroke: "var(--color-border-default)",
55
60
  opacity: .5
56
61
  }),
57
- /* @__PURE__ */ i(f, {
58
- dataKey: h.xAxisKey || "name",
62
+ /* @__PURE__ */ a(p, {
63
+ dataKey: g.xAxisKey || "name",
59
64
  tick: {
60
65
  fill: "var(--color-text-secondary)",
61
66
  fontSize: 12
62
67
  },
63
68
  tickLine: { stroke: "var(--color-border-default)" },
64
69
  axisLine: { stroke: "var(--color-border-default)" },
65
- label: h.xAxisLabel ? {
66
- value: h.xAxisLabel,
70
+ label: g.xAxisLabel ? {
71
+ value: g.xAxisLabel,
67
72
  position: "insideBottom",
68
73
  offset: -5,
69
74
  fill: "var(--color-text-secondary)"
70
75
  } : void 0
71
76
  }),
72
- /* @__PURE__ */ i(p, {
77
+ /* @__PURE__ */ a(m, {
73
78
  tick: {
74
79
  fill: "var(--color-text-secondary)",
75
80
  fontSize: 12
76
81
  },
77
82
  tickLine: { stroke: "var(--color-border-default)" },
78
83
  axisLine: { stroke: "var(--color-border-default)" },
79
- tickFormatter: y,
80
- scale: h.logScale ? "log" : "auto",
81
- domain: h.logScale ? ["auto", "auto"] : void 0,
82
- allowDataOverflow: h.logScale || void 0,
83
- label: h.yAxisLabel ? {
84
- value: h.yAxisLabel,
84
+ tickFormatter: b,
85
+ scale: g.logScale ? "log" : "auto",
86
+ domain: g.logScale ? ["auto", "auto"] : void 0,
87
+ allowDataOverflow: g.logScale || void 0,
88
+ label: g.yAxisLabel ? {
89
+ value: g.yAxisLabel,
85
90
  angle: -90,
86
91
  position: "insideLeft",
87
92
  fill: "var(--color-text-secondary)"
88
93
  } : void 0
89
94
  }),
90
- /* @__PURE__ */ i(d, {
91
- content: /* @__PURE__ */ i(e, { valueFormatter: y }),
95
+ /* @__PURE__ */ a(f, {
96
+ content: /* @__PURE__ */ a(t, { valueFormatter: b }),
92
97
  cursor: { stroke: "var(--color-border-default)" }
93
98
  }),
94
- h.showLegend !== !1 && /* @__PURE__ */ i(l, {
99
+ g.showLegend !== !1 && /* @__PURE__ */ a(u, {
95
100
  wrapperStyle: { paddingTop: 20 },
96
- formatter: (e) => /* @__PURE__ */ i("span", {
101
+ formatter: (e) => /* @__PURE__ */ a("span", {
97
102
  style: { color: "var(--color-text-primary)" },
98
103
  children: e
99
104
  })
100
105
  }),
101
- t(h.referenceLines),
102
- v.map((e, t) => /* @__PURE__ */ i(o, {
103
- type: h.curveType || "monotone",
106
+ n(g.referenceLines),
107
+ y.map((e, t) => /* @__PURE__ */ a(s, {
108
+ type: g.curveType || "monotone",
104
109
  dataKey: e,
105
- name: h.seriesNames?.[e] || e,
106
- stroke: h.colors?.[t] || m[t % m.length],
110
+ name: g.seriesNames?.[e] || e,
111
+ stroke: g.colors?.[t] || h[t % h.length],
107
112
  strokeWidth: 2,
108
- fill: `url(#${b(e)})`,
109
- dot: h.showDots,
113
+ fill: `url(#${x(e)})`,
114
+ dot: g.showDots,
110
115
  activeDot: { r: 6 },
111
- hide: g.includes(e),
112
- stackId: h.stacked ? "stack" : void 0
116
+ hide: _.includes(e),
117
+ stackId: g.stacked ? "stack" : void 0
113
118
  }, e))
114
119
  ]
115
120
  })
116
121
  }) : null;
117
122
  });
118
123
  //#endregion
119
- export { h as default };
124
+ export { g as default };
package/dist/bigconsole/components/widgets/chart/charts/BarChart.js CHANGED
@@ -1,25 +1,30 @@
1
- import e from "../ChartTooltip.js";
2
- import { buildReferenceElements as t } from "./referenceElements.js";
3
- import { memo as n, useMemo as r } from "react";
4
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
5
- 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";
1
+ import { numericSeriesKeys as e } from "./numericSeries.js";
2
+ import t from "../ChartTooltip.js";
3
+ import { buildReferenceElements as n } from "./referenceElements.js";
4
+ import { memo as r, useMemo as i } from "react";
5
+ import { jsx as a, jsxs as o } from "react/jsx-runtime";
6
+ import { Bar as s, BarChart as c, CartesianGrid as l, Legend as u, ResponsiveContainer as d, Tooltip as f, XAxis as p, YAxis as m } from "recharts";
6
7
  //#region src/bigconsole/components/widgets/chart/charts/BarChart.tsx
7
- var m = [
8
+ var h = [
8
9
  "var(--color-chart-1)",
9
10
  "var(--color-chart-2)",
10
11
  "var(--color-chart-3)",
11
12
  "var(--color-chart-4)",
12
13
  "var(--color-chart-5)"
13
- ], h = n(function({ data: n = [], config: h, hiddenSeries: g = [], onDataClick: _ }) {
14
- 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", {
14
+ ], g = r(function({ data: r = [], config: g, hiddenSeries: _ = [], onDataClick: v }) {
15
+ let y = i(() => e(r, g.xAxisKey, g.selectedFields), [
16
+ r,
17
+ g.xAxisKey,
18
+ g.selectedFields
19
+ ]), b = (e) => typeof e == "number" ? new Intl.NumberFormat("en-US", {
15
20
  notation: e >= 1e4 ? "compact" : "standard",
16
21
  maximumFractionDigits: 2
17
22
  }).format(e) : String(e);
18
- return n?.length ? /* @__PURE__ */ i(u, {
23
+ return r?.length ? /* @__PURE__ */ a(d, {
19
24
  width: "100%",
20
25
  height: "100%",
21
- children: /* @__PURE__ */ a(s, {
22
- data: n,
26
+ children: /* @__PURE__ */ o(c, {
27
+ data: r,
23
28
  margin: {
24
29
  top: 10,
25
30
  right: 10,
@@ -27,79 +32,79 @@ var m = [
27
32
  bottom: 0
28
33
  },
29
34
  onClick: (e) => {
30
- e?.activePayload?.[0] && _ && _(e.activePayload[0].payload, e.activeTooltipIndex || 0);
35
+ e?.activePayload?.[0] && v && v(e.activePayload[0].payload, e.activeTooltipIndex || 0);
31
36
  },
32
37
  children: [
33
- h.showGrid !== !1 && /* @__PURE__ */ i(c, {
38
+ g.showGrid !== !1 && /* @__PURE__ */ a(l, {
34
39
  strokeDasharray: "3 3",
35
40
  stroke: "var(--color-border-default)",
36
41
  opacity: .5,
37
42
  vertical: !1
38
43
  }),
39
- /* @__PURE__ */ i(f, {
40
- dataKey: h.xAxisKey || "name",
44
+ /* @__PURE__ */ a(p, {
45
+ dataKey: g.xAxisKey || "name",
41
46
  tick: {
42
47
  fill: "var(--color-text-secondary)",
43
48
  fontSize: 12
44
49
  },
45
50
  tickLine: { stroke: "var(--color-border-default)" },
46
51
  axisLine: { stroke: "var(--color-border-default)" },
47
- label: h.xAxisLabel ? {
48
- value: h.xAxisLabel,
52
+ label: g.xAxisLabel ? {
53
+ value: g.xAxisLabel,
49
54
  position: "insideBottom",
50
55
  offset: -5,
51
56
  fill: "var(--color-text-secondary)"
52
57
  } : void 0
53
58
  }),
54
- /* @__PURE__ */ i(p, {
59
+ /* @__PURE__ */ a(m, {
55
60
  tick: {
56
61
  fill: "var(--color-text-secondary)",
57
62
  fontSize: 12
58
63
  },
59
64
  tickLine: { stroke: "var(--color-border-default)" },
60
65
  axisLine: { stroke: "var(--color-border-default)" },
61
- tickFormatter: y,
62
- scale: h.logScale ? "log" : "auto",
63
- domain: h.logScale ? ["auto", "auto"] : void 0,
64
- allowDataOverflow: h.logScale || void 0,
65
- label: h.yAxisLabel ? {
66
- value: h.yAxisLabel,
66
+ tickFormatter: b,
67
+ scale: g.logScale ? "log" : "auto",
68
+ domain: g.logScale ? ["auto", "auto"] : void 0,
69
+ allowDataOverflow: g.logScale || void 0,
70
+ label: g.yAxisLabel ? {
71
+ value: g.yAxisLabel,
67
72
  angle: -90,
68
73
  position: "insideLeft",
69
74
  fill: "var(--color-text-secondary)"
70
75
  } : void 0
71
76
  }),
72
- /* @__PURE__ */ i(d, {
73
- content: /* @__PURE__ */ i(e, { valueFormatter: y }),
77
+ /* @__PURE__ */ a(f, {
78
+ content: /* @__PURE__ */ a(t, { valueFormatter: b }),
74
79
  cursor: {
75
80
  fill: "var(--color-bg-muted)",
76
81
  opacity: .5
77
82
  }
78
83
  }),
79
- h.showLegend !== !1 && /* @__PURE__ */ i(l, {
84
+ g.showLegend !== !1 && /* @__PURE__ */ a(u, {
80
85
  wrapperStyle: { paddingTop: 20 },
81
- formatter: (e) => /* @__PURE__ */ i("span", {
86
+ formatter: (e) => /* @__PURE__ */ a("span", {
82
87
  style: { color: "var(--color-text-primary)" },
83
88
  children: e
84
89
  })
85
90
  }),
86
- t(h.referenceLines),
87
- v.map((e, t) => /* @__PURE__ */ i(o, {
91
+ n(g.referenceLines),
92
+ y.map((e, t) => /* @__PURE__ */ a(s, {
88
93
  dataKey: e,
89
- name: h.seriesNames?.[e] || e,
90
- fill: h.colors?.[t] || m[t % m.length],
94
+ name: g.seriesNames?.[e] || e,
95
+ fill: g.colors?.[t] || h[t % h.length],
91
96
  radius: [
92
97
  4,
93
98
  4,
94
99
  0,
95
100
  0
96
101
  ],
97
- hide: g.includes(e),
98
- stackId: h.stacked ? "stack" : void 0
102
+ hide: _.includes(e),
103
+ stackId: g.stacked ? "stack" : void 0
99
104
  }, e))
100
105
  ]
101
106
  })
102
107
  }) : null;
103
108
  });
104
109
  //#endregion
105
- export { h as default };
110
+ export { g as default };