@ck-ui/component-library 1.0.1 → 1.0.2

package/dist/components/FusionChart/_config/builders.js

@@ -1,18 +1,18 @@
-import { EXTENDED_PALETTE as $, DEFAULT_WIDTH as h, STACKED_AREA_PALETTE as z } from "../_constant/constants.js";
-import { getBaseConfig as g, getStackedColumnChartShell as T, getStackedAreaChartShell as H, getStackedBarChartShell as R, getLineChartShell as V, getCommonChartShell as L, getScrollAreaChartShell as N, getMultipleLineChartShell as O, getMsCombiDy2dChartShell as W, getGroupChartShell as _, getDoughnutChartShell as G } from "./helpers.js";
-import { getCurrencyPrefix as m, getLabelStep as b, getCartesianPalette as k, getGraphDataLength as U, getBarType as q, getCurrencySymbol as F } from "../_utils/chartHelpers.js";
-const P = (e = {}) => {
-  const t = e.plotSpacePercent ?? (e.plotSpacePercent === 0 ? e.plotSpacePercent : 60), a = Array.isArray(e.graphData) ? e.graphData : [], s = a.some((c) => !!c.color), l = k(e?.palettecolors)?.split(",")?.map((c) => c?.trim()), i = a?.map((c, d) => {
-    const x = c?.color || l[d % l.length];
+import { EXTENDED_PALETTE as $, DEFAULT_WIDTH as g, STACKED_AREA_PALETTE as H } from "../_constant/constants.js";
+import { getBaseConfig as h, getStackedColumnChartShell as F, getStackedAreaChartShell as R, getStackedBarChartShell as O, getLineChartShell as j, getCommonChartShell as P, getScrollAreaChartShell as V, getMultipleLineChartShell as W, getMsCombiDy2dChartShell as Y, getGroupChartShell as _, getDoughnutChartShell as G } from "./helpers.js";
+import { getCurrencyPrefix as u, getLabelStep as f, getCartesianPalette as L, getCurrencySymbol as E, getGraphDataLength as U, getBarType as K } from "../_utils/chartHelpers.js";
+const M = (e = {}) => {
+  const t = e.plotSpacePercent ?? (e.plotSpacePercent === 0 ? e.plotSpacePercent : 60), a = Array.isArray(e.graphData) ? e.graphData : [], s = a.some((o) => !!o.color), l = L(e?.palettecolors)?.split(",")?.map((o) => o?.trim()), n = a?.map((o, c) => {
+    const x = o?.color || l[c % l.length];
     return {
-      ...c,
+      ...o,
       color: x,
-      toolText: e.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${c.label || ""}</div><div style='display:flex;justify-content:space-between;align-items:center;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${x};display:inline-block'></span>${c.label || ""}</span><b style='color:#2B2B2B'>${m(e.numberPrefix)}${c.value || ""}</b></div>`
+      toolText: e.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${o.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;'>${o.label || ""}</label><b style='text-align:right;'>${u(e.numberPrefix)}${o.value || ""}</b></div>`
     };
-  }), o = {
-    ...L(e),
+  }), i = {
+    ...P(e),
     bgColor: e.bgColor || "#ffffff",
-    labelStep: b(U(e), e.labelStep),
+    labelStep: f(U(e), e.labelStep),
     xAxisName: e.xAxisName,
     yAxisName: e.yAxisName,
     chartBottomMargin: e.chartBottomMargin,
@@ -23,67 +23,67 @@ const P = (e = {}) => {
     showValues: e.showValues || "0",
     showLabels: e.showLabels || "1",
     skipOverlapLabels: "0",
-    numberPrefix: m(e.numberPrefix),
+    numberPrefix: u(e.numberPrefix),
     // When per-item colors are set, don't use palettecolors (it overrides item colors)
-    palettecolors: s ? void 0 : k(e.palettecolors),
+    palettecolors: s ? void 0 : L(e.palettecolors),
     maxLabelHeight: e.maxLabelHeight,
     numbersuffix: e.numbersuffix || ""
-  }, r = e.graphData, n = e?.hideScroll ? { chart: o, data: i?.length > 0 ? i : e?.graphData || [] } : {
-    chart: o,
+  }, r = e.graphData, d = e?.hideScroll ? { chart: i, data: n?.length > 0 ? n : e?.graphData || [] } : {
+    chart: i,
     categories: r?.categories,
     dataset: r?.dataset
   };
-  return g({
-    type: q(e),
-    width: h,
+  return h({
+    type: K(e),
+    width: g,
     height: e.height || "300",
-    dataSource: n
+    dataSource: d
   });
-}, K = (e = {}) => g({
+}, X = (e = {}) => h({
   type: "area2d",
-  width: h,
+  width: g,
   height: "550",
   dataSource: {
     chart: {
-      ...L({ ...e, decimals: "2" }),
+      ...P({ ...e, decimals: "2" }),
       xAxisName: e.xAxisName,
       yAxisName: e.yAxisName,
       labelFontSize: 12,
-      plotToolText: `<div class='headingCont'>$label</div><div class='tooltipListCont'><div class='tooltipItem'><span class='colorSquare'></span><span>$label</span><b>${F()}$value</b></div></div>`
+      plotToolText: e.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;'>${E()}$value</b></div>`
     },
     data: e.graphData || []
   }
-}), X = (e = {}) => {
-  const t = (e?.palettecolors || "#8ECFFF").split(",")[0].trim(), a = Array.isArray(e?.graphData) ? e.graphData : [], s = m(e?.numberPrefix), l = a?.map((i) => ({
-    ...i,
-    toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${i?.label || ""}</div><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:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${t};display:inline-block'></span>${i?.label || ""}</span><b style='color:#2B2B2B'>${s}${i?.value || ""}</b></div>`
+}), q = (e = {}) => {
+  const t = Array.isArray(e?.graphData) ? e.graphData : [], a = u(e?.numberPrefix), s = t?.map((l) => ({
+    ...l,
+    toolText: e?.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${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;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;'>${l?.label || ""}</label><b style='text-align:right;'>${a}${l?.value || ""}</b></div>`
   }));
-  return g({
+  return h({
     type: "line",
-    width: e?.width || h,
+    width: e?.width || g,
     height: e?.height || "300",
     dataSource: {
       chart: {
-        ...V(e),
+        ...j(e),
         xAxisName: e?.xAxisName,
         yAxisName: e?.yAxisName,
-        labelStep: b(a.length, void 0),
+        labelStep: f(t.length, void 0),
         ...e?.chartConfig || {}
       },
-      data: l.length > 0 ? l : e?.graphData || []
+      data: s.length > 0 ? s : e?.graphData || []
     }
   });
 }, J = (e = {}) => {
-  let t = F();
+  let t = E();
   e.numberPrefix === "" ? t = "" : e.numberPrefix !== null && e.numberPrefix !== void 0 && (t = e.numberPrefix);
-  const a = e.graphData, s = (a?.dataset || []).some((i) => !!i.color), l = (a?.dataset || []).map((i, o) => ({
-    ...i,
-    plotToolText: o === 0 ? "<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;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>" : "<div style='display:flex;justify-content:space-between;align-items:center;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>"
+  const a = e.graphData, s = (a?.dataset || []).some((n) => !!n.color), l = (a?.dataset || []).map((n, i) => ({
+    ...n,
+    plotToolText: e.plotToolText || (i === 0 ? "<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>" : "<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>")
   }));
-  return g({
+  return h({
     type: "mscolumn2d",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
       chart: {
@@ -95,7 +95,7 @@ const P = (e = {}) => {
         showLegend: "0",
         legendIconSides: e.legendIconSides,
         numberPrefix: t,
-        labelStep: b(a?.category?.length, e.labelStep),
+        labelStep: f(a?.category?.length, e.labelStep),
         ...s ? { palettecolors: void 0 } : {}
       },
       categories: [{ category: a?.category || [] }],
@@ -103,18 +103,18 @@ const P = (e = {}) => {
     }
   });
 }, Q = (e = {}) => {
-  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).some((o) => !!o.color), l = "<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:600'>Total</span><b style='color:#2B2B2B'>$sum</b></div>", i = (a?.dataset || []).map((o, r) => ({
-    ...o,
-    plotToolText: r === 0 ? "<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;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>" + l : "<div style='display:flex;justify-content:space-between;align-items:center;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>" + l
+  const t = e.graphLabel ? "" : u(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).some((i) => !!i.color), l = "<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:600'>Total</span><b style='color:#2B2B2B'>$sum</b></div>", n = (a?.dataset || []).map((i, r) => ({
+    ...i,
+    plotToolText: e.plotToolText || (r === 0 ? "<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>" + l : "<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>" + l)
   }));
-  return g({
+  return h({
     type: e.hideScroll ? "stackedcolumn2d" : "scrollstackedcolumn2d",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
       chart: {
-        ...T(e),
+        ...F(e),
         yAxisMaxValue: e.yAxisMaxValue,
         xAxisName: e.xAxisName,
         yAxisName: e.yAxisName,
@@ -125,32 +125,32 @@ const P = (e = {}) => {
         bgColor: e.bgColor || "#ffffff",
         palettecolors: s ? void 0 : e.palettecolors || $,
         numberPrefix: t,
-        labelStep: b(a?.category?.length, e.labelStep),
+        labelStep: f(a?.category?.length, e.labelStep),
         showSum: e.showSum ? "1" : void 0
       },
       categories: [
         { category: a?.category || [] }
       ],
-      dataset: i
+      dataset: n
     }
   });
-}, Y = (e = {}) => {
-  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).map((l, i) => ({
+}, Z = (e = {}) => {
+  const t = e.graphLabel ? "" : u(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).map((l, n) => ({
     ...l,
     drawCustomLegendIcon: "1",
     legendIconSides: "4",
     legendIconBorderThickness: "0",
     legendIconBgAlpha: "100",
-    plotToolText: i === 0 ? "<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;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>" : "<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:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>"
+    plotToolText: e.plotToolText || (n === 0 ? "<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>" : "<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>")
   }));
-  return g({
+  return h({
     type: "msline",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
       chart: {
-        ...O(e),
+        ...W(e),
         yAxisMaxValue: e.yAxisMaxValue,
         xAxisName: e.xAxisName,
         yAxisName: e.yAxisName,
@@ -158,18 +158,18 @@ const P = (e = {}) => {
         legendPosition: e.legendRight ? void 0 : e.legendPosition,
         numberPrefix: t,
         chartLeftMargin: e.chartLeftMargin || "20",
-        labelStep: b(a?.category?.length, e.labelStep),
+        labelStep: f(a?.category?.length, e.labelStep),
         showValues: e.showValues === "1" ? "1" : "0"
       },
       categories: [{ category: a?.category || [] }],
       dataset: s
     }
   });
-}, Z = (e = {}) => {
-  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, l = (e.palettecolors || z).split(",").map((n) => n.trim()), i = a?.category || [], o = a?.dataset || [], r = o.map((n, c) => {
-    const x = n.color || l[c % l.length], y = n.data || [];
+}, ee = (e = {}) => {
+  const t = e.graphLabel ? "" : u(e.numberPrefix), a = e.graphData, l = (e.palettecolors || H).split(",").map((d) => d.trim()), n = a?.category || [], i = a?.dataset || [], r = i.map((d, o) => {
+    const x = d.color || l[o % l.length], y = d.data || [];
     return {
-      ...n,
+      ...d,
       color: x,
       plotBorderColor: x,
       plotBorderThickness: "2",
@@ -177,34 +177,37 @@ const P = (e = {}) => {
       anchorBgColor: x,
       anchorBorderColor: x,
       showPlotBorder: "1",
-      data: y.map((C, u) => {
-        const w = i[u]?.label || "";
-        if (c > 0)
+      ...e.plotToolText ? { plotToolText: e.plotToolText } : {},
+      data: y.map((b, m) => {
+        const T = n[m]?.label || "";
+        if (e.plotToolText)
+          return { ...b, alpha: "60" };
+        if (o > 0)
           return {
-            ...C,
+            ...b,
             alpha: "60",
             toolText: " "
           };
-        const f = o.map((p, B) => {
-          const v = p.color || l[B % l.length], S = (p.data || [])[u]?.value ?? "", A = p.seriesname || "";
-          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:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${v};display:inline-block'></span>${A}</span><b style='color:#2B2B2B'>${t}${S}</b></div>`;
+        const w = i.map((C, v) => {
+          const S = C.color || l[v % l.length], A = (C.data || [])[m]?.value ?? "", B = C.seriesname || "", N = v === o ? "#2B2B2B" : "#666";
+          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:${N}'><span style='width:10px;height:10px;border-radius:2px;background-color:${S};display:inline-block'></span>${B}</span><b style='color:${N}'>${t}${A}</b></div>`;
         }).join("");
         return {
-          ...C,
+          ...b,
           alpha: "60",
-          toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${w}</div>${f}`
+          toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${T}</div>${w}`
         };
       })
     };
   });
-  return g({
+  return h({
     type: "stackedarea2d",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
       chart: {
-        ...H(e),
+        ...R(e),
         yAxisMaxValue: e.yAxisMaxValue,
         xAxisName: e.xAxisName,
         yAxisName: e.yAxisName,
@@ -214,67 +217,70 @@ const P = (e = {}) => {
         drawCrossLine: "1",
         crossLineColor: "#f2f5fa",
         numberPrefix: t,
-        labelStep: b(a?.category?.length, e.labelStep)
+        labelStep: f(a?.category?.length, e.labelStep)
       },
       categories: [{ category: a?.category || [] }],
       dataset: r
     }
   });
-}, ee = (e = {}) => {
-  const t = m(e.numberPrefix), s = (e?.palettecolors || "#8ECFFF").split(",").map((d) => d.trim()), l = s[0];
+}, te = (e = {}) => {
+  const t = u(e.numberPrefix), s = (e?.palettecolors || "#8ECFFF").split(",").map((c) => c.trim()), l = s[0];
   if (!Array.isArray(e?.graphData) && e?.graphData?.dataset) {
-    const d = e.graphData, x = d?.category || [], y = d?.dataset || [], C = y.map((u, w) => {
-      const f = u.color || s[w % s.length], p = u.data || [];
+    const c = e.graphData, x = c?.category || [], y = c?.dataset || [], b = y.map((m, T) => {
+      const w = m.color || s[T % s.length], C = m.data || [];
       return {
-        ...u,
-        color: f,
+        ...m,
+        color: w,
         anchorRadius: "3",
         anchorBgColor: "#FFFFFF",
-        anchorBorderColor: f,
+        anchorBorderColor: w,
         anchorBorderThickness: "1",
-        data: p.map((B, v) => {
-          const D = x[v]?.label || "";
-          if (w > 0)
-            return { ...B, toolText: " " };
-          const S = y.map((A, M) => {
-            const j = A.color || s[M % s.length], E = (A.data || [])[v]?.value ?? "", I = A.seriesname || "";
-            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:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${j};display:inline-block'></span>${I}</span><b style='color:#2B2B2B'>${t}${E}</b></div>`;
+        ...e.plotToolText ? { plotToolText: e.plotToolText } : {},
+        data: C.map((v, S) => {
+          const D = x[S]?.label || "";
+          if (e.plotToolText)
+            return { ...v };
+          if (T > 0)
+            return { ...v, toolText: " " };
+          const A = y.map((B, p) => {
+            const I = (B.data || [])[S]?.value ?? "", z = B.seriesname || "", k = p === T ? "#2B2B2B" : "#666";
+            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:${k}'>${z}</label><b style='text-align:right;color:${k}'>${t}${I}</b></div>`;
           }).join("");
           return {
-            ...B,
-            toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${D}</div>${S}`
+            ...v,
+            toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${D}</div>${A}`
           };
         })
       };
     });
-    return g({
+    return h({
       type: "scrollarea2d",
-      width: e?.width || h,
+      width: e?.width || g,
       height: e?.height || "400",
       dataSource: {
         chart: {
-          ...N(e),
+          ...V(e),
           xAxisName: e?.xAxisName,
           yAxisName: e?.yAxisName,
           numberPrefix: t,
           ...e?.chartConfig || {}
         },
         categories: [{ category: x }],
-        dataset: C
+        dataset: b
       }
     });
   }
-  const o = Array.isArray(e?.graphData) ? e.graphData : [], r = o.map((d) => ({ label: d?.label || "" })), n = e.legendLabel || "Spend", c = o.map((d) => ({
-    value: d?.value,
-    toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${d?.label || ""}</div><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:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${l};display:inline-block'></span>${n}</span><b style='color:#2B2B2B'>${t}${d?.value || ""}</b></div>`
+  const i = Array.isArray(e?.graphData) ? e.graphData : [], r = i.map((c) => ({ label: c?.label || "" })), d = e.legendLabel || "Spend", o = i.map((c) => ({
+    value: c?.value,
+    toolText: e?.plotToolText || `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${c?.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;'>${d}</label><b style='text-align:right;'>${t}${c?.value || ""}</b></div>`
   }));
-  return g({
+  return h({
     type: "scrollarea2d",
-    width: e?.width || h,
+    width: e?.width || g,
     height: e?.height || "400",
     dataSource: {
       chart: {
-        ...N(e),
+        ...V(e),
         xAxisName: e?.xAxisName,
         yAxisName: e?.yAxisName,
         numberPrefix: t,
@@ -283,38 +289,39 @@ const P = (e = {}) => {
       categories: [{ category: r }],
       dataset: [
         {
-          seriesname: n,
+          seriesname: d,
           color: l,
           anchorRadius: "3",
           anchorBgColor: "#FFFFFF",
           anchorBorderColor: l,
           anchorBorderThickness: "1",
-          data: c
+          data: o
         }
       ]
     }
   });
-}, te = (e = {}) => {
+}, ae = (e = {}) => {
   const t = e.graphData;
-  return g({
+  return h({
     type: "stackedbar2d",
-    width: h,
+    width: g,
     height: e.height || "400",
     dataSource: {
       chart: {
-        ...R(e),
+        ...O(e),
         xAxisName: e.xAxisName,
-        yAxisName: e.yAxisName
+        yAxisName: e.yAxisName,
+        ...e.plotToolText ? { plotToolText: e.plotToolText } : {}
       },
       categories: [{ category: t?.category || [] }],
       dataset: t?.dataset || []
     }
   });
-}, ae = (e = {}) => {
+}, le = (e = {}) => {
   const t = e.graphData;
-  return g({
+  return h({
     type: "sankey",
-    width: h,
+    width: g,
     height: e.height || "600",
     dataSource: {
       chart: {
@@ -332,81 +339,84 @@ const P = (e = {}) => {
         nodeLabelPadding: "20px",
         legendItemFontSize: 9,
         nodeLabelFontBold: 0.5,
-        yAxisName: e.yAxisName
+        yAxisName: e.yAxisName,
+        ...e.plotToolText ? { plotToolText: e.plotToolText } : {}
       },
       nodes: t?.nodes || [],
       links: t?.links || []
     }
   });
-}, le = (e = {}) => {
-  const a = e.graphData?.data || [], s = a.reduce((n, c) => n + (Number(c.value) || 0), 0), l = e.numberPrefix ?? "$", i = { ...e };
+}, ie = (e = {}) => {
+  const a = e.graphData?.data || [], s = a.reduce((o, c) => o + (Number(c.value) || 0), 0), l = Math.round(s * 100) / 100, n = e.numberPrefix ?? "$", i = { ...e };
   if (!i.defaultCenterLabel)
-    i.defaultCenterLabel = `Total{br}${l}${s}`;
+    i.defaultCenterLabel = `Total{br}${n}${l}`;
   else if (i.defaultCenterLabel.includes("{br}")) {
-    const [n] = i.defaultCenterLabel.split("{br}");
-    i.defaultCenterLabel = `${n}{br}${l}${s}`;
+    const [o] = i.defaultCenterLabel.split("{br}");
+    i.defaultCenterLabel = `${o}{br}${n}${l}`;
   }
-  const o = (e.palettecolors || $).split(",").map((n) => n.trim()), r = a.map((n, c) => {
-    const d = Number(n.value) || 0, x = s > 0 ? (d / s * 100).toFixed(2) : "0", y = n.color || o[c % o.length];
-    return {
-      ...n,
-      displayValue: `${l}${n.value} (${x}%){br}${n.label}`,
-      toolText: `<div style='font-size:14px;font-weight:600;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;padding:2px 0;min-width:200px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${y};display:inline-block'></span>${n.label}</span><b style='color:#2B2B2B'>${l}${d}</b></div>`
+  const r = (e.palettecolors || $).split(",").map((o) => o.trim()), d = a.map((o, c) => {
+    const x = Number(o.value) || 0, y = l > 0 ? (x / l * 100).toFixed(2) : "0", b = o.color || r[c % r.length];
+    let m;
+    return e.plotToolText ? m = e.plotToolText.replace(/\$plotFillColor/g, b).replace(/\$color/g, b).replace(/\$label/g, o.label || "").replace(/\$value/g, String(o.value ?? "")).replace(/\$dataValue/g, `${n}${x}`).replace(/\$percentValue/g, y).replace(/\$unformattedSum/g, String(l)).replace(/\$sum/g, `${n}${l}`) : m = `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${o.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;'><span style='width:8px;height:8px;border-radius:2px;background-color:${b};display:inline-block;margin-right:5px'></span>${o.label}</label><b style='text-align:right;'>${n}${x}</b></div>`, {
+      ...o,
+      color: b,
+      displayValue: `${n}${o.value} (${y}%){br}${o.label}`,
+      toolText: m
     };
   });
-  return g({
+  return h({
     type: "doughnut2d",
     width: e.width || "136",
     height: e.height || "136",
     dataSource: {
       chart: G(i),
-      data: r
+      data: d
     }
   });
-}, ie = (e = {}) => {
+}, oe = (e = {}) => {
   const t = e.graphData;
-  return g({
+  return h({
     type: "multiaxisline",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
-      chart: t?.chart || {},
+      chart: { ...t?.chart || {}, ...e.plotToolText ? { plotToolText: e.plotToolText } : {} },
       categories: t?.categories || [],
       axis: t?.axis || []
     }
   });
-}, oe = (e = {}) => {
+}, ne = (e = {}) => {
   const t = e.graphData;
-  return g({
+  return h({
     type: "multilevelpie",
     width: e.width || "550",
     height: e.height || "350",
     dataSource: {
-      chart: t?.data?.chart,
+      chart: { ...t?.data?.chart || {}, ...e.plotToolText ? { plotToolText: e.plotToolText } : {} },
       category: t?.data?.category
     }
   });
-}, ne = (e = {}) => {
+}, se = (e = {}) => {
   let t = [], a = [];
   if (Array.isArray(e.graphData)) {
-    const o = e.graphData;
-    t = o.map((r) => ({ label: r.label || "" })), a = [
+    const i = e.graphData;
+    t = i.map((r) => ({ label: r.label || "" })), a = [
       {
         seriesname: "Series 1",
-        data: o.map((r) => ({ value: r.value }))
+        data: i.map((r) => ({ value: r.value }))
       }
     ];
   } else {
-    const o = e.graphData;
-    t = o?.category || [], a = (o?.dataset || []).map((r) => ({
+    const i = e.graphData;
+    t = i?.category || [], a = (i?.dataset || []).map((r) => ({
       ...r,
       seriesname: r.seriesname || "Series",
       data: r.data || []
     }));
   }
-  const s = m(e.numberPrefix), l = a.some((o) => !!o.color), i = {
-    ...L(e),
+  const s = u(e.numberPrefix), l = a.some((i) => !!i.color), n = {
+    ...P(e),
     bgColor: e.bgColor || "#ffffff",
     xAxisName: e.xAxisName,
     yAxisName: e.yAxisName,
@@ -421,40 +431,41 @@ const P = (e = {}) => {
     skipOverlapLabels: "0",
     numberPrefix: s,
     numVDivLines: e.numVDivLines || "5",
-    palettecolors: l ? void 0 : k(e.palettecolors),
+    palettecolors: l ? void 0 : L(e.palettecolors),
     maxLabelHeight: e.maxLabelHeight,
     numbersuffix: e.numbersuffix || "",
-    labelStep: b(t.length, e.labelStep),
+    labelStep: f(t.length, e.labelStep),
     numVisiblePlot: e.numVisiblePlot || "8",
     scrollShowButtons: "0",
     scrollColor: "#CCCCCC",
     scrollHeight: "10",
     flatScrollBars: "1",
-    scrollPadding: "5"
+    scrollPadding: "5",
+    ...e.plotToolText ? { plotToolText: e.plotToolText } : {}
   };
-  return g({
+  return h({
     type: "scrollcolumn2d",
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
-      chart: i,
+      chart: n,
       categories: [{ category: t }],
       dataset: a
     }
   });
-}, se = (e = {}) => {
-  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).some((o) => !!o.color), l = "<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:600'>Total</span><b style='color:#2B2B2B'>$sum</b></div>", i = (a?.dataset || []).map((o, r) => ({
-    ...o,
-    plotToolText: r === 0 ? "<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;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>" + l : "<div style='display:flex;justify-content:space-between;align-items:center;padding:4px 0;min-width:180px'><span style='display:flex;align-items:center;gap:6px;color:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:$color;display:inline-block'></span>$seriesName</span><b style='color:#2B2B2B'>$dataValue</b></div>" + l
+}, re = (e = {}) => {
+  const t = e.graphLabel ? "" : u(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).some((i) => !!i.color), l = "<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:600'>Total</span><b style='color:#2B2B2B'>$sum</b></div>", n = (a?.dataset || []).map((i, r) => ({
+    ...i,
+    plotToolText: e.plotToolText || (r === 0 ? "<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>" + l : "<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>" + l)
   }));
-  return g({
+  return h({
     type: "scrollstackedcolumn2d",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
       chart: {
-        ...T(e),
+        ...F(e),
         yAxisMaxValue: e.yAxisMaxValue,
         xAxisName: e.xAxisName,
         yAxisName: e.yAxisName,
@@ -466,7 +477,7 @@ const P = (e = {}) => {
         palettecolors: s ? void 0 : e.palettecolors || $,
         numberPrefix: t,
         numVDivLines: e.numVDivLines || "5",
-        labelStep: b(a?.category?.length, e.labelStep),
+        labelStep: f(a?.category?.length, e.labelStep),
         showSum: e.showSum ? "1" : void 0,
         numVisiblePlot: e.numVisiblePlot || "6",
         scrollShowButtons: "0",
@@ -476,58 +487,61 @@ const P = (e = {}) => {
         scrollPadding: "5"
       },
       categories: [{ category: a?.category || [] }],
-      dataset: i
+      dataset: n
     }
   });
-}, re = (e = {}) => {
-  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).some((n) => !!n.color), l = (e.palettecolors || $).split(",").map((n) => n.trim()), i = a?.category || [], o = a?.dataset || [], r = o.map((n, c) => {
-    const d = n.color || l[c % l.length], x = n.data || [];
+}, de = (e = {}) => {
+  const t = e.graphLabel ? "" : u(e.numberPrefix), a = e.graphData, s = (a?.dataset || []).some((d) => !!d.color), l = (e.palettecolors || $).split(",").map((d) => d.trim()), n = a?.category || [], i = a?.dataset || [], r = i.map((d, o) => {
+    const c = d.color || l[o % l.length], x = d.data || [];
     return {
-      ...n,
-      color: d,
-      data: x.map((y, C) => {
-        const u = i[C]?.label || "";
-        if (c > 0)
-          return { ...y, toolText: " " };
-        const w = o.map((f, p) => {
-          const B = f.color || l[p % l.length], D = (f.data || [])[C]?.value ?? "", S = f.seriesname || "";
-          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:#666'><span style='width:10px;height:10px;border-radius:2px;background-color:${B};display:inline-block'></span>${S}</span><b style='color:#2B2B2B'>${t}${D}</b></div>`;
+      ...d,
+      color: c,
+      ...e.plotToolText ? { plotToolText: e.plotToolText } : {},
+      data: x.map((y, b) => {
+        const m = n[b]?.label || "";
+        if (e.plotToolText)
+          return { ...y };
+        const T = i.map((w, C) => {
+          const v = w.color || l[C % l.length], D = (w.data || [])[b]?.value ?? "", A = w.seriesname || "", p = C === o ? "#2B2B2B" : "#666";
+          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:${p}'><span style='width:8px;height:8px;border-radius:2px;background-color:${v};display:inline-block;margin-right:5px;'></span>${A}</label><b style='text-align:right;color:${p}'>${t}${D}</b></div>`;
         }).join("");
         return {
           ...y,
-          toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${u}</div>${w}`
+          toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${m}</div>${T}`
         };
       })
     };
   });
-  return g({
+  return h({
     type: "mscombidy2d",
     key: e.key,
-    width: e.width || h,
+    width: e.width || g,
     height: e.height || "400",
     dataSource: {
       chart: {
-        ...W(e),
+        ...Y(e),
         yAxisMaxValue: e.yAxisMaxValue,
         xAxisName: e.xAxisName,
         yAxisName: e.yAxisName,
+        pYAxisName: e.pYAxisName,
+        sYAxisName: e.sYAxisName,
         numberPrefix: t,
-        labelStep: b(i.length, e.labelStep),
+        labelStep: f(n.length, e.labelStep),
         palettecolors: s ? void 0 : e.palettecolors || $
       },
-      categories: [{ category: i }],
+      categories: [{ category: n }],
       dataset: r
     }
   });
 }, ce = (e = {}) => {
-  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, s = a?.category || [], l = a?.dataset || [];
-  return g({
+  const t = e.graphLabel ? "" : u(e.numberPrefix), a = e.graphData, s = a?.category || [], l = a?.dataset || [];
+  return h({
     type: "scrollline2d",
-    width: e?.width || h,
+    width: e?.width || g,
     height: e?.height || "400",
     dataSource: {
       chart: {
-        ...V(e),
+        ...j(e),
         xAxisName: e?.xAxisName,
         yAxisName: e?.yAxisName,
         numberPrefix: t,
@@ -541,33 +555,34 @@ const P = (e = {}) => {
         flatScrollBars: "1",
         scrollPadding: "5",
         numDivLines: "5",
-        labelStep: b(s.length, e?.labelStep),
+        labelStep: f(s.length, e?.labelStep),
+        ...e?.plotToolText ? { plotToolText: e.plotToolText } : {},
         ...e?.chartConfig || {}
       },
       categories: [{ category: s }],
       dataset: l
     }
   });
-}, de = {
-  area: K,
-  bar2d: P,
-  column2d: P,
-  doughnutChart: le,
+}, he = {
+  area: X,
+  bar2d: M,
+  column2d: M,
+  doughnutChart: ie,
   groupChart: J,
-  line: X,
-  msCombiDy2d: re,
-  multiAxisLineChart: ie,
-  multilevelpie: oe,
-  multipleLineChart: Y,
-  sankey: ae,
-  scrollArea: ee,
-  scrollColumn2d: ne,
+  line: q,
+  msCombiDy2d: de,
+  multiAxisLineChart: oe,
+  multilevelpie: ne,
+  multipleLineChart: Z,
+  sankey: le,
+  scrollArea: te,
+  scrollColumn2d: se,
   scrollLine2d: ce,
-  scrollStackedColumn2d: se,
-  stackBarChart: te,
-  stackedArea: Z,
+  scrollStackedColumn2d: re,
+  stackBarChart: ae,
+  stackedArea: ee,
   stackedcolumn2d: Q
-}, be = (e = {}) => e.chartType ? de[e.chartType]?.(e) ?? null : null;
+}, ue = (e = {}) => e.chartType ? he[e.chartType]?.(e) ?? null : null;
 export {
-  be as buildChartConfig
+  ue as buildChartConfig
 };