@ck-ui/component-library 1.0.8 → 1.0.10
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.
- package/dist/{DropdownFooter-B1d0HFxd.js → DropdownFooter-CJnM_ECj.js} +4 -3
- package/dist/{OptionList-BM4AleXV.js → OptionList-DU0iA8Y4.js} +206 -198
- package/dist/assets/index-EOsQwhza.css +1 -0
- package/dist/assets/index-xlbz19JS.css +1 -0
- package/dist/assets/{index-CtR-jzNi.css → index-zWDnehqu.css} +1 -1
- package/dist/assets/styles-0GdZsGyi.css +1 -0
- package/dist/assets/styles-CwZG1jzB.css +1 -0
- package/dist/assets/{styles-DAqMiQ0N.css → styles-DrYTmjez.css} +1 -1
- package/dist/components/Breadcrumb/index.js +39 -39
- package/dist/components/FusionChart/_config/builders.d.ts.map +1 -1
- package/dist/components/FusionChart/_config/builders.js +187 -149
- package/dist/components/FusionChart/_config/events.d.ts.map +1 -1
- package/dist/components/FusionChart/_config/events.js +52 -37
- package/dist/components/FusionChart/_config/helpers.js +6 -6
- package/dist/components/FusionChart/_constant/constants.d.ts +3 -3
- package/dist/components/FusionChart/_constant/constants.js +1 -1
- package/dist/components/FusionChart/_helpers/doughnutHelper.js +13 -13
- package/dist/components/FusionChart/_types/fusionChart.types.d.ts +2 -0
- package/dist/components/FusionChart/_types/fusionChart.types.d.ts.map +1 -1
- package/dist/components/FusionChart/index.d.ts.map +1 -1
- package/dist/components/FusionChart/index.js +533 -504
- package/dist/components/Search/index.js +60 -60
- package/dist/components/SingleSelectDropdown/_helpers/DropdownFooter.js +4 -3
- package/dist/components/SingleSelectDropdown/index.js +12 -11
- package/dist/components/Table/_helpers/ColumnManager/index.d.ts +1 -1
- package/dist/components/Table/_helpers/ColumnManager/index.d.ts.map +1 -1
- package/dist/components/Table/_helpers/ColumnManager/index.js +803 -696
- package/dist/components/Table/_helpers/FilterColumnToolbar.js +36 -36
- package/dist/components/Table/_helpers/GroupedHeader/index.d.ts +3 -2
- package/dist/components/Table/_helpers/GroupedHeader/index.d.ts.map +1 -1
- package/dist/components/Table/_helpers/GroupedHeader/index.js +148 -147
- package/dist/components/Table/_helpers/TableFilterModal/OptionList.d.ts.map +1 -1
- package/dist/components/Table/_helpers/TableFilterModal/OptionList.js +3 -3
- package/dist/components/Table/_helpers/TableFilterModal/index.d.ts.map +1 -1
- package/dist/components/Table/_helpers/TableFilterModal/index.js +52 -50
- package/dist/components/Table/_helpers/TableRows.d.ts +1 -1
- package/dist/components/Table/_helpers/TableRows.d.ts.map +1 -1
- package/dist/components/Table/_helpers/TableRows.js +242 -243
- package/dist/components/Table/_hooks/useOverlayScrollbar.d.ts.map +1 -1
- package/dist/components/Table/_hooks/useOverlayScrollbar.js +63 -58
- package/dist/components/Table/_types/table.types.d.ts +1 -1
- package/dist/components/Table/_types/table.types.d.ts.map +1 -1
- package/dist/components/Table/_utils/table.utils.d.ts +1 -1
- package/dist/components/Table/_utils/table.utils.d.ts.map +1 -1
- package/dist/components/Table/_utils/table.utils.js +84 -46
- package/dist/components/Table/index.d.ts.map +1 -1
- package/dist/components/Table/index.js +398 -327
- package/dist/components/TextField/index.js +165 -165
- package/package.json +1 -1
- package/dist/assets/index-C8gvpfKZ.css +0 -1
- package/dist/assets/index-DewFIgpp.css +0 -1
- package/dist/assets/styles-DLJzdWsF.css +0 -1
- package/dist/assets/styles-O-5pBCak.css +0 -1
- package/dist/search-B_cup-NN.js +0 -5
|
@@ -1,19 +1,57 @@
|
|
|
1
|
-
import { EXTENDED_PALETTE as
|
|
2
|
-
import { getBaseConfig as
|
|
3
|
-
import { getCurrencyPrefix as y, getLabelStep as p, getCartesianPalette as N, getCurrencySymbol as
|
|
4
|
-
const
|
|
5
|
-
const t = e.plotSpacePercent ?? (e.plotSpacePercent === 0 ? e.plotSpacePercent : 60), a = Array.isArray(e.graphData) ? e.graphData : [],
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
import { EXTENDED_PALETTE as S, DEFAULT_WIDTH as m, STACKED_AREA_PALETTE as E } from "../_constant/constants.js";
|
|
2
|
+
import { getBaseConfig as g, getStackedColumnChartShell as z, getStackedAreaChartShell as I, getStackedBarChartShell as H, getLineChartShell as F, getCommonChartShell as D, getScrollAreaChartShell as P, getMultipleLineChartShell as O, getMsCombiDy2dChartShell as R, getGroupChartShell as W, getDoughnutChartShell as Y } from "./helpers.js";
|
|
3
|
+
import { getCurrencyPrefix as y, getLabelStep as p, getCartesianPalette as N, getCurrencySymbol as j, getBarType as V, getGraphDataLength as _ } from "../_utils/chartHelpers.js";
|
|
4
|
+
const M = (e = {}) => {
|
|
5
|
+
const t = e.plotSpacePercent ?? (e.plotSpacePercent === 0 ? e.plotSpacePercent : 60), a = Array.isArray(e.graphData) ? e.graphData : [], r = a.some((l) => !!l.color), o = N(e?.palettecolors)?.split(",")?.map((l) => l?.trim());
|
|
6
|
+
if (e.usePerBarColors && !Array.isArray(e.graphData)) {
|
|
7
|
+
const l = e.graphData, s = l?.category || [], h = l?.dataset || [];
|
|
8
|
+
if (h.length === 1) {
|
|
9
|
+
const b = (h[0].data || []).map((f, v) => {
|
|
10
|
+
const C = f.color || o[v % o.length], T = s[v]?.label || "";
|
|
11
|
+
return {
|
|
12
|
+
...f,
|
|
13
|
+
color: C,
|
|
14
|
+
toolText: e.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${T}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${C};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${T}</label></span><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${y(e.numberPrefix)}${f.value || ""}</b></div>`
|
|
15
|
+
};
|
|
16
|
+
}), w = {
|
|
17
|
+
...D(e),
|
|
18
|
+
bgColor: e.bgColor || "#ffffff",
|
|
19
|
+
labelStep: p(s.length, e.labelStep),
|
|
20
|
+
xAxisName: e.xAxisName,
|
|
21
|
+
yAxisName: e.yAxisName,
|
|
22
|
+
chartBottomMargin: e.chartBottomMargin,
|
|
23
|
+
chartLeftMargin: e.chartLeftMargin,
|
|
24
|
+
plotSpacePercent: t,
|
|
25
|
+
labelDisplay: e.labelDisplay,
|
|
26
|
+
useEllipsesWhenOverflow: e.useEllipsesWhenOverflow,
|
|
27
|
+
showValues: e.showValues || "0",
|
|
28
|
+
showLabels: e.showLabels || "1",
|
|
29
|
+
skipOverlapLabels: "0",
|
|
30
|
+
numberPrefix: y(e.numberPrefix),
|
|
31
|
+
maxLabelHeight: e.maxLabelHeight,
|
|
32
|
+
numbersuffix: e.numbersuffix || ""
|
|
33
|
+
};
|
|
34
|
+
return g({
|
|
35
|
+
type: V(e),
|
|
36
|
+
width: m,
|
|
37
|
+
height: e.height || "300",
|
|
38
|
+
dataSource: { chart: w, data: b }
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
const n = a?.map((l, s) => {
|
|
43
|
+
const h = l?.color || o[s % o.length];
|
|
44
|
+
let x;
|
|
45
|
+
return l.toolText ? x = l.toolText : e.plotToolText ? x = e.plotToolText : x = `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${l.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${h};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${l.label || ""}</label></span><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${y(e.numberPrefix)}${l.value || ""}</b></div>`, {
|
|
46
|
+
...l,
|
|
47
|
+
color: h,
|
|
48
|
+
toolText: x
|
|
11
49
|
// toolText: props.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${item.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${itemColor};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>${item.label || ""}</label></span><b style='text-align:right;'>${getCurrencyPrefix(props.numberPrefix)}${item.value || ""}</b></div>`
|
|
12
50
|
};
|
|
13
51
|
}), i = {
|
|
14
|
-
...
|
|
52
|
+
...D(e),
|
|
15
53
|
bgColor: e.bgColor || "#ffffff",
|
|
16
|
-
labelStep: p(
|
|
54
|
+
labelStep: p(_(e), e.labelStep),
|
|
17
55
|
xAxisName: e.xAxisName,
|
|
18
56
|
yAxisName: e.yAxisName,
|
|
19
57
|
chartBottomMargin: e.chartBottomMargin,
|
|
@@ -26,7 +64,7 @@ const V = (e = {}) => {
|
|
|
26
64
|
skipOverlapLabels: "0",
|
|
27
65
|
numberPrefix: y(e.numberPrefix),
|
|
28
66
|
// When per-item colors are set, don't use palettecolors (it overrides item colors)
|
|
29
|
-
palettecolors:
|
|
67
|
+
palettecolors: r ? void 0 : N(e.palettecolors),
|
|
30
68
|
maxLabelHeight: e.maxLabelHeight,
|
|
31
69
|
numbersuffix: e.numbersuffix || ""
|
|
32
70
|
}, d = e.graphData, c = e?.hideScroll ? { chart: i, data: n?.length > 0 ? n : e?.graphData || [] } : {
|
|
@@ -34,36 +72,36 @@ const V = (e = {}) => {
|
|
|
34
72
|
categories: d?.categories,
|
|
35
73
|
dataset: d?.dataset
|
|
36
74
|
};
|
|
37
|
-
return
|
|
38
|
-
type:
|
|
39
|
-
width:
|
|
75
|
+
return g({
|
|
76
|
+
type: V(e),
|
|
77
|
+
width: m,
|
|
40
78
|
height: e.height || "300",
|
|
41
79
|
dataSource: c
|
|
42
80
|
});
|
|
43
|
-
}, G = (e = {}) =>
|
|
81
|
+
}, G = (e = {}) => g({
|
|
44
82
|
type: "area2d",
|
|
45
|
-
width:
|
|
83
|
+
width: m,
|
|
46
84
|
height: "550",
|
|
47
85
|
dataSource: {
|
|
48
86
|
chart: {
|
|
49
|
-
...
|
|
87
|
+
...D({ ...e, decimals: "2" }),
|
|
50
88
|
xAxisName: e.xAxisName,
|
|
51
89
|
yAxisName: e.yAxisName,
|
|
52
90
|
labelFontSize: 12,
|
|
53
|
-
plotToolText: e.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#
|
|
91
|
+
plotToolText: e.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#2b2b2b;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#AAAAAA;'>$label</label><b style='text-align:right; color:#2b2b2b;font-weight:500;font-size:10px;'>${j()}$value</b></div>`
|
|
54
92
|
// plotToolText: props.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$label</label><b style='text-align:right;'>${getCurrencySymbol()}$value</b></div>`,
|
|
55
93
|
},
|
|
56
94
|
data: e.graphData || []
|
|
57
95
|
}
|
|
58
96
|
}), U = (e = {}) => {
|
|
59
|
-
const t = Array.isArray(e?.graphData) ? e.graphData : [], a = y(e?.numberPrefix),
|
|
97
|
+
const t = Array.isArray(e?.graphData) ? e.graphData : [], a = y(e?.numberPrefix), r = (e?.palettecolors || "#8ECFFF").split(",")[0].trim(), o = t?.map((n) => ({
|
|
60
98
|
...n,
|
|
61
|
-
toolText: e?.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#
|
|
99
|
+
toolText: e?.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${n?.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${r};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${n?.label || ""}</label></span><b style='text-align:right; color:#2B2B2B;font-weight:500;font-size:10px;'>${a}${n?.value || ""}</b></div>`
|
|
62
100
|
// toolText: props?.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${item?.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${lineColor};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>${item?.label || ""}</label></span><b style='text-align:right;'>${numberPrefix}${item?.value || ""}</b></div>`
|
|
63
101
|
}));
|
|
64
|
-
return
|
|
102
|
+
return g({
|
|
65
103
|
type: "line",
|
|
66
|
-
width: e?.width ||
|
|
104
|
+
width: e?.width || m,
|
|
67
105
|
height: e?.height || "300",
|
|
68
106
|
dataSource: {
|
|
69
107
|
chart: {
|
|
@@ -73,16 +111,16 @@ const V = (e = {}) => {
|
|
|
73
111
|
labelStep: p(t.length, void 0),
|
|
74
112
|
...e?.chartConfig || {}
|
|
75
113
|
},
|
|
76
|
-
data:
|
|
114
|
+
data: o.length > 0 ? o : e?.graphData || []
|
|
77
115
|
}
|
|
78
116
|
});
|
|
79
117
|
}, K = (e = {}) => {
|
|
80
|
-
let t =
|
|
118
|
+
let t = j();
|
|
81
119
|
e.numberPrefix === "" ? t = "" : e.numberPrefix !== null && e.numberPrefix !== void 0 && (t = e.numberPrefix);
|
|
82
|
-
const a = e.graphData,
|
|
83
|
-
const c = n.data?.map((
|
|
84
|
-
const
|
|
85
|
-
return
|
|
120
|
+
const a = e.graphData, r = (a?.dataset || []).some((n) => !!n.color), o = (a?.dataset || []).map((n, i) => {
|
|
121
|
+
const c = n.data?.map((l) => {
|
|
122
|
+
const s = l.value;
|
|
123
|
+
return s == null || Number(s) === 0 || typeof s == "string" && s.trim() === "" ? { ...l, value: 0 } : l;
|
|
86
124
|
});
|
|
87
125
|
return {
|
|
88
126
|
...n,
|
|
@@ -91,17 +129,17 @@ const V = (e = {}) => {
|
|
|
91
129
|
// index === 0
|
|
92
130
|
// ? "<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>"
|
|
93
131
|
// : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>"
|
|
94
|
-
plotToolText: e.plotToolText || (i === 0 ? "<div style='font-size: 10px;font-weight:500;color:#
|
|
132
|
+
plotToolText: e.plotToolText || (i === 0 ? "<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>$dataValue</b></div>" : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>$dataValue</b></div>")
|
|
95
133
|
};
|
|
96
134
|
});
|
|
97
|
-
return
|
|
135
|
+
return g({
|
|
98
136
|
type: "mscolumn2d",
|
|
99
137
|
key: e.key,
|
|
100
|
-
width: e.width ||
|
|
138
|
+
width: e.width || m,
|
|
101
139
|
height: e.height || "400",
|
|
102
140
|
dataSource: {
|
|
103
141
|
chart: {
|
|
104
|
-
...
|
|
142
|
+
...W(e),
|
|
105
143
|
yAxisMaxValue: e.yAxisMaxValue,
|
|
106
144
|
xAxisName: e.xAxisName,
|
|
107
145
|
yAxisName: e.yAxisName,
|
|
@@ -110,14 +148,14 @@ const V = (e = {}) => {
|
|
|
110
148
|
legendIconSides: e.legendIconSides,
|
|
111
149
|
numberPrefix: t,
|
|
112
150
|
labelStep: p(a?.category?.length, e.labelStep),
|
|
113
|
-
...
|
|
151
|
+
...r ? { palettecolors: void 0 } : {}
|
|
114
152
|
},
|
|
115
153
|
categories: [{ category: a?.category || [] }],
|
|
116
|
-
dataset:
|
|
154
|
+
dataset: o
|
|
117
155
|
}
|
|
118
156
|
});
|
|
119
157
|
}, X = (e = {}) => {
|
|
120
|
-
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData,
|
|
158
|
+
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData, r = (a?.dataset || []).some((i) => !!i.color), o = "<div class='stacked-tooltip-total' style='display:flex;justify-content:space-between;align-items:center;padding:8px 0 0;margin-top:4px;border-top:1px solid #eee;min-width:180px'><span style='color:#2B2B2B;font-weight:500'>Total</span><b style='color:#2B2B2B;font-weight:500;font-size:10px;'>$sum</b></div>", n = (a?.dataset || []).map((i, d) => ({
|
|
121
159
|
...i,
|
|
122
160
|
// plotToolText: props.plotToolText || (plotToolText: props.plotToolText || (
|
|
123
161
|
// index === 0
|
|
@@ -126,12 +164,12 @@ const V = (e = {}) => {
|
|
|
126
164
|
// index === 0
|
|
127
165
|
// ? "<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>" + totalRow
|
|
128
166
|
// : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>" + totalRow
|
|
129
|
-
plotToolText: e.plotToolText || (d === 0 ? "<div style='font-size: 10px;font-weight:500;color:#
|
|
167
|
+
plotToolText: e.plotToolText || (d === 0 ? "<div style='font-size: 10px;font-weight:500;color:#2b2b2b;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;color:#2b2b2b;font-weight:500;font-size:10px;'>$dataValue</b></div>" + o : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373'>$seriesName</label><b style='text-align:right;color:#2b2b2b;font-weight:500;font-size:10px;'>$dataValue</b></div>" + o)
|
|
130
168
|
}));
|
|
131
|
-
return
|
|
169
|
+
return g({
|
|
132
170
|
type: e.hideScroll ? "stackedcolumn2d" : "scrollstackedcolumn2d",
|
|
133
171
|
key: e.key,
|
|
134
|
-
width: e.width ||
|
|
172
|
+
width: e.width || m,
|
|
135
173
|
height: e.height || "400",
|
|
136
174
|
dataSource: {
|
|
137
175
|
chart: {
|
|
@@ -144,7 +182,7 @@ const V = (e = {}) => {
|
|
|
144
182
|
interactiveLegend: e.interactiveLegend || "1",
|
|
145
183
|
drawCrossLine: e.drawCrossLine || "1",
|
|
146
184
|
bgColor: e.bgColor || "#ffffff",
|
|
147
|
-
palettecolors:
|
|
185
|
+
palettecolors: r ? void 0 : e.palettecolors || S,
|
|
148
186
|
numberPrefix: t,
|
|
149
187
|
labelStep: p(a?.category?.length, e.labelStep),
|
|
150
188
|
showSum: e.showSum ? "1" : void 0
|
|
@@ -156,8 +194,8 @@ const V = (e = {}) => {
|
|
|
156
194
|
}
|
|
157
195
|
});
|
|
158
196
|
}, q = (e = {}) => {
|
|
159
|
-
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData,
|
|
160
|
-
...
|
|
197
|
+
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData, r = (a?.dataset || []).map((o, n) => ({
|
|
198
|
+
...o,
|
|
161
199
|
drawCustomLegendIcon: "1",
|
|
162
200
|
legendIconSides: "4",
|
|
163
201
|
legendIconBorderThickness: "0",
|
|
@@ -166,16 +204,16 @@ const V = (e = {}) => {
|
|
|
166
204
|
// index === 0
|
|
167
205
|
// ? "<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>"
|
|
168
206
|
// : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>"
|
|
169
|
-
plotToolText: e.plotToolText || (n === 0 ? "<div style='font-size: 10px;font-weight:500;color:#
|
|
207
|
+
plotToolText: e.plotToolText || (n === 0 ? "<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>$dataValue</b></div>" : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;font-weight:500;font-size:10px;color:#2B2B2B;'>$dataValue</b></div>")
|
|
170
208
|
}));
|
|
171
|
-
return
|
|
209
|
+
return g({
|
|
172
210
|
type: "msline",
|
|
173
211
|
key: e.key,
|
|
174
|
-
width: e.width ||
|
|
212
|
+
width: e.width || m,
|
|
175
213
|
height: e.height || "400",
|
|
176
214
|
dataSource: {
|
|
177
215
|
chart: {
|
|
178
|
-
...
|
|
216
|
+
...O(e),
|
|
179
217
|
yAxisMaxValue: e.yAxisMaxValue,
|
|
180
218
|
xAxisName: e.xAxisName,
|
|
181
219
|
yAxisName: e.yAxisName,
|
|
@@ -187,53 +225,53 @@ const V = (e = {}) => {
|
|
|
187
225
|
showValues: e.showValues === "1" ? "1" : "0"
|
|
188
226
|
},
|
|
189
227
|
categories: [{ category: a?.category || [] }],
|
|
190
|
-
dataset:
|
|
228
|
+
dataset: r
|
|
191
229
|
}
|
|
192
230
|
});
|
|
193
231
|
}, J = (e = {}) => {
|
|
194
|
-
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData,
|
|
195
|
-
const
|
|
232
|
+
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData, o = (e.palettecolors || E).split(",").map((c) => c.trim()), n = a?.category || [], i = a?.dataset || [], d = i.map((c, l) => {
|
|
233
|
+
const h = c.color || o[l % o.length], x = c.data || [];
|
|
196
234
|
return {
|
|
197
235
|
...c,
|
|
198
|
-
color:
|
|
199
|
-
plotBorderColor:
|
|
236
|
+
color: h,
|
|
237
|
+
plotBorderColor: h,
|
|
200
238
|
plotBorderThickness: "2",
|
|
201
239
|
plotBorderAlpha: "100",
|
|
202
|
-
anchorBgColor:
|
|
203
|
-
anchorBorderColor:
|
|
240
|
+
anchorBgColor: h,
|
|
241
|
+
anchorBorderColor: h,
|
|
204
242
|
showPlotBorder: "1",
|
|
205
243
|
...e.plotToolText ? { plotToolText: e.plotToolText } : {},
|
|
206
|
-
data:
|
|
207
|
-
const
|
|
244
|
+
data: x.map((u, b) => {
|
|
245
|
+
const w = n[b]?.label || "";
|
|
208
246
|
if (e.plotToolText)
|
|
209
|
-
return { ...
|
|
210
|
-
if (
|
|
247
|
+
return { ...u, alpha: "60" };
|
|
248
|
+
if (l > 0)
|
|
211
249
|
return {
|
|
212
|
-
...
|
|
250
|
+
...u,
|
|
213
251
|
alpha: "60",
|
|
214
252
|
toolText: " "
|
|
215
253
|
};
|
|
216
|
-
const
|
|
217
|
-
const T = v.color ||
|
|
218
|
-
return `<div style='display:flex;justify-content:space-between;align-items:center;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px;color:#737373;'><span style='width:10px;height:10px;border-radius:2px;background-color:${T};display:inline-block'></span>${A}</span><b style='color:#
|
|
254
|
+
const f = i.map((v, C) => {
|
|
255
|
+
const T = v.color || o[C % o.length], B = (v.data || [])[b]?.value ?? "", A = v.seriesname || "";
|
|
256
|
+
return `<div style='display:flex;justify-content:space-between;align-items:center;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px;color:#737373;'><span style='width:10px;height:10px;border-radius:2px;background-color:${T};display:inline-block'></span>${A}</span><b style='color:#2B2B2B;font-weight:500;font-size:10px;'>${t}${B}</b></div>`;
|
|
219
257
|
}).join("");
|
|
220
258
|
return {
|
|
221
|
-
...
|
|
259
|
+
...u,
|
|
222
260
|
alpha: "60",
|
|
223
261
|
// toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${label}</div>${tooltipItems}`,
|
|
224
|
-
toolText: `<div style='font-size: 10px;font-weight:500;color:#
|
|
262
|
+
toolText: `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${w}</div>${f}`
|
|
225
263
|
};
|
|
226
264
|
})
|
|
227
265
|
};
|
|
228
266
|
});
|
|
229
|
-
return
|
|
267
|
+
return g({
|
|
230
268
|
type: "stackedarea2d",
|
|
231
269
|
key: e.key,
|
|
232
|
-
width: e.width ||
|
|
270
|
+
width: e.width || m,
|
|
233
271
|
height: e.height || "400",
|
|
234
272
|
dataSource: {
|
|
235
273
|
chart: {
|
|
236
|
-
...
|
|
274
|
+
...I(e),
|
|
237
275
|
yAxisMaxValue: e.yAxisMaxValue,
|
|
238
276
|
xAxisName: e.xAxisName,
|
|
239
277
|
yAxisName: e.yAxisName,
|
|
@@ -250,27 +288,27 @@ const V = (e = {}) => {
|
|
|
250
288
|
}
|
|
251
289
|
});
|
|
252
290
|
}, Q = (e = {}) => {
|
|
253
|
-
const t = y(e.numberPrefix),
|
|
291
|
+
const t = y(e.numberPrefix), r = (e?.palettecolors || "#8ECFFF").split(",").map((s) => s.trim()), o = r[0];
|
|
254
292
|
if (!Array.isArray(e?.graphData) && e?.graphData?.dataset) {
|
|
255
|
-
const
|
|
256
|
-
const
|
|
293
|
+
const s = e.graphData, h = s?.category || [], x = s?.dataset || [], u = x.map((b, w) => {
|
|
294
|
+
const f = b.color || r[w % r.length], v = b.data || [];
|
|
257
295
|
return {
|
|
258
|
-
...
|
|
259
|
-
color:
|
|
296
|
+
...b,
|
|
297
|
+
color: f,
|
|
260
298
|
anchorRadius: "3",
|
|
261
299
|
anchorBgColor: "#FFFFFF",
|
|
262
|
-
anchorBorderColor:
|
|
300
|
+
anchorBorderColor: f,
|
|
263
301
|
anchorBorderThickness: "1",
|
|
264
302
|
...e.plotToolText ? { plotToolText: e.plotToolText } : {},
|
|
265
303
|
data: v.map((C, T) => {
|
|
266
|
-
const
|
|
304
|
+
const $ = h[T]?.label || "";
|
|
267
305
|
if (e.plotToolText)
|
|
268
306
|
return { ...C };
|
|
269
|
-
const
|
|
270
|
-
return
|
|
307
|
+
const B = x[w]?.seriesname || "", A = (x[w]?.data || [])[T]?.value ?? "", k = b.color || r[w % r.length], L = `<div class='scroll-area-tooltip-row' data-series-index='${w}' style='display:flex;align-items:center;gap:5px;padding:2px 0;min-width:200px'><span class='scroll-area-dot' style='width:8px;height:8px;border-radius:2px;background-color:${k};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${B}</label><b style='text-align:right;margin-left:auto;color:#2B2B2B;font-weight:500;font-size:10px;'>${t}${A}</b></div>`;
|
|
308
|
+
return w === 0 ? {
|
|
271
309
|
...C,
|
|
272
310
|
// toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${label}</div>${row}`,
|
|
273
|
-
toolText: `<div style='font-size: 10px;font-weight:500;color:#
|
|
311
|
+
toolText: `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${$}</div>${L}`
|
|
274
312
|
} : {
|
|
275
313
|
...C,
|
|
276
314
|
toolText: L
|
|
@@ -278,9 +316,9 @@ const V = (e = {}) => {
|
|
|
278
316
|
})
|
|
279
317
|
};
|
|
280
318
|
});
|
|
281
|
-
return
|
|
319
|
+
return g({
|
|
282
320
|
type: "scrollarea2d",
|
|
283
|
-
width: e?.width ||
|
|
321
|
+
width: e?.width || m,
|
|
284
322
|
height: e?.height || "400",
|
|
285
323
|
dataSource: {
|
|
286
324
|
chart: {
|
|
@@ -290,19 +328,19 @@ const V = (e = {}) => {
|
|
|
290
328
|
numberPrefix: t,
|
|
291
329
|
...e?.chartConfig || {}
|
|
292
330
|
},
|
|
293
|
-
categories: [{ category:
|
|
294
|
-
dataset:
|
|
331
|
+
categories: [{ category: h }],
|
|
332
|
+
dataset: u
|
|
295
333
|
}
|
|
296
334
|
});
|
|
297
335
|
}
|
|
298
|
-
const i = Array.isArray(e?.graphData) ? e.graphData : [], d = i.map((
|
|
299
|
-
value:
|
|
336
|
+
const i = Array.isArray(e?.graphData) ? e.graphData : [], d = i.map((s) => ({ label: s?.label || "" })), c = e.legendLabel || "Spend", l = i.map((s) => ({
|
|
337
|
+
value: s?.value,
|
|
300
338
|
// toolText: props?.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${item?.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${lineColor};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>${seriesName}</label></span><b style='text-align:right;'>${numberPrefix}${item?.value || ""}</b></div>`,
|
|
301
|
-
toolText: e?.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#
|
|
339
|
+
toolText: e?.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${s?.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px'><span style='width:8px;height:8px;border-radius:2px;background-color:${o};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${c}</label></span><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${t}${s?.value || ""}</b></div>`
|
|
302
340
|
}));
|
|
303
|
-
return
|
|
341
|
+
return g({
|
|
304
342
|
type: "scrollarea2d",
|
|
305
|
-
width: e?.width ||
|
|
343
|
+
width: e?.width || m,
|
|
306
344
|
height: e?.height || "400",
|
|
307
345
|
dataSource: {
|
|
308
346
|
chart: {
|
|
@@ -316,25 +354,25 @@ const V = (e = {}) => {
|
|
|
316
354
|
dataset: [
|
|
317
355
|
{
|
|
318
356
|
seriesname: c,
|
|
319
|
-
color:
|
|
357
|
+
color: o,
|
|
320
358
|
anchorRadius: "3",
|
|
321
359
|
anchorBgColor: "#FFFFFF",
|
|
322
|
-
anchorBorderColor:
|
|
360
|
+
anchorBorderColor: o,
|
|
323
361
|
anchorBorderThickness: "1",
|
|
324
|
-
data:
|
|
362
|
+
data: l
|
|
325
363
|
}
|
|
326
364
|
]
|
|
327
365
|
}
|
|
328
366
|
});
|
|
329
367
|
}, Z = (e = {}) => {
|
|
330
368
|
const t = e.graphData;
|
|
331
|
-
return
|
|
369
|
+
return g({
|
|
332
370
|
type: "stackedbar2d",
|
|
333
|
-
width:
|
|
371
|
+
width: m,
|
|
334
372
|
height: e.height || "400",
|
|
335
373
|
dataSource: {
|
|
336
374
|
chart: {
|
|
337
|
-
...
|
|
375
|
+
...H(e),
|
|
338
376
|
xAxisName: e.xAxisName,
|
|
339
377
|
yAxisName: e.yAxisName,
|
|
340
378
|
...e.plotToolText ? { plotToolText: e.plotToolText } : {}
|
|
@@ -345,9 +383,9 @@ const V = (e = {}) => {
|
|
|
345
383
|
});
|
|
346
384
|
}, ee = (e = {}) => {
|
|
347
385
|
const t = e.graphData;
|
|
348
|
-
return
|
|
386
|
+
return g({
|
|
349
387
|
type: "sankey",
|
|
350
|
-
width:
|
|
388
|
+
width: m,
|
|
351
389
|
height: e.height || "600",
|
|
352
390
|
dataSource: {
|
|
353
391
|
chart: {
|
|
@@ -357,9 +395,9 @@ const V = (e = {}) => {
|
|
|
357
395
|
// legendItemFontColor: "#2B2B2B",
|
|
358
396
|
// nodeLabelFontColor: "#2B2B2B",
|
|
359
397
|
// nodeLabelFont: "#2B2B2B",
|
|
360
|
-
legendItemFontColor: "#
|
|
361
|
-
nodeLabelFontColor: "#
|
|
362
|
-
nodeLabelFont: "#
|
|
398
|
+
legendItemFontColor: "#2B2B2B",
|
|
399
|
+
nodeLabelFontColor: "#2B2B2B",
|
|
400
|
+
nodeLabelFont: "#2B2B2B",
|
|
363
401
|
legendItemHoverFontColor: "#0a3ca2",
|
|
364
402
|
labelFontColor: "#0a3ca2",
|
|
365
403
|
nodeLabelFontSize: 9,
|
|
@@ -376,38 +414,38 @@ const V = (e = {}) => {
|
|
|
376
414
|
}
|
|
377
415
|
});
|
|
378
416
|
}, te = (e = {}) => {
|
|
379
|
-
const a = e.graphData?.data || [],
|
|
417
|
+
const a = e.graphData?.data || [], r = a.reduce((l, s) => l + (Number(s.value) || 0), 0), o = Math.round(r * 100) / 100, n = e.numberPrefix ?? "$", i = { ...e };
|
|
380
418
|
if (!i.defaultCenterLabel)
|
|
381
|
-
i.defaultCenterLabel = `Total{br}${n}${
|
|
419
|
+
i.defaultCenterLabel = `Total{br}${n}${o}`;
|
|
382
420
|
else if (i.defaultCenterLabel.includes("{br}")) {
|
|
383
|
-
const [
|
|
384
|
-
i.defaultCenterLabel = `${
|
|
421
|
+
const [l] = i.defaultCenterLabel.split("{br}");
|
|
422
|
+
i.defaultCenterLabel = `${l}{br}${n}${o}`;
|
|
385
423
|
}
|
|
386
|
-
const d = (e.palettecolors ||
|
|
387
|
-
const
|
|
388
|
-
let
|
|
389
|
-
return
|
|
390
|
-
...
|
|
391
|
-
color:
|
|
392
|
-
displayValue: `${n}${
|
|
393
|
-
toolText:
|
|
424
|
+
const d = (e.palettecolors || S).split(",").map((l) => l.trim()), c = a.map((l, s) => {
|
|
425
|
+
const h = Number(l.value) || 0, x = o > 0 ? (h / o * 100).toFixed(2) : "0", u = l.color || d[s % d.length];
|
|
426
|
+
let b;
|
|
427
|
+
return l.toolText ? b = l.toolText : e.plotToolText ? b = e.plotToolText : b = `<div style='font-size: 10px;font-weight:500;color:#2b2b2b;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${l.label}</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;font-size: 10px;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373'><span style='width:8px;height:8px;border-radius:2px;background-color:${u};display:inline-block;margin-right:5px;color:#AAAAAA;'></span>${l.label}</label><b style='text-align:right;color:#2b2b2b;font-weight:500;font-size:10px;'>${n}${h}</b></div>`, b = b.replace(/\$plotFillColor/g, u).replace(/\$color/g, u).replace(/\$label/g, l.label || "").replace(/\$value/g, String(l.value ?? "")).replace(/\$dataValue/g, `${n}${h}`).replace(/\$percentValue/g, x).replace(/\$unformattedSum/g, String(o)).replace(/\$sum/g, `${n}${o}`), {
|
|
428
|
+
...l,
|
|
429
|
+
color: u,
|
|
430
|
+
displayValue: `${n}${l.value} (${x}%){br}${l.label}`,
|
|
431
|
+
toolText: b
|
|
394
432
|
};
|
|
395
433
|
});
|
|
396
|
-
return
|
|
434
|
+
return g({
|
|
397
435
|
type: "doughnut2d",
|
|
398
436
|
width: e.width || "136",
|
|
399
437
|
height: e.height || "136",
|
|
400
438
|
dataSource: {
|
|
401
|
-
chart:
|
|
439
|
+
chart: Y(i),
|
|
402
440
|
data: c
|
|
403
441
|
}
|
|
404
442
|
});
|
|
405
443
|
}, ae = (e = {}) => {
|
|
406
444
|
const t = e.graphData;
|
|
407
|
-
return
|
|
445
|
+
return g({
|
|
408
446
|
type: "multiaxisline",
|
|
409
447
|
key: e.key,
|
|
410
|
-
width: e.width ||
|
|
448
|
+
width: e.width || m,
|
|
411
449
|
height: e.height || "400",
|
|
412
450
|
dataSource: {
|
|
413
451
|
chart: { ...t?.chart || {}, ...e.plotToolText ? { plotToolText: e.plotToolText } : {} },
|
|
@@ -417,7 +455,7 @@ const V = (e = {}) => {
|
|
|
417
455
|
});
|
|
418
456
|
}, le = (e = {}) => {
|
|
419
457
|
const t = e.graphData;
|
|
420
|
-
return
|
|
458
|
+
return g({
|
|
421
459
|
type: "multilevelpie",
|
|
422
460
|
width: e.width || "550",
|
|
423
461
|
height: e.height || "350",
|
|
@@ -444,8 +482,8 @@ const V = (e = {}) => {
|
|
|
444
482
|
data: d.data || []
|
|
445
483
|
}));
|
|
446
484
|
}
|
|
447
|
-
const
|
|
448
|
-
...
|
|
485
|
+
const r = y(e.numberPrefix), o = a.some((i) => !!i.color), n = {
|
|
486
|
+
...D(e),
|
|
449
487
|
bgColor: e.bgColor || "#ffffff",
|
|
450
488
|
xAxisName: e.xAxisName,
|
|
451
489
|
yAxisName: e.yAxisName,
|
|
@@ -458,9 +496,9 @@ const V = (e = {}) => {
|
|
|
458
496
|
showLabels: e.showLabels || "1",
|
|
459
497
|
showLegend: "0",
|
|
460
498
|
skipOverlapLabels: "0",
|
|
461
|
-
numberPrefix:
|
|
499
|
+
numberPrefix: r,
|
|
462
500
|
numVDivLines: e.numVDivLines || "5",
|
|
463
|
-
palettecolors:
|
|
501
|
+
palettecolors: o ? void 0 : N(e.palettecolors),
|
|
464
502
|
maxLabelHeight: e.maxLabelHeight,
|
|
465
503
|
numbersuffix: e.numbersuffix || "",
|
|
466
504
|
labelStep: p(t.length, e.labelStep),
|
|
@@ -472,9 +510,9 @@ const V = (e = {}) => {
|
|
|
472
510
|
scrollPadding: "5",
|
|
473
511
|
...e.plotToolText ? { plotToolText: e.plotToolText } : {}
|
|
474
512
|
};
|
|
475
|
-
return
|
|
513
|
+
return g({
|
|
476
514
|
type: "scrollcolumn2d",
|
|
477
|
-
width: e.width ||
|
|
515
|
+
width: e.width || m,
|
|
478
516
|
height: e.height || "400",
|
|
479
517
|
dataSource: {
|
|
480
518
|
chart: n,
|
|
@@ -483,18 +521,18 @@ const V = (e = {}) => {
|
|
|
483
521
|
}
|
|
484
522
|
});
|
|
485
523
|
}, ie = (e = {}) => {
|
|
486
|
-
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData,
|
|
524
|
+
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData, r = (a?.dataset || []).some((i) => !!i.color), o = "<div class='stacked-tooltip-total' style='display:flex;justify-content:space-between;align-items:center;padding:8px 0 0;margin-top:4px;border-top:1px solid #eee;min-width:180px'><span style='color:#2B2B2B;font-weight:500'>Total</span><b style='color:#2B2B2B;font-weight:500;font-size:10px'>$sum</b></div>", n = (a?.dataset || []).map((i, d) => ({
|
|
487
525
|
...i,
|
|
488
526
|
// plotToolText: props.plotToolText || (
|
|
489
527
|
// index === 0
|
|
490
528
|
// ? "<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>" + totalRow
|
|
491
529
|
// : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>$seriesName</label><b style='text-align:right;'>$dataValue</b></div>" + totalRow
|
|
492
|
-
plotToolText: e.plotToolText || (d === 0 ? "<div style='font-size: 10px;font-weight:500;color:#
|
|
530
|
+
plotToolText: e.plotToolText || (d === 0 ? "<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>$label</div><div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>$dataValue</b></div>" + o : "<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;min-width:180px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>$seriesName</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>$dataValue</b></div>" + o)
|
|
493
531
|
}));
|
|
494
|
-
return
|
|
532
|
+
return g({
|
|
495
533
|
type: "scrollstackedcolumn2d",
|
|
496
534
|
key: e.key,
|
|
497
|
-
width: e.width ||
|
|
535
|
+
width: e.width || m,
|
|
498
536
|
height: e.height || "400",
|
|
499
537
|
dataSource: {
|
|
500
538
|
chart: {
|
|
@@ -507,7 +545,7 @@ const V = (e = {}) => {
|
|
|
507
545
|
interactiveLegend: e.interactiveLegend || "1",
|
|
508
546
|
drawCrossLine: e.drawCrossLine || "1",
|
|
509
547
|
bgColor: e.bgColor || "#ffffff",
|
|
510
|
-
palettecolors:
|
|
548
|
+
palettecolors: r ? void 0 : e.palettecolors || S,
|
|
511
549
|
numberPrefix: t,
|
|
512
550
|
numVDivLines: e.numVDivLines || "5",
|
|
513
551
|
labelStep: p(a?.category?.length, e.labelStep),
|
|
@@ -524,34 +562,34 @@ const V = (e = {}) => {
|
|
|
524
562
|
}
|
|
525
563
|
});
|
|
526
564
|
}, ne = (e = {}) => {
|
|
527
|
-
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData,
|
|
528
|
-
const
|
|
565
|
+
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData, r = (a?.dataset || []).some((c) => !!c.color), o = (e.palettecolors || S).split(",").map((c) => c.trim()), n = a?.category || [], i = a?.dataset || [], d = i.map((c, l) => {
|
|
566
|
+
const s = c.color || o[l % o.length], h = c.data || [];
|
|
529
567
|
return {
|
|
530
568
|
...c,
|
|
531
|
-
color:
|
|
569
|
+
color: s,
|
|
532
570
|
...e.plotToolText ? { plotToolText: e.plotToolText } : {},
|
|
533
|
-
data:
|
|
534
|
-
const
|
|
571
|
+
data: h.map((x, u) => {
|
|
572
|
+
const b = n[u]?.label || "";
|
|
535
573
|
if (e.plotToolText)
|
|
536
|
-
return { ...
|
|
537
|
-
if (
|
|
538
|
-
return { ...
|
|
539
|
-
const
|
|
540
|
-
const C =
|
|
541
|
-
return `<div style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'><span style='width:8px;height:8px;border-radius:2px;background-color:${C};display:inline-block;margin-right:5px;'></span>${
|
|
574
|
+
return { ...x };
|
|
575
|
+
if (l > 0)
|
|
576
|
+
return { ...x, toolText: " " };
|
|
577
|
+
const w = i.map((f, v) => {
|
|
578
|
+
const C = f.color || o[v % o.length], $ = (f.data || [])[u]?.value ?? "", B = f.seriesname || "", A = f.tooltipPrefix !== void 0 ? f.tooltipPrefix : t, k = f.renderAs || "column";
|
|
579
|
+
return `<div class='mscombi-tooltip-row' data-series-index='${v}' data-render-as='${k}' style='display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 0;min-width:200px'><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'><span class='mscombi-dot' style='width:8px;height:8px;border-radius:2px;background-color:${C};display:inline-block;margin-right:5px;'></span>${B}</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${A}${$}</b></div>`;
|
|
542
580
|
}).join("");
|
|
543
581
|
return {
|
|
544
|
-
...
|
|
582
|
+
...x,
|
|
545
583
|
// toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${label}</div>${tooltipItems}`,
|
|
546
|
-
toolText: `<div style='font-size: 10px;font-weight:500;color:#
|
|
584
|
+
toolText: `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${b}</div>${w}`
|
|
547
585
|
};
|
|
548
586
|
})
|
|
549
587
|
};
|
|
550
588
|
});
|
|
551
|
-
return
|
|
589
|
+
return g({
|
|
552
590
|
type: "mscombidy2d",
|
|
553
591
|
key: e.key,
|
|
554
|
-
width: e.width ||
|
|
592
|
+
width: e.width || m,
|
|
555
593
|
height: e.height || "400",
|
|
556
594
|
dataSource: {
|
|
557
595
|
chart: {
|
|
@@ -563,17 +601,17 @@ const V = (e = {}) => {
|
|
|
563
601
|
sYAxisName: e.sYAxisName,
|
|
564
602
|
numberPrefix: t,
|
|
565
603
|
labelStep: p(n.length, e.labelStep),
|
|
566
|
-
palettecolors:
|
|
604
|
+
palettecolors: r ? void 0 : e.palettecolors || S
|
|
567
605
|
},
|
|
568
606
|
categories: [{ category: n }],
|
|
569
607
|
dataset: d
|
|
570
608
|
}
|
|
571
609
|
});
|
|
572
610
|
}, se = (e = {}) => {
|
|
573
|
-
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData,
|
|
574
|
-
return
|
|
611
|
+
const t = e.graphLabel ? "" : y(e.numberPrefix), a = e.graphData, r = a?.category || [], o = a?.dataset || [];
|
|
612
|
+
return g({
|
|
575
613
|
type: "scrollline2d",
|
|
576
|
-
width: e?.width ||
|
|
614
|
+
width: e?.width || m,
|
|
577
615
|
height: e?.height || "400",
|
|
578
616
|
dataSource: {
|
|
579
617
|
chart: {
|
|
@@ -591,18 +629,18 @@ const V = (e = {}) => {
|
|
|
591
629
|
flatScrollBars: "1",
|
|
592
630
|
scrollPadding: "5",
|
|
593
631
|
numDivLines: "5",
|
|
594
|
-
labelStep: p(
|
|
632
|
+
labelStep: p(r.length, e?.labelStep),
|
|
595
633
|
...e?.plotToolText ? { plotToolText: e.plotToolText } : {},
|
|
596
634
|
...e?.chartConfig || {}
|
|
597
635
|
},
|
|
598
|
-
categories: [{ category:
|
|
599
|
-
dataset:
|
|
636
|
+
categories: [{ category: r }],
|
|
637
|
+
dataset: o
|
|
600
638
|
}
|
|
601
639
|
});
|
|
602
640
|
}, re = {
|
|
603
641
|
area: G,
|
|
604
|
-
bar2d:
|
|
605
|
-
column2d:
|
|
642
|
+
bar2d: M,
|
|
643
|
+
column2d: M,
|
|
606
644
|
doughnutChart: te,
|
|
607
645
|
groupChart: K,
|
|
608
646
|
line: U,
|