@ck-ui/component-library 0.1.5 → 0.3.0

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

@@ -0,0 +1,573 @@
+import { EXTENDED_PALETTE as D, DEFAULT_WIDTH as g, STACKED_AREA_PALETTE as z } from "../_constant/constants.js";
+import { getBaseConfig as h, getStackedColumnChartShell as T, getStackedAreaChartShell as H, getStackedBarChartShell as R, getLineChartShell as V, getCommonChartShell as N, getScrollAreaChartShell as k, getMultipleLineChartShell as O, getMsCombiDy2dChartShell as W, getGroupChartShell as _, getDoughnutChartShell as G } from "./helpers.js";
+import { getCurrencyPrefix as m, getLabelStep as b, getCartesianPalette as L, 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 : [], n = a.some((r) => !!r.color), l = L(e?.palettecolors)?.split(",")?.map((r) => r?.trim()), i = a?.map((r, d) => {
+    const x = r?.color || l[d % l.length];
+    return {
+      ...r,
+      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'>${r.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>${r.label || ""}</span><b style='color:#2B2B2B'>${m(e.numberPrefix)}${r.value || ""}</b></div>`
+    };
+  }), s = {
+    ...N(e),
+    bgColor: e.bgColor || "#ffffff",
+    labelStep: b(U(e), e.labelStep),
+    xAxisName: e.xAxisName,
+    yAxisName: e.yAxisName,
+    chartBottomMargin: e.chartBottomMargin,
+    chartLeftMargin: e.chartLeftMargin,
+    plotSpacePercent: t,
+    labelDisplay: e.labelDisplay,
+    useEllipsesWhenOverflow: e.useEllipsesWhenOverflow,
+    showValues: e.showValues || "0",
+    showLabels: e.showLabels || "1",
+    skipOverlapLabels: "0",
+    numberPrefix: m(e.numberPrefix),
+    // When per-item colors are set, don't use palettecolors (it overrides item colors)
+    palettecolors: n ? void 0 : L(e.palettecolors),
+    maxLabelHeight: e.maxLabelHeight,
+    numbersuffix: e.numbersuffix || ""
+  }, c = e.graphData, o = e?.hideScroll ? { chart: s, data: i?.length > 0 ? i : e?.graphData || [] } : {
+    chart: s,
+    categories: c?.categories,
+    dataset: c?.dataset
+  };
+  return h({
+    type: q(e),
+    width: g,
+    height: e.height || "300",
+    dataSource: o
+  });
+}, K = (e = {}) => h({
+  type: "area2d",
+  width: g,
+  height: "550",
+  dataSource: {
+    chart: {
+      ...N({ ...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>`
+    },
+    data: e.graphData || []
+  }
+}), X = (e = {}) => {
+  const t = (e?.palettecolors || "#8ECFFF").split(",")[0].trim(), a = Array.isArray(e?.graphData) ? e.graphData : [], n = m(e?.numberPrefix), l = a?.map((i) => ({
+    ...i,
+    toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${i?.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:${t};display:inline-block'></span>${i?.label || ""}</span><b style='color:#2B2B2B'>${n}${i?.value || ""}</b></div>`
+  }));
+  return h({
+    type: "line",
+    width: e?.width || g,
+    height: e?.height || "300",
+    dataSource: {
+      chart: {
+        ...V(e),
+        xAxisName: e?.xAxisName,
+        yAxisName: e?.yAxisName,
+        labelStep: b(a.length, void 0),
+        ...e?.chartConfig || {}
+      },
+      data: l.length > 0 ? l : e?.graphData || []
+    }
+  });
+}, J = (e = {}) => {
+  let t = F();
+  e.numberPrefix === "" ? t = "" : e.numberPrefix !== null && e.numberPrefix !== void 0 && (t = e.numberPrefix);
+  const a = e.graphData, n = (a?.dataset || []).some((i) => !!i.color), l = (a?.dataset || []).map((i, s) => ({
+    ...i,
+    plotToolText: s === 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>"
+  }));
+  return h({
+    type: "mscolumn2d",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ..._(e),
+        yAxisMaxValue: e.yAxisMaxValue,
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName,
+        showLabels: e.showLabels || "1",
+        showLegend: "0",
+        legendIconSides: e.legendIconSides,
+        numberPrefix: t,
+        labelStep: b(a?.category?.length, e.labelStep),
+        ...n ? { palettecolors: void 0 } : {}
+      },
+      categories: [{ category: a?.category || [] }],
+      dataset: l
+    }
+  });
+}, Q = (e = {}) => {
+  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, n = (a?.dataset || []).some((i) => !!i.color), l = (a?.dataset || []).map((i, s) => ({
+    ...i,
+    plotToolText: s === 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>"
+  }));
+  return h({
+    type: e.hideScroll ? "stackedcolumn2d" : "scrollstackedcolumn2d",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ...T(e),
+        yAxisMaxValue: e.yAxisMaxValue,
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName,
+        legendPosition: e.legendRight ? void 0 : e.legendPosition,
+        showLegend: "0",
+        interactiveLegend: e.interactiveLegend || "1",
+        drawCrossLine: e.drawCrossLine || "1",
+        bgColor: e.bgColor || "#ffffff",
+        palettecolors: n ? void 0 : e.palettecolors || D,
+        numberPrefix: t,
+        labelStep: b(a?.category?.length, e.labelStep),
+        showSum: e.showSum ? "1" : void 0
+      },
+      categories: [
+        { category: a?.category || [] }
+      ],
+      dataset: l
+    }
+  });
+}, Y = (e = {}) => {
+  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, n = (a?.dataset || []).map((l, i) => ({
+    ...l,
+    drawCustomLegendIcon: "1",
+    legendIconSides: "4",
+    legendIconBorderThickness: "0",
+    legendIconBgAlpha: "100",
+    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;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>"
+  }));
+  return h({
+    type: "msline",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ...O(e),
+        yAxisMaxValue: e.yAxisMaxValue,
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName,
+        showLegend: "0",
+        legendPosition: e.legendRight ? void 0 : e.legendPosition,
+        numberPrefix: t,
+        chartLeftMargin: e.chartLeftMargin || "20",
+        labelStep: b(a?.category?.length, e.labelStep),
+        showValues: e.showValues === "1" ? "1" : "0"
+      },
+      categories: [{ category: a?.category || [] }],
+      dataset: n
+    }
+  });
+}, Z = (e = {}) => {
+  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, l = (e.palettecolors || z).split(",").map((o) => o.trim()), i = a?.category || [], s = a?.dataset || [], c = s.map((o, r) => {
+    const x = o.color || l[r % l.length], u = o.data || [];
+    return {
+      ...o,
+      color: x,
+      plotBorderColor: x,
+      plotBorderThickness: "2",
+      plotBorderAlpha: "100",
+      anchorBgColor: x,
+      anchorBorderColor: x,
+      showPlotBorder: "1",
+      data: u.map((C, y) => {
+        const B = i[y]?.label || "";
+        if (r > 0)
+          return {
+            ...C,
+            alpha: "60",
+            toolText: " "
+          };
+        const f = s.map((w, p) => {
+          const v = w.color || l[p % l.length], S = (w.data || [])[y]?.value ?? "", A = w.seriesname || "";
+          return `<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:${v};display:inline-block'></span>${A}</span><b style='color:#2B2B2B'>${t}${S}</b></div>`;
+        }).join("");
+        return {
+          ...C,
+          alpha: "60",
+          toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${B}</div>${f}`
+        };
+      })
+    };
+  });
+  return h({
+    type: "stackedarea2d",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ...H(e),
+        yAxisMaxValue: e.yAxisMaxValue,
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName,
+        showLegend: "0",
+        showValues: "0",
+        showToolTip: "1",
+        drawCrossLine: "1",
+        crossLineColor: "#f2f5fa",
+        numberPrefix: t,
+        labelStep: b(a?.category?.length, e.labelStep)
+      },
+      categories: [{ category: a?.category || [] }],
+      dataset: c
+    }
+  });
+}, ee = (e = {}) => {
+  const t = m(e.numberPrefix), n = (e?.palettecolors || "#8ECFFF").split(",").map((d) => d.trim()), l = n[0];
+  if (!Array.isArray(e?.graphData) && e?.graphData?.dataset) {
+    const d = e.graphData, x = d?.category || [], u = d?.dataset || [], C = u.map((y, B) => {
+      const f = y.color || n[B % n.length], w = y.data || [];
+      return {
+        ...y,
+        color: f,
+        anchorRadius: "3",
+        anchorBgColor: "#FFFFFF",
+        anchorBorderColor: f,
+        anchorBorderThickness: "1",
+        data: w.map((p, v) => {
+          const $ = x[v]?.label || "";
+          if (B > 0)
+            return { ...p, toolText: " " };
+          const S = u.map((A, M) => {
+            const j = A.color || n[M % n.length], E = (A.data || [])[v]?.value ?? "", I = A.seriesname || "";
+            return `<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:${j};display:inline-block'></span>${I}</span><b style='color:#2B2B2B'>${t}${E}</b></div>`;
+          }).join("");
+          return {
+            ...p,
+            toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${$}</div>${S}`
+          };
+        })
+      };
+    });
+    return h({
+      type: "scrollarea2d",
+      width: e?.width || g,
+      height: e?.height || "400",
+      dataSource: {
+        chart: {
+          ...k(e),
+          xAxisName: e?.xAxisName,
+          yAxisName: e?.yAxisName,
+          numberPrefix: t,
+          ...e?.chartConfig || {}
+        },
+        categories: [{ category: x }],
+        dataset: C
+      }
+    });
+  }
+  const s = Array.isArray(e?.graphData) ? e.graphData : [], c = s.map((d) => ({ label: d?.label || "" })), o = e.legendLabel || "Spend", r = s.map((d) => ({
+    value: d?.value,
+    toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${d?.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:${l};display:inline-block'></span>${o}</span><b style='color:#2B2B2B'>${t}${d?.value || ""}</b></div>`
+  }));
+  return h({
+    type: "scrollarea2d",
+    width: e?.width || g,
+    height: e?.height || "400",
+    dataSource: {
+      chart: {
+        ...k(e),
+        xAxisName: e?.xAxisName,
+        yAxisName: e?.yAxisName,
+        numberPrefix: t,
+        ...e?.chartConfig || {}
+      },
+      categories: [{ category: c }],
+      dataset: [
+        {
+          seriesname: o,
+          color: l,
+          anchorRadius: "3",
+          anchorBgColor: "#FFFFFF",
+          anchorBorderColor: l,
+          anchorBorderThickness: "1",
+          data: r
+        }
+      ]
+    }
+  });
+}, te = (e = {}) => {
+  const t = e.graphData;
+  return h({
+    type: "stackedbar2d",
+    width: g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ...R(e),
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName
+      },
+      categories: [{ category: t?.category || [] }],
+      dataset: t?.dataset || []
+    }
+  });
+}, ae = (e = {}) => {
+  const t = e.graphData;
+  return h({
+    type: "sankey",
+    width: g,
+    height: e.height || "600",
+    dataSource: {
+      chart: {
+        yAxisMaxValue: e.yAxisMaxValue,
+        theme: "fusion",
+        nodelabelposition: "start",
+        legendItemFontColor: "#2B2B2B",
+        nodeLabelFontColor: "#2B2B2B",
+        nodeLabelFont: "#2B2B2B",
+        legendItemHoverFontColor: "#0a3ca2",
+        labelFontColor: "#0a3ca2",
+        nodeLabelFontSize: 9,
+        nodeWidth: "20px",
+        nodeSpacing: "20px",
+        nodeLabelPadding: "20px",
+        legendItemFontSize: 9,
+        nodeLabelFontBold: 0.5,
+        yAxisName: e.yAxisName
+      },
+      nodes: t?.nodes || [],
+      links: t?.links || []
+    }
+  });
+}, le = (e = {}) => {
+  const a = e.graphData?.data || [], n = a.reduce((o, r) => o + (Number(r.value) || 0), 0), l = { ...e };
+  if (!l.defaultCenterLabel)
+    l.defaultCenterLabel = `Total{br}${n}`;
+  else if (l.defaultCenterLabel.includes("{br}")) {
+    const [o] = l.defaultCenterLabel.split("{br}");
+    l.defaultCenterLabel = `${o}{br}${n}`;
+  }
+  const i = l.numberPrefix ?? "$", s = (e.palettecolors || D).split(",").map((o) => o.trim()), c = a.map((o, r) => {
+    const d = Number(o.value) || 0, x = n > 0 ? (d / n * 100).toFixed(2) : "0", u = o.color || s[r % s.length];
+    return {
+      ...o,
+      displayValue: `${i}${o.value} (${x}%){br}${o.label}`,
+      toolText: `<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;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:${u};display:inline-block'></span>${o.label}</span><b style='color:#2B2B2B'>${i}${d}</b></div>`
+    };
+  });
+  return h({
+    type: "doughnut2d",
+    width: e.width || "136",
+    height: e.height || "136",
+    dataSource: {
+      chart: G(l),
+      data: c
+    }
+  });
+}, ie = (e = {}) => {
+  const t = e.graphData;
+  return h({
+    type: "multiaxisline",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: t?.chart || {},
+      categories: t?.categories || [],
+      axis: t?.axis || []
+    }
+  });
+}, oe = (e = {}) => {
+  const t = e.graphData;
+  return h({
+    type: "multilevelpie",
+    width: e.width || "550",
+    height: e.height || "350",
+    dataSource: {
+      chart: t?.data?.chart,
+      category: t?.data?.category
+    }
+  });
+}, ne = (e = {}) => {
+  let t = [], a = [];
+  if (Array.isArray(e.graphData)) {
+    const s = e.graphData;
+    t = s.map((c) => ({ label: c.label || "" })), a = [
+      {
+        seriesname: "Series 1",
+        data: s.map((c) => ({ value: c.value }))
+      }
+    ];
+  } else {
+    const s = e.graphData;
+    t = s?.category || [], a = (s?.dataset || []).map((c) => ({
+      ...c,
+      seriesname: c.seriesname || "Series",
+      data: c.data || []
+    }));
+  }
+  const n = m(e.numberPrefix), l = a.some((s) => !!s.color), i = {
+    ...N(e),
+    bgColor: e.bgColor || "#ffffff",
+    xAxisName: e.xAxisName,
+    yAxisName: e.yAxisName,
+    chartBottomMargin: e.chartBottomMargin,
+    chartLeftMargin: e.chartLeftMargin,
+    plotSpacePercent: e.plotSpacePercent ?? 60,
+    labelDisplay: e.labelDisplay,
+    useEllipsesWhenOverflow: e.useEllipsesWhenOverflow,
+    showValues: e.showValues || "0",
+    showLabels: e.showLabels || "1",
+    showLegend: "0",
+    skipOverlapLabels: "0",
+    numberPrefix: n,
+    numVDivLines: e.numVDivLines || "5",
+    palettecolors: l ? void 0 : L(e.palettecolors),
+    maxLabelHeight: e.maxLabelHeight,
+    numbersuffix: e.numbersuffix || "",
+    labelStep: b(t.length, e.labelStep),
+    numVisiblePlot: e.numVisiblePlot || "8",
+    scrollShowButtons: "0",
+    scrollColor: "#CCCCCC",
+    scrollHeight: "10",
+    flatScrollBars: "1",
+    scrollPadding: "5"
+  };
+  return h({
+    type: "scrollcolumn2d",
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: i,
+      categories: [{ category: t }],
+      dataset: a
+    }
+  });
+}, se = (e = {}) => {
+  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, n = (a?.dataset || []).some((i) => !!i.color), l = (a?.dataset || []).map((i, s) => ({
+    ...i,
+    plotToolText: s === 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>"
+  }));
+  return h({
+    type: "scrollstackedcolumn2d",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ...T(e),
+        yAxisMaxValue: e.yAxisMaxValue,
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName,
+        legendPosition: e.legendRight ? void 0 : e.legendPosition,
+        showLegend: "0",
+        interactiveLegend: e.interactiveLegend || "1",
+        drawCrossLine: e.drawCrossLine || "1",
+        bgColor: e.bgColor || "#ffffff",
+        palettecolors: n ? void 0 : e.palettecolors || D,
+        numberPrefix: t,
+        numVDivLines: e.numVDivLines || "5",
+        labelStep: b(a?.category?.length, e.labelStep),
+        showSum: e.showSum ? "1" : void 0,
+        numVisiblePlot: e.numVisiblePlot || "6",
+        scrollShowButtons: "0",
+        scrollColor: "#CCCCCC",
+        scrollHeight: "10",
+        flatScrollBars: "1",
+        scrollPadding: "5"
+      },
+      categories: [{ category: a?.category || [] }],
+      dataset: l
+    }
+  });
+}, re = (e = {}) => {
+  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, n = (a?.dataset || []).some((o) => !!o.color), l = (e.palettecolors || D).split(",").map((o) => o.trim()), i = a?.category || [], s = a?.dataset || [], c = s.map((o, r) => {
+    const d = o.color || l[r % l.length], x = o.data || [];
+    return {
+      ...o,
+      color: d,
+      data: x.map((u, C) => {
+        const y = i[C]?.label || "";
+        if (r > 0)
+          return { ...u, toolText: " " };
+        const B = s.map((f, w) => {
+          const p = f.color || l[w % l.length], $ = (f.data || [])[C]?.value ?? "", S = f.seriesname || "";
+          return `<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:${p};display:inline-block'></span>${S}</span><b style='color:#2B2B2B'>${t}${$}</b></div>`;
+        }).join("");
+        return {
+          ...u,
+          toolText: `<div style='font-size:14px;font-weight:600;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${y}</div>${B}`
+        };
+      })
+    };
+  });
+  return h({
+    type: "mscombidy2d",
+    key: e.key,
+    width: e.width || g,
+    height: e.height || "400",
+    dataSource: {
+      chart: {
+        ...W(e),
+        yAxisMaxValue: e.yAxisMaxValue,
+        xAxisName: e.xAxisName,
+        yAxisName: e.yAxisName,
+        numberPrefix: t,
+        labelStep: b(i.length, e.labelStep),
+        palettecolors: n ? void 0 : e.palettecolors || D
+      },
+      categories: [{ category: i }],
+      dataset: c
+    }
+  });
+}, ce = (e = {}) => {
+  const t = e.graphLabel ? "" : m(e.numberPrefix), a = e.graphData, n = a?.category || [], l = a?.dataset || [];
+  return h({
+    type: "scrollline2d",
+    width: e?.width || g,
+    height: e?.height || "400",
+    dataSource: {
+      chart: {
+        ...V(e),
+        xAxisName: e?.xAxisName,
+        yAxisName: e?.yAxisName,
+        numberPrefix: t,
+        palettecolors: e?.palettecolors || "#8ECFFF",
+        lineThickness: "3",
+        showLegend: "0",
+        numVisiblePlot: e?.numVisiblePlot || "12",
+        scrollShowButtons: "0",
+        scrollColor: "#CCCCCC",
+        scrollHeight: "10",
+        flatScrollBars: "1",
+        scrollPadding: "5",
+        numDivLines: "5",
+        labelStep: b(n.length, e?.labelStep),
+        ...e?.chartConfig || {}
+      },
+      categories: [{ category: n }],
+      dataset: l
+    }
+  });
+}, de = {
+  area: K,
+  bar2d: P,
+  column2d: P,
+  doughnutChart: le,
+  groupChart: J,
+  line: X,
+  msCombiDy2d: re,
+  multiAxisLineChart: ie,
+  multilevelpie: oe,
+  multipleLineChart: Y,
+  sankey: ae,
+  scrollArea: ee,
+  scrollColumn2d: ne,
+  scrollLine2d: ce,
+  scrollStackedColumn2d: se,
+  stackBarChart: te,
+  stackedArea: Z,
+  stackedcolumn2d: Q
+}, be = (e = {}) => e.chartType ? de[e.chartType]?.(e) ?? null : null;
+export {
+  be as buildChartConfig
+};

