@ck-ui/component-library 2.0.3 → 2.0.5

package/dist/components/DeviationTag/index.js

@@ -1,21 +1,21 @@
 import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import { SMALL as v, LARGE as x } from "../../constants.js";
+import { SMALL as l, LARGE as f } from "../../constants.js";
 import { mergeClasses as e } from "../../utils/mergeClasses.js";
-import '../../assets/index-BgFw4AMY.css';const b = "_small_18bux_26", f = "_medium_18bux_30", k = "_large_18bux_34", y = "_deviation_18bux_39", h = "_positive_18bux_45", N = "_negative_18bux_49", C = "_arrow_18bux_54", r = {
-  "ckds-deviation-tag": "_ckds-deviation-tag_18bux_1",
-  small: b,
-  medium: f,
-  large: k,
-  deviation: y,
-  positive: h,
-  negative: N,
+import '../../assets/index-DVtITeZI.css';const v = "_small_babrf_26", k = "_medium_babrf_30", y = "_large_babrf_34", h = "_deviation_babrf_39", N = "_positive_babrf_45", x = "_negative_babrf_49", C = "_arrow_babrf_54", r = {
+  "ckds-deviation-tag": "_ckds-deviation-tag_babrf_1",
+  small: v,
+  medium: k,
+  large: y,
+  deviation: h,
+  positive: N,
+  negative: x,
   arrow: C,
-  "arrow-up": "_arrow-up_18bux_60",
-  "arrow-down": "_arrow-down_18bux_67",
-  "arrow-up-green": "_arrow-up-green_18bux_74",
-  "arrow-up-red": "_arrow-up-red_18bux_78",
-  "arrow-down-green": "_arrow-down-green_18bux_82",
-  "arrow-down-red": "_arrow-down-red_18bux_86"
+  "arrow-up": "_arrow-up_babrf_60",
+  "arrow-down": "_arrow-down_babrf_67",
+  "arrow-up-green": "_arrow-up-green_babrf_74",
+  "arrow-up-red": "_arrow-up-red_babrf_78",
+  "arrow-down-green": "_arrow-down-green_babrf_82",
+  "arrow-down-red": "_arrow-down-red_babrf_86"
 };
 function T({
   price: i,
@@ -24,11 +24,11 @@ function T({
   arrowDirection: n = "up",
   arrowColor: o = "green",
   wrapperClassName: d = "",
-  priceClassName: u = "",
+  priceClassName: b = "",
   deviationClassName: g = "",
   ...w
 }) {
-  const c = n === "up" ? r["arrow-up"] : r["arrow-down"], p = o === "green" ? r.positive : r.negative, m = () => a === v ? "ckds-cap-reg" : a === x ? "ckds-body-lg-reg" : "ckds-body-sm-reg", l = () => n === "up" ? o === "green" ? "arrow-up-green" : "arrow-up-red" : o === "green" ? "arrow-down-green" : "arrow-down-red";
+  const c = n === "up" ? r["arrow-up"] : r["arrow-down"], p = o === "green" ? r.positive : r.negative, m = () => a === l ? "ckds-cap-reg" : a === f ? "ckds-body-lg-reg" : "ckds-body-sm-reg", u = () => n === "up" ? o === "green" ? "arrow-up-green" : "arrow-up-red" : o === "green" ? "arrow-down-green" : "arrow-down-red";
   return /* @__PURE__ */ s(
     "div",
     {
@@ -40,7 +40,7 @@ function T({
       ),
       ...w,
       children: [
-        /* @__PURE__ */ t("span", { className: e(r.price, u), children: i }),
+        /* @__PURE__ */ t("span", { className: e(r.price, b), children: i }),
         /* @__PURE__ */ s(
           "span",
           {
@@ -56,7 +56,7 @@ function T({
                   className: e(
                     r.arrow,
                     c,
-                    r[l()]
+                    r[u()]
                   )
                 }
               ),

package/dist/components/EmptyState/index.js

@@ -1,9 +1,9 @@
 import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import '../../assets/index-BbJZjGLb.css';const n = {
-  "ckds-empty-state": "_ckds-empty-state_19zpm_1",
-  "ckds-empty-state-container": "_ckds-empty-state-container_19zpm_27",
-  "ckds-empty-state-heading": "_ckds-empty-state-heading_19zpm_39",
-  "ckds-empty-state-content": "_ckds-empty-state-content_19zpm_47"
+import '../../assets/index-CV06CpqV.css';const n = {
+  "ckds-empty-state": "_ckds-empty-state_eymjf_1",
+  "ckds-empty-state-container": "_ckds-empty-state-container_eymjf_27",
+  "ckds-empty-state-heading": "_ckds-empty-state-heading_eymjf_39",
+  "ckds-empty-state-content": "_ckds-empty-state-content_eymjf_47"
 };
 function i({
   icon: a,

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

@@ -1 +1 @@
-{"version":3,"file":"builders.d.ts","sourceRoot":"","sources":["../../../../lib/components/FusionChart/_config/builders.ts"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAk/BpE,eAAO,MAAM,gBAAgB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;QACD,CAAC"}
+{"version":3,"file":"builders.d.ts","sourceRoot":"","sources":["../../../../lib/components/FusionChart/_config/builders.ts"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAgoCpE,eAAO,MAAM,gBAAgB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;QACC,CAAC"}

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

@@ -2,16 +2,18 @@ import { EXTENDED_PALETTE as $, DEFAULT_WIDTH as m, STACKED_AREA_PALETTE as I }
 import { getBaseConfig as b, getStackedColumnChartShell as F, getStackedAreaChartShell as H, getStackedBarChartShell as O, getLineChartShell as j, getCommonChartShell as N, getScrollAreaChartShell as V, getMultipleLineChartShell as R, getMsCombiDy2dChartShell as W, getGroupChartShell as Y, getDoughnutChartShell as _ } from "./helpers.js";
 import { getCurrencyPrefix as y, getLabelStep as p, getCartesianPalette as L, getCurrencySymbol as E, formatLargeNumber as A, getBarType as M, getGraphDataLength as G } from "../_utils/chartHelpers.js";
 const z = (e = {}) => {
-  const t = e.plotSpacePercent ?? (e.plotSpacePercent === 0 ? e.plotSpacePercent : 60), l = Array.isArray(e.graphData) ? e.graphData : [], d = l.some((r) => !!r.color), a = L(e?.palettecolors)?.split(",")?.map((r) => r?.trim());
+  const t = e.plotSpacePercent ?? (e.plotSpacePercent === 0 ? e.plotSpacePercent : 60), l = Array.isArray(e.graphData) ? e.graphData : [], d = l.some(
+    (r) => !!r.color
+  ), a = L(e?.palettecolors)?.split(",")?.map((r) => r?.trim());
   if (e.usePerBarColors && !Array.isArray(e.graphData)) {
     const r = e.graphData, o = r?.category || [], g = r?.dataset || [];
     if (g.length === 1) {
       const f = (g[0].data || []).map((u, v) => {
-        const C = u.color || a[v % a.length], T = o[v]?.label || "";
+        const T = u.color || a[v % a.length], C = o[v]?.label || "";
         return {
           ...u,
-          color: C,
-          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)}${u.value || ""}</b></div>`
+          color: T,
+          toolText: e.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:8px;border-bottom:1px solid #eee;margin-bottom:8px'>${C}</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:${T};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;'>${y(e.numberPrefix)}${u.value || ""}</b></div>`
         };
       }), x = {
         ...N(e),
@@ -39,16 +41,18 @@ const z = (e = {}) => {
       });
     }
   }
-  const i = l?.map((r, o) => {
-    const g = r?.color || a[o % a.length];
-    let h;
-    return r.toolText ? h = r.toolText : e.plotToolText ? h = e.plotToolText : h = `<div style='font-size: 10px;font-weight:500;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;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:${g};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${r.label || ""}</label></span><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${y(e.numberPrefix)}${r.value || ""}</b></div>`, {
-      ...r,
-      color: g,
-      toolText: h
-      // 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>`
-    };
-  }), n = {
+  const i = l?.map(
+    (r, o) => {
+      const g = r?.color || a[o % a.length];
+      let h;
+      return r.toolText ? h = r.toolText : e.plotToolText ? h = e.plotToolText : h = `<div style='font-size: 10px;font-weight:500;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;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:${g};display:inline-block;flex-shrink:0'></span><label style='display:inline-block;width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#737373;'>${r.label || ""}</label></span><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${y(e.numberPrefix)}${r.value || ""}</b></div>`, {
+        ...r,
+        color: g,
+        toolText: h
+        // 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>`
+      };
+    }
+  ), n = {
     ...N(e),
     bgColor: e.bgColor || "#ffffff",
     labelStep: p(G(e), e.labelStep),
@@ -67,7 +71,10 @@ const z = (e = {}) => {
     palettecolors: d ? void 0 : L(e.palettecolors),
     maxLabelHeight: e.maxLabelHeight,
     numbersuffix: e.numbersuffix || ""
-  }, s = e.graphData, c = e?.hideScroll ? { chart: n, data: i?.length > 0 ? i : e?.graphData || [] } : {
+  }, s = e.graphData, c = e?.hideScroll ? {
+    chart: n,
+    data: i?.length > 0 ? i : e?.graphData || []
+  } : {
     chart: n,
     categories: s?.categories,
     dataset: s?.dataset
@@ -117,7 +124,9 @@ const z = (e = {}) => {
 }, X = (e = {}) => {
   let t = E();
   e.numberPrefix === "" ? t = "" : e.numberPrefix !== null && e.numberPrefix !== void 0 && (t = e.numberPrefix);
-  const l = e.graphData, d = (l?.dataset || []).some((i) => !!i.color), a = (l?.dataset || []).map((i, n) => {
+  const l = e.graphData, d = (l?.dataset || []).some(
+    (i) => !!i.color
+  ), a = (l?.dataset || []).map((i, n) => {
     const c = i.data?.map((r) => {
       const o = r.value;
       return o == null || Number(o) === 0 || typeof o == "string" && o.trim() === "" ? { ...r, value: 0 } : r;
@@ -155,7 +164,9 @@ const z = (e = {}) => {
     }
   });
 }, q = (e = {}) => {
-  const t = e.graphLabel ? "" : y(e.numberPrefix), l = e.graphData, d = (l?.dataset || []).some((n) => !!n.color), a = "<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>", i = (l?.dataset || []).map((n, s) => ({
+  const t = e.graphLabel ? "" : y(e.numberPrefix), l = e.graphData, d = (l?.dataset || []).some(
+    (n) => !!n.color
+  ), a = "<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>", i = (l?.dataset || []).map((n, s) => ({
     ...n,
     // plotToolText: props.plotToolText || (plotToolText: props.plotToolText || (
     //   index === 0
@@ -187,9 +198,7 @@ const z = (e = {}) => {
         labelStep: p(l?.category?.length, e.labelStep),
         showSum: e.showSum ? "1" : void 0
       },
-      categories: [
-        { category: l?.category || [] }
-      ],
+      categories: [{ category: l?.category || [] }],
       dataset: i
     }
   });
@@ -251,9 +260,9 @@ const z = (e = {}) => {
             alpha: "60",
             toolText: " "
           };
-        const u = n.map((v, C) => {
-          const T = v.color || a[C % a.length], B = (v.data || [])[f]?.value ?? "", S = v.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:#737373;'><span style='width:10px;height:10px;border-radius:2px;background-color:${T};display:inline-block'></span>${S}</span><b style='color:#2B2B2B;font-weight:500;font-size:10px;'>${t}${B}</b></div>`;
+        const u = n.map((v, T) => {
+          const C = v.color || a[T % a.length], B = (v.data || [])[f]?.value ?? "", S = v.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:#737373;'><span style='width:10px;height:10px;border-radius:2px;background-color:${C};display:inline-block'></span>${S}</span><b style='color:#2B2B2B;font-weight:500;font-size:10px;'>${t}${B}</b></div>`;
         }).join("");
         return {
           ...w,
@@ -300,17 +309,17 @@ const z = (e = {}) => {
         anchorBorderColor: u,
         anchorBorderThickness: "1",
         ...e.plotToolText ? { plotToolText: e.plotToolText } : {},
-        data: v.map((C, T) => {
-          const D = g[T]?.label || "";
+        data: v.map((T, C) => {
+          const D = g[C]?.label || "";
           if (e.plotToolText)
-            return { ...C };
-          const B = h[x]?.seriesname || "", S = (h[x]?.data || [])[T]?.value ?? "", k = f.color || d[x % d.length], P = `<div class='scroll-area-tooltip-row' data-series-index='${x}' 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}${S}</b></div>`;
+            return { ...T };
+          const B = h[x]?.seriesname || "", S = (h[x]?.data || [])[C]?.value ?? "", k = f.color || d[x % d.length], P = `<div class='scroll-area-tooltip-row' data-series-index='${x}' 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}${S}</b></div>`;
           return x === 0 ? {
-            ...C,
+            ...T,
             // 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}`,
             toolText: `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${D}</div>${P}`
           } : {
-            ...C,
+            ...T,
             toolText: P
           };
         })
@@ -333,7 +342,9 @@ const z = (e = {}) => {
       }
     });
   }
-  const n = Array.isArray(e?.graphData) ? e.graphData : [], s = n.map((o) => ({ label: o?.label || "" })), c = e.legendLabel || "Spend", r = n.map((o) => ({
+  const n = Array.isArray(e?.graphData) ? e.graphData : [], s = n.map((o) => ({
+    label: o?.label || ""
+  })), c = e.legendLabel || "Spend", r = n.map((o) => ({
     value: o?.value,
     // 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>`,
     toolText: e?.plotToolText || `<div style='font-size: 10px;font-weight:500;color:#2B2B2B;padding-bottom:4px;border-bottom:1px solid #eee;margin-bottom:4px'>${o?.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:${a};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}${o?.value || ""}</b></div>`
@@ -414,7 +425,10 @@ const z = (e = {}) => {
     }
   });
 }, ae = (e = {}) => {
-  const l = e.graphData?.data || [], d = l.reduce((o, g) => o + (Number(g.value) || 0), 0), a = Math.round(d * 100) / 100, i = e.numberPrefix ?? "$", n = { ...e }, s = e?.formatLargeAmount;
+  const l = e.graphData?.data || [], d = l.reduce(
+    (o, g) => o + (Number(g.value) || 0),
+    0
+  ), a = Math.round(d * 100) / 100, i = e.numberPrefix ?? "$", n = { ...e }, s = e?.formatLargeAmount;
   if (!n.defaultCenterLabel)
     n.defaultCenterLabel = s ? `Total{br}${A(a, i)}` : `Total{br}${i}${a}`;
   else if (n.defaultCenterLabel.includes("{br}")) {
@@ -424,7 +438,13 @@ const z = (e = {}) => {
   const c = (e.palettecolors || $).split(",").map((o) => o.trim()), r = l.map((o, g) => {
     const h = Number(o.value) || 0, w = a > 0 ? (h / a * 100).toFixed(2) : "0", f = o.color || c[g % c.length];
     let x;
-    return o.toolText ? x = o.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'>${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;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:${f};display:inline-block;margin-right:5px;color:#AAAAAA;'></span>${o.label}</label><b style='text-align:right;color:#2b2b2b;font-weight:500;font-size:10px;'>${s ? A(h, i) : i + "" + h}</b></div>`, x = x.replace(/\$plotFillColor/g, f).replace(/\$color/g, f).replace(/\$label/g, o.label || "").replace(/\$value/g, String(o.value ?? "")).replace(/\$dataValue/g, s ? A(h, i) : `${i}${h}`).replace(/\$percentValue/g, w).replace(/\$unformattedSum/g, String(a)).replace(/\$sum/g, s ? A(a, i) : `${i}${a}`), {
+    return o.toolText ? x = o.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'>${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;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:${f};display:inline-block;margin-right:5px;color:#AAAAAA;'></span>${o.label}</label><b style='text-align:right;color:#2b2b2b;font-weight:500;font-size:10px;'>${s ? A(h, i) : i + "" + h}</b></div>`, x = x.replace(/\$plotFillColor/g, f).replace(/\$color/g, f).replace(/\$label/g, o.label || "").replace(/\$value/g, String(o.value ?? "")).replace(
+      /\$dataValue/g,
+      s ? A(h, i) : `${i}${h}`
+    ).replace(/\$percentValue/g, w).replace(/\$unformattedSum/g, String(a)).replace(
+      /\$sum/g,
+      s ? A(a, i) : `${i}${a}`
+    ), {
       ...o,
       color: f,
       displayValue: `${s ? A(h, i) : i + "" + o.value} (${w}%){br}${o.label}`,
@@ -448,7 +468,10 @@ const z = (e = {}) => {
     width: e.width || m,
     height: e.height || "400",
     dataSource: {
-      chart: { ...t?.chart || {}, ...e.plotToolText ? { plotToolText: e.plotToolText } : {} },
+      chart: {
+        ...t?.chart || {},
+        ...e.plotToolText ? { plotToolText: e.plotToolText } : {}
+      },
       categories: t?.categories || [],
       axis: t?.axis || []
     }
@@ -460,7 +483,10 @@ const z = (e = {}) => {
     width: e.width || "550",
     height: e.height || "350",
     dataSource: {
-      chart: { ...t?.data?.chart || {}, ...e.plotToolText ? { plotToolText: e.plotToolText } : {} },
+      chart: {
+        ...t?.data?.chart || {},
+        ...e.plotToolText ? { plotToolText: e.plotToolText } : {}
+      },
       category: t?.data?.category
     }
   });
@@ -468,7 +494,9 @@ const z = (e = {}) => {
   let t = [], l = [];
   if (Array.isArray(e.graphData)) {
     const n = e.graphData;
-    t = n.map((s) => ({ label: s.label || "" })), l = [
+    t = n.map((s) => ({
+      label: s.label || ""
+    })), l = [
       {
         seriesname: "Series 1",
         data: n.map((s) => ({ value: s.value }))
@@ -482,7 +510,9 @@ const z = (e = {}) => {
       data: s.data || []
     }));
   }
-  const d = y(e.numberPrefix), a = l.some((n) => !!n.color), i = {
+  const d = y(e.numberPrefix), a = l.some(
+    (n) => !!n.color
+  ), i = {
     ...N(e),
     bgColor: e.bgColor || "#ffffff",
     xAxisName: e.xAxisName,
@@ -504,7 +534,7 @@ const z = (e = {}) => {
     labelStep: p(t.length, e.labelStep),
     numVisiblePlot: e.numVisiblePlot || "8",
     scrollShowButtons: "0",
-    scrollColor: "#CCCCCC",
+    scrollColor: "#9c9898",
     scrollHeight: "10",
     flatScrollBars: "1",
     scrollPadding: "5",
@@ -521,7 +551,9 @@ const z = (e = {}) => {
     }
   });
 }, ne = (e = {}) => {
-  const t = e.graphLabel ? "" : y(e.numberPrefix), l = e.graphData, d = (l?.dataset || []).some((n) => !!n.color), a = "<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>", i = (l?.dataset || []).map((n, s) => ({
+  const t = e.graphLabel ? "" : y(e.numberPrefix), l = e.graphData, d = (l?.dataset || []).some(
+    (n) => !!n.color
+  ), a = "<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>", i = (l?.dataset || []).map((n, s) => ({
     ...n,
     // plotToolText: props.plotToolText || (
     //   index === 0
@@ -552,7 +584,7 @@ const z = (e = {}) => {
         showSum: e.showSum ? "1" : void 0,
         numVisiblePlot: e.numVisiblePlot || "6",
         scrollShowButtons: "0",
-        scrollColor: "#CCCCCC",
+        scrollColor: "#9c9898",
         scrollHeight: "10",
         flatScrollBars: "1",
         scrollPadding: "5"
@@ -575,8 +607,8 @@ const z = (e = {}) => {
         if (r > 0)
           return { ...h, toolText: " " };
         const x = n.map((u, v) => {
-          const C = u.color || a[v % a.length], D = (u.data || [])[w]?.value ?? "", B = u.seriesname || "", S = u.tooltipPrefix !== void 0 ? u.tooltipPrefix : t, k = u.renderAs || "column";
-          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;'>${S}${D}</b></div>`;
+          const T = u.color || a[v % a.length], D = (u.data || [])[w]?.value ?? "", B = u.seriesname || "", S = u.tooltipPrefix !== void 0 ? u.tooltipPrefix : t, k = u.renderAs || "column";
+          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:${T};display:inline-block;margin-right:5px;'></span>${B}</label><b style='text-align:right;color:#2B2B2B;font-weight:500;font-size:10px;'>${S}${D}</b></div>`;
         }).join("");
         return {
           ...h,
@@ -624,7 +656,7 @@ const z = (e = {}) => {
         showLegend: "0",
         numVisiblePlot: e?.numVisiblePlot || "12",
         scrollShowButtons: "0",
-        scrollColor: "#CCCCCC",
+        scrollColor: "#9c9898",
         scrollHeight: "10",
         flatScrollBars: "1",
         scrollPadding: "5",

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

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../lib/components/FusionChart/_config/helpers.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAKpE,eAAO,MAAM,cAAc,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;CAQlE,CAAC;AAEH,eAAO,MAAM,eAAe,GAC1B,OAAO,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAatC,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,2CAM3B;IACD,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;;;;;;;CAOC,CAAC;AAEH,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;CAwBlC,CAAC;AAEH,eAAO,MAAM,mBAAmB,GAAI,+DAKjC,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAS/B,CAAC;AAEH,eAAO,MAAM,0BAA0B,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAoC7E,CAAC;AAEJ,eAAO,MAAM,kBAAkB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BA4CrE,CAAC;AAEJ,eAAO,MAAM,iBAAiB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwBrE,CAAC;AAEH,eAAO,MAAM,yBAAyB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BA0C5E,CAAC;AAEJ,eAAO,MAAM,uBAAuB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoB3E,CAAC;AAEH,eAAO,MAAM,wBAAwB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAkE3E,CAAC;AAEJ,eAAO,MAAM,uBAAuB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyD3E,CAAC;AAEH,eAAO,MAAM,wBAAwB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAsD3E,CAAC;AAEJ,eAAO,MAAM,qBAAqB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiDzE,CAAC"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../lib/components/FusionChart/_config/helpers.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAGpE,eAAO,MAAM,cAAc,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;CAQlE,CAAC;AAEH,eAAO,MAAM,eAAe,GAC1B,OAAO,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAatC,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,2CAM3B;IACD,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;;;;;;;CAOC,CAAC;AAEH,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;CAwBlC,CAAC;AAEH,eAAO,MAAM,mBAAmB,GAAI,+DAKjC,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAS/B,CAAC;AAEH,eAAO,MAAM,0BAA0B,GACrC,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAuCpC,CAAC;AAEJ,eAAO,MAAM,kBAAkB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BA8CrE,CAAC;AAEJ,eAAO,MAAM,iBAAiB,GAAI,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsBrE,CAAC;AAEH,eAAO,MAAM,yBAAyB,GACpC,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BA6CpC,CAAC;AAEJ,eAAO,MAAM,uBAAuB,GAClC,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqBrC,CAAC;AAEH,eAAO,MAAM,wBAAwB,GACnC,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAmEpC,CAAC;AAEJ,eAAO,MAAM,uBAAuB,GAClC,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0DrC,CAAC;AAEH,eAAO,MAAM,wBAAwB,GACnC,QAAO,OAAO,CAAC,gBAAgB,CAAM,4BAuDpC,CAAC;AAEJ,eAAO,MAAM,qBAAqB,GAChC,QAAO,OAAO,CAAC,gBAAgB,CAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkDrC,CAAC"}

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

@@ -1,12 +1,12 @@
-import { LEGEND_HOVER_FONT_COLOR as C, LEGEND_FONT_COLOR as m, DEFAULT_WIDTH as F, LABEL_FONT_COLOR as o, AXIS_NAME_FONT_COLOR as l, AXIS_LINE_COLOR as L, LABEL_STEP_DEFAULT as d, DEFAULT_PALETTE as g, PERCENT_TOOLTIP as f, VALUE_TOOLTIP as A, SERIES_TOOLTIP as b, EXTENDED_PALETTE as a, DIV_LINE_COLOR as c, CROSS_LINE_COLOR as S } from "../_constant/constants.js";
+import { LEGEND_HOVER_FONT_COLOR as m, LEGEND_FONT_COLOR as C, DEFAULT_WIDTH as F, LABEL_FONT_COLOR as o, AXIS_NAME_FONT_COLOR as l, AXIS_LINE_COLOR as L, LABEL_STEP_DEFAULT as d, DEFAULT_PALETTE as g, PERCENT_TOOLTIP as f, VALUE_TOOLTIP as A, SERIES_TOOLTIP as b, EXTENDED_PALETTE as a, DIV_LINE_COLOR as c, CROSS_LINE_COLOR as S } from "../_constant/constants.js";
 import { getCurrencySymbol as i } from "../_utils/chartHelpers.js";
 const s = (e = {}) => ({
   legendItemFontSize: 10,
   legendIconScale: ".96",
   legendBgAlpha: 20,
   legendItemFontBold: 0,
-  legendItemFontColor: e?.legendItemFontColor || m,
-  legendItemHoverFontColor: C,
+  legendItemFontColor: e?.legendItemFontColor || C,
+  legendItemHoverFontColor: m,
   legendItemFont: e?.legendItemFont || "Inter"
 }), r = (e, t = {}) => t.legendRight ? {
   ...e,
@@ -343,7 +343,7 @@ const s = (e = {}) => ({
   // Scroll-specific properties
   numVisiblePlot: e.numVisiblePlot || "8",
   scrollShowButtons: "0",
-  scrollColor: "#CCCCCC",
+  scrollColor: "#9c9898",
   scrollHeight: "10",
   flatScrollBars: "1",
   scrollPadding: "5",
@@ -433,7 +433,7 @@ const s = (e = {}) => ({
   plotBorderThickness: "3",
   plotBorderColor: "#ffffff",
   chartLeftMargin: "10",
-  chartTopMargin: "10",
+  chartTopMargin: "-20",
   chartRightMargin: "10",
   chartBottomMargin: "10",
   pieRadius: e.pieRadius ?? 100,

package/dist/components/FusionChart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/FusionChart/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,4BAA4B,CAAC;AAGpC,YAAY,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAmUnE,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,kDAsTlD;yBAtTe,WAAW"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/FusionChart/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,4BAA4B,CAAC;AAGpC,YAAY,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AA8UnE,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,kDAoWlD;yBApWe,WAAW"}