package/dist/components/FusionChart/_config/events.d.ts

@@ -0,0 +1,7 @@
+import { FusionChartProps } from '../_types/fusionChart.types';
+type ChartEvent = (event: Record<string, unknown>) => void;
+declare const withDeferredHandler: (handler: ChartEvent, delay?: number) => (event: Record<string, unknown>) => NodeJS.Timeout;
+export declare const getChartEvents: (props?: Partial<FusionChartProps>) => Record<string, ChartEvent | ReturnType<typeof withDeferredHandler>> | undefined;
+export declare const getOnRender: (props?: Partial<FusionChartProps>) => ((chart: unknown) => void) | undefined;
+export {};
+//# sourceMappingURL=events.d.ts.map

package/dist/components/FusionChart/_config/events.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../../../../lib/components/FusionChart/_config/events.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAEpE,KAAK,UAAU,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;AAE3D,QAAA,MAAM,mBAAmB,GACtB,SAAS,UAAU,EAAE,cAAS,MAC9B,OAAO,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,mBACU,CAAC;AAE5C,eAAO,MAAM,cAAc,GACzB,QAAO,OAAO,CAAC,gBAAgB,CAAM,KACpC,MAAM,CAAC,MAAM,EAAE,UAAU,GAAG,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC,GAAG,SAiCxE,CAAC;AAEF,eAAO,MAAM,WAAW,GACtB,QAAO,OAAO,CAAC,gBAAgB,CAAM,KACpC,CAAC,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC,GAAG,SAS/B,CAAC"}

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

@@ -0,0 +1,40 @@
+import { adjustDoughnutLabels as l } from "../_helpers/doughnutHelper.js";
+import { adjustMultiAxisValueLabels as n } from "../_helpers/multiAxisHelper.js";
+import { adjustMultiLineValueLabels as i } from "../_helpers/multiLineHelper.js";
+const r = (e, t = 0) => (a) => setTimeout(() => e(a), t), c = (e = {}) => {
+  const {
+    chartType: t,
+    manageDoughnutLabels: a,
+    manageMultiAxisLineLabels: u = !1,
+    manageMultiLineLabels: o = !1
+  } = e;
+  if (t === "doughnutChart" && a)
+    return {
+      renderComplete: l,
+      legendItemClicked: r(l),
+      dataPlotClick: r(l),
+      dataPlotRollOver: r(l, 50),
+      dataPlotRollOut: r(l, 50)
+    };
+  if (t === "multipleLineChart" && o)
+    return {
+      renderComplete: i,
+      legendItemClicked: r(i, 50)
+    };
+  if (t === "multiAxisLineChart" && u)
+    return {
+      renderComplete: n,
+      legendItemClicked: r(n, 50)
+    };
+}, f = (e = {}) => {
+  if (e.chartType !== "groupChart" || !e.chartRef)
+    return;
+  const t = e.chartRef;
+  return (a) => {
+    t.current = a;
+  };
+};
+export {
+  c as getChartEvents,
+  f as getOnRender
+};