@undp/data-viz 2.5.4 → 2.6.1

package/dist/UnitChart.js

@@ -1,166 +1,149 @@
-import { c as Pt, j as r } from "./index-CHPV5EwG-BzibaIRc.js";
-import { useRef as Ct } from "react";
-import { s as Rt } from "./index-CeVNqhMO.js";
-import { _ as Bt, E as Ot } from "./Typography-BO0gQDIT.js";
-import { GraphFooter as qt } from "./GraphFooter.js";
-import { GraphHeader as Ut } from "./GraphHeader.js";
-import { Colors as Jt } from "./Colors.js";
-import { n as Kt } from "./numberFormattingFunction-BUUV_luR.js";
-import { G as Qt, a as Xt } from "./GraphContainer-B8ZqOzKI.js";
-import { m as Yt } from "./proxy-BsxtcZKa.js";
-import { u as _t } from "./use-in-view-KOXq5Kmc.js";
-import { A as te } from "./index-Cv_5q6Rb.js";
-function we(l) {
-  const t = Pt.c(137), {
-    data: a,
-    size: jt,
-    graphTitle: w,
-    sources: rt,
-    colors: kt,
-    graphDescription: y,
-    totalNoOfDots: Dt,
-    unitPadding: bt,
-    gridSize: Nt,
-    footNote: at,
-    padding: ft,
-    backgroundColor: zt,
-    graphID: mt,
-    graphDownload: St,
-    language: $t,
-    showColorScale: Ht,
-    showStrokeForWhiteDots: Lt,
-    note: C,
-    dataDownload: Mt,
-    theme: Vt,
-    width: e,
-    height: x,
-    minHeight: Ft,
-    relativeHeight: s,
-    ariaLabel: ut,
-    styles: i,
-    classNames: n,
-    animate: Gt,
-    naLabel: It,
-    numberDisplayOptions: o
-  } = l, Y = jt === void 0 ? 200 : jt, j = kt === void 0 ? Jt.light.categoricalColors.colors : kt, _ = Dt === void 0 ? 100 : Dt, Zt = bt === void 0 ? 3 : bt, v = Nt === void 0 ? 10 : Nt, ht = zt === void 0 ? !1 : zt, k = St === void 0 ? !1 : St, gt = $t === void 0 ? "en" : $t, tt = Ht === void 0 ? !0 : Ht, et = Lt === void 0 ? !0 : Lt, ot = Mt === void 0 ? !1 : Mt, xt = Vt === void 0 ? "light" : Vt, c = Ft === void 0 ? 0 : Ft, lt = Gt === void 0 ? !1 : Gt, it = It === void 0 ? "NA" : It, Tt = Ct(null);
-  let nt;
-  t[0] !== lt ? (nt = lt === !0 ? {
-    duration: 0.5,
-    once: !0,
-    amount: 0.5
-  } : lt || {
-    duration: 0,
-    once: !0,
-    amount: 0
-  }, t[0] = lt, t[1] = nt) : nt = t[1];
-  const f = nt;
-  let st;
-  t[2] !== f.amount || t[3] !== f.once ? (st = {
-    once: f.once,
-    amount: f.amount
-  }, t[2] = f.amount, t[3] = f.once, t[4] = st) : st = t[4];
-  const vt = _t(Tt, st);
-  let ct;
-  t[5] !== a ? (ct = Rt(a.map(le)), t[5] = a, t[6] = ct) : ct = t[6];
-  const wt = ct, Wt = Ct(null), At = Ct(null), d = Y / v, D = (d - Zt * 2) / 2;
-  if (D <= 0)
-    return console.error("The size of single unit is less than or equal to zero. Check values for ((dimension / gridSize) - (padding * 2)) / 2 is not less than or equal to 0."), null;
-  let b, N, z, S, $, H, L, M, V, F, G, I, T, W, Z, A, E, P, R, B, O, q, u, h, g, U;
-  if (t[7] !== f.duration || t[8] !== ut || t[9] !== ht || t[10] !== n?.description || t[11] !== n?.graphContainer || t[12] !== n?.title || t[13] !== j || t[14] !== a || t[15] !== ot || t[16] !== y || t[17] !== k || t[18] !== mt || t[19] !== w || t[20] !== d || t[21] !== v || t[22] !== x || t[23] !== vt || t[24] !== gt || t[25] !== c || t[26] !== it || t[27] !== C || t[28] !== o?.locale || t[29] !== o?.padZeros || t[30] !== o?.precision || t[31] !== o?.prefix || t[32] !== o?.suffix || t[33] !== ft || t[34] !== D || t[35] !== s || t[36] !== tt || t[37] !== et || t[38] !== Y || t[39] !== i?.description || t[40] !== i?.graphContainer || t[41] !== i?.title || t[42] !== xt || t[43] !== _ || t[44] !== wt || t[45] !== e) {
-    const yt = [];
-    a.forEach((p, m) => {
-      const Et = Math.round(p.value / wt * _);
-      for (let pt = 0; pt < Et; pt = pt + 1, pt)
-        yt.push({
-          color: j[m]
-        });
-    }), z = Qt, F = n?.graphContainer, G = i?.graphContainer, I = mt, T = Wt, W = ut, Z = ht, A = xt, E = gt, P = c, R = e, B = x, O = s, q = ft, t[72] !== n?.description || t[73] !== n?.title || t[74] !== a || t[75] !== ot || t[76] !== y || t[77] !== k || t[78] !== w || t[79] !== i?.description || t[80] !== i?.title || t[81] !== e ? (u = w || y || k ? /* @__PURE__ */ r.jsx(Ut, { styles: {
-      title: i?.title,
-      description: i?.description
-    }, classNames: {
-      title: n?.title,
-      description: n?.description
-    }, graphTitle: w, graphDescription: y, width: e, graphDownload: k ? Wt : void 0, dataDownload: ot ? a.map(ae).filter(re).length > 0 ? a.map(ie).filter(oe) : a.filter(ee) : null }) : null, t[72] = n?.description, t[73] = n?.title, t[74] = a, t[75] = ot, t[76] = y, t[77] = k, t[78] = w, t[79] = i?.description, t[80] = i?.title, t[81] = e, t[82] = u) : u = t[82], t[83] !== C || t[84] !== e ? (h = C ? /* @__PURE__ */ r.jsx(Ot, { marginBottom: "2xs", className: "text-primary-gray-700 dark:text-primary-gray-100 font-bold", style: {
-      width: e ? `${e}px` : "100%"
-    }, children: C }) : null, t[83] = C, t[84] = e, t[85] = h) : h = t[85], t[86] !== j || t[87] !== a || t[88] !== it || t[89] !== o?.locale || t[90] !== o?.padZeros || t[91] !== o?.precision || t[92] !== o?.prefix || t[93] !== o?.suffix || t[94] !== tt || t[95] !== e ? (g = tt ? /* @__PURE__ */ r.jsx("div", { className: "mb-4 leading-0", style: {
-      width: e ? `${e}px` : "100%"
-    }, "aria-label": "Color legend", children: /* @__PURE__ */ r.jsx("div", { className: "flex mb-0 flex-wrap gap-x-4 gap-y-1", children: a.map((p, m) => /* @__PURE__ */ r.jsxs("div", { className: "flex gap-2 items-center", children: [
-      /* @__PURE__ */ r.jsx("div", { className: "w-3 h-3 rounded-full", style: {
-        backgroundColor: j[m]
-      } }),
-      /* @__PURE__ */ r.jsxs(Bt, { marginBottom: "none", size: "sm", className: "text-primary-gray-700 dark:text-primary-gray-100", children: [
-        p.label,
-        ":",
-        " ",
-        /* @__PURE__ */ r.jsx("span", { className: "font-bold", children: Kt(p.value, it, o?.precision ?? 2, o?.prefix, o?.suffix, o?.locale || "en", o?.padZeros || !1) })
-      ] })
-    ] }, m)) }) }) : null, t[86] = j, t[87] = a, t[88] = it, t[89] = o?.locale, t[90] = o?.padZeros, t[91] = o?.precision, t[92] = o?.prefix, t[93] = o?.suffix, t[94] = tt, t[95] = e, t[96] = g) : g = t[96], N = Xt, V = At, S = `${e || Y}px`, $ = `${Math.max(c, x ? s && e ? c ? e * s > c ? e * s : c : e * s : x : Math.floor((_ - 1) / v) * d + d / 2 + D + 5)}px`, H = Tt, L = "ltr", M = `0 0 ${e || Y} ${Math.max(c, x ? s && e ? c ? e * s > c ? e * s : c : e * s : x : Math.floor((_ - 1) / v) * d + d / 2 + D + 5)}`, b = te, U = /* @__PURE__ */ r.jsx("g", { children: yt.map((p, m) => /* @__PURE__ */ r.jsx(Yt.circle, { style: {
-      strokeWidth: 1
-    }, variants: {
-      initial: {
-        fill: "#fff",
-        opacity: 0,
-        ...et ? {} : {
-          stroke: p.color
-        },
-        strokeWidth: 1
-      },
-      whileInView: {
-        fill: p.color,
-        opacity: 1,
-        ...et ? {} : {
-          stroke: p.color
-        },
-        strokeWidth: 1,
-        cx: m % v * d + d / 2,
-        cy: Math.floor(m / v) * d + d / 2,
-        transition: {
-          duration: 0,
-          delay: f.duration / yt.length * m
-        }
-      }
-    }, initial: "initial", animate: vt ? "whileInView" : "initial", className: (p.color.toLowerCase() === "#fff" || p.color.toLowerCase() === "#ffffff" || p.color.toLowerCase() === "white") && et ? "stroke-primary-gray-400 dark:stroke-primary-gray-500" : "", r: D }, m)) }), t[7] = f.duration, t[8] = ut, t[9] = ht, t[10] = n?.description, t[11] = n?.graphContainer, t[12] = n?.title, t[13] = j, t[14] = a, t[15] = ot, t[16] = y, t[17] = k, t[18] = mt, t[19] = w, t[20] = d, t[21] = v, t[22] = x, t[23] = vt, t[24] = gt, t[25] = c, t[26] = it, t[27] = C, t[28] = o?.locale, t[29] = o?.padZeros, t[30] = o?.precision, t[31] = o?.prefix, t[32] = o?.suffix, t[33] = ft, t[34] = D, t[35] = s, t[36] = tt, t[37] = et, t[38] = Y, t[39] = i?.description, t[40] = i?.graphContainer, t[41] = i?.title, t[42] = xt, t[43] = _, t[44] = wt, t[45] = e, t[46] = b, t[47] = N, t[48] = z, t[49] = S, t[50] = $, t[51] = H, t[52] = L, t[53] = M, t[54] = V, t[55] = F, t[56] = G, t[57] = I, t[58] = T, t[59] = W, t[60] = Z, t[61] = A, t[62] = E, t[63] = P, t[64] = R, t[65] = B, t[66] = O, t[67] = q, t[68] = u, t[69] = h, t[70] = g, t[71] = U;
-  } else
-    b = t[46], N = t[47], z = t[48], S = t[49], $ = t[50], H = t[51], L = t[52], M = t[53], V = t[54], F = t[55], G = t[56], I = t[57], T = t[58], W = t[59], Z = t[60], A = t[61], E = t[62], P = t[63], R = t[64], B = t[65], O = t[66], q = t[67], u = t[68], h = t[69], g = t[70], U = t[71];
-  let J;
-  t[97] !== b || t[98] !== U ? (J = /* @__PURE__ */ r.jsx(b, { children: U }), t[97] = b, t[98] = U, t[99] = J) : J = t[99];
-  let K;
-  t[100] !== S || t[101] !== $ || t[102] !== H || t[103] !== L || t[104] !== M || t[105] !== J ? (K = /* @__PURE__ */ r.jsx("svg", { width: S, height: $, ref: H, direction: L, viewBox: M, children: J }), t[100] = S, t[101] = $, t[102] = H, t[103] = L, t[104] = M, t[105] = J, t[106] = K) : K = t[106];
-  let Q;
-  t[107] !== N || t[108] !== V || t[109] !== K ? (Q = /* @__PURE__ */ r.jsx(N, { ref: V, children: K }), t[107] = N, t[108] = V, t[109] = K, t[110] = Q) : Q = t[110];
-  let X;
-  t[111] !== at || t[112] !== rt || t[113] !== i?.footnote || t[114] !== i?.source || t[115] !== e ? (X = rt || at ? /* @__PURE__ */ r.jsx(qt, { styles: {
-    footnote: i?.footnote,
-    source: i?.source
-  }, sources: rt, footNote: at, width: e }) : null, t[111] = at, t[112] = rt, t[113] = i?.footnote, t[114] = i?.source, t[115] = e, t[116] = X) : X = t[116];
-  let dt;
-  return t[117] !== z || t[118] !== F || t[119] !== G || t[120] !== I || t[121] !== T || t[122] !== W || t[123] !== Z || t[124] !== A || t[125] !== E || t[126] !== P || t[127] !== R || t[128] !== B || t[129] !== O || t[130] !== q || t[131] !== u || t[132] !== h || t[133] !== g || t[134] !== Q || t[135] !== X ? (dt = /* @__PURE__ */ r.jsxs(z, { className: F, style: G, id: I, ref: T, "aria-label": W, backgroundColor: Z, theme: A, language: E, minHeight: P, width: R, height: B, relativeHeight: O, padding: q, children: [
-    u,
-    h,
-    g,
-    Q,
-    X
-  ] }), t[117] = z, t[118] = F, t[119] = G, t[120] = I, t[121] = T, t[122] = W, t[123] = Z, t[124] = A, t[125] = E, t[126] = P, t[127] = R, t[128] = B, t[129] = O, t[130] = q, t[131] = u, t[132] = h, t[133] = g, t[134] = Q, t[135] = X, t[136] = dt) : dt = t[136], dt;
+import { o as e } from "./chunk-foFoljWS.js";
+import { t } from "./jsx-runtime-C76bEyh7.js";
+import { Colors as n } from "./Colors.js";
+import { GraphFooter as r } from "./GraphFooter.js";
+import { GraphHeader as i } from "./GraphHeader.js";
+import { t as a } from "./lodash.sum-CX6zs3_n.js";
+import { n as o, t as s } from "./GraphContainer-DgEB1AVN.js";
+import { t as c } from "./proxy-BiRrIImK.js";
+import { t as l } from "./AnimatePresence-CE6xBsMZ.js";
+import { t as u } from "./use-in-view-CjlKdln1.js";
+import { t as d } from "./numberFormattingFunction-Cha8dhHc.js";
+import { useRef as f } from "react";
+import { H2 as p, P as m } from "@undp/design-system-react/Typography";
+//#region src/Components/Graphs/UnitChart/index.tsx
+var h = /* @__PURE__ */ e(a(), 1), g = t();
+function _(e) {
+	let { data: t, size: a = 200, graphTitle: _, sources: v, colors: y = n.light.categoricalColors.colors, graphDescription: b, totalNoOfDots: x = 100, unitPadding: S = 3, gridSize: C = 10, footNote: w, padding: T, backgroundColor: E = !1, graphID: D, graphDownload: O = !1, language: k = "en", showColorScale: A = !0, showStrokeForWhiteDots: j = !0, note: M, dataDownload: N = !1, theme: P = "light", width: F, height: I, minHeight: L = 0, relativeHeight: R, ariaLabel: z, styles: B, classNames: V, animate: H = !1, naLabel: U = "NA", numberDisplayOptions: W } = e, G = f(null), K = H === !0 ? {
+		duration: .5,
+		once: !0,
+		amount: .5
+	} : H || {
+		duration: 0,
+		once: !0,
+		amount: 0
+	}, q = u(G, {
+		once: K.once,
+		amount: K.amount
+	}), J = (0, h.default)(t.map((e) => e.value)), Y = f(null), X = f(null), Z = a / C, Q = (Z - S * 2) / 2;
+	if (Q <= 0) return console.error("The size of single unit is less than or equal to zero. Check values for ((dimension / gridSize) - (padding * 2)) / 2 is not less than or equal to 0."), null;
+	let $ = [];
+	return t.forEach((e, t) => {
+		let n = Math.round(e.value / J * x);
+		for (let e = 0; e < n; e += 1) $.push({ color: y[t] });
+	}), /* @__PURE__ */ (0, g.jsxs)(o, {
+		className: V?.graphContainer,
+		style: B?.graphContainer,
+		id: D,
+		ref: Y,
+		"aria-label": z,
+		backgroundColor: E,
+		theme: P,
+		language: k,
+		minHeight: L,
+		width: F,
+		height: I,
+		relativeHeight: R,
+		padding: T,
+		children: [
+			_ || b || O ? /* @__PURE__ */ (0, g.jsx)(i, {
+				styles: {
+					title: B?.title,
+					description: B?.description
+				},
+				classNames: {
+					title: V?.title,
+					description: V?.description
+				},
+				graphTitle: _,
+				graphDescription: b,
+				width: F,
+				graphDownload: O ? Y : void 0,
+				dataDownload: N ? t.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? t.map((e) => e.data).filter((e) => e !== void 0) : t.filter((e) => e !== void 0) : null
+			}) : null,
+			M ? /* @__PURE__ */ (0, g.jsx)(p, {
+				marginBottom: "2xs",
+				className: "text-primary-gray-700 dark:text-primary-gray-100 font-bold",
+				style: { width: F ? `${F}px` : "100%" },
+				children: M
+			}) : null,
+			A ? /* @__PURE__ */ (0, g.jsx)("div", {
+				className: "mb-4 leading-0",
+				style: { width: F ? `${F}px` : "100%" },
+				children: /* @__PURE__ */ (0, g.jsx)("div", {
+					className: "flex mb-0 flex-wrap gap-x-4 gap-y-1",
+					children: t.map((e, t) => /* @__PURE__ */ (0, g.jsxs)("div", {
+						className: "flex gap-2 items-center",
+						children: [/* @__PURE__ */ (0, g.jsx)("div", {
+							className: "w-3 h-3 rounded-full",
+							style: { backgroundColor: y[t] }
+						}), /* @__PURE__ */ (0, g.jsxs)(m, {
+							marginBottom: "none",
+							size: "sm",
+							className: "text-primary-gray-700 dark:text-primary-gray-100",
+							children: [
+								e.label,
+								":",
+								" ",
+								/* @__PURE__ */ (0, g.jsx)("span", {
+									className: "font-bold",
+									children: d(e.value, U, W?.precision ?? 2, W?.prefix, W?.suffix, W?.locale || "en", W?.padZeros || !1)
+								})
+							]
+						})]
+					}, e.label))
+				})
+			}) : null,
+			/* @__PURE__ */ (0, g.jsx)(s, {
+				ref: X,
+				children: /* @__PURE__ */ (0, g.jsx)("svg", {
+					width: `${F || a}px`,
+					height: `${Math.max(L, I ? R && F ? L ? F * R > L ? F * R : L : F * R : I : Math.floor((x - 1) / C) * Z + Z / 2 + Q + 5)}px`,
+					ref: G,
+					direction: "ltr",
+					viewBox: `0 0 ${F || a} ${Math.max(L, I ? R && F ? L ? F * R > L ? F * R : L : F * R : I : Math.floor((x - 1) / C) * Z + Z / 2 + Q + 5)}`,
+					children: /* @__PURE__ */ (0, g.jsx)(l, { children: /* @__PURE__ */ (0, g.jsx)("g", { children: $.map((e, t) => /* @__PURE__ */ (0, g.jsx)(c.circle, {
+						style: { strokeWidth: 1 },
+						variants: {
+							initial: {
+								fill: "#fff",
+								opacity: 0,
+								...j ? {} : { stroke: e.color },
+								strokeWidth: 1
+							},
+							whileInView: {
+								fill: e.color,
+								opacity: 1,
+								...j ? {} : { stroke: e.color },
+								strokeWidth: 1,
+								cx: t % C * Z + Z / 2,
+								cy: Math.floor(t / C) * Z + Z / 2,
+								transition: {
+									duration: 0,
+									delay: K.duration / $.length * t
+								}
+							}
+						},
+						initial: "initial",
+						animate: q ? "whileInView" : "initial",
+						className: (e.color.toLowerCase() === "#fff" || e.color.toLowerCase() === "#ffffff" || e.color.toLowerCase() === "white") && j ? "stroke-primary-gray-400 dark:stroke-primary-gray-500" : "",
+						r: Q
+					}, t)) }) })
+				})
+			}),
+			v || w ? /* @__PURE__ */ (0, g.jsx)(r, {
+				styles: {
+					footnote: B?.footnote,
+					source: B?.source
+				},
+				sources: v,
+				footNote: w,
+				width: F
+			}) : null
+		]
+	});
 }
-function ee(l) {
-  return l !== void 0;
-}
-function oe(l) {
-  return l !== void 0;
-}
-function ie(l) {
-  return l.data;
-}
-function re(l) {
-  return l !== void 0;
-}
-function ae(l) {
-  return l.data;
-}
-function le(l) {
-  return l.value;
-}
-export {
-  we as UnitChart
-};
-//# sourceMappingURL=UnitChart.js.map
+//#endregion
+export { _ as UnitChart };
+
+//# sourceMappingURL=UnitChart.js.map

package/dist/UnitChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"UnitChart.js","sources":["../src/Components/Graphs/UnitChart/index.tsx"],"sourcesContent":["import { useRef } from 'react';\r\nimport sum from 'lodash.sum';\r\nimport { H2, P } from '@undp/design-system-react/Typography';\r\nimport { AnimatePresence, motion, useInView } from 'motion/react';\r\n\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport {\r\n  UnitChartDataType,\r\n  SourcesDataType,\r\n  Languages,\r\n  StyleObject,\r\n  ClassNameObject,\r\n  AnimateDataType,\r\n  NumberFormatOptions,\r\n} from '@/Types';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\r\n\r\ninterface Props {\r\n  // Data\r\n  /** Array of data objects */\r\n  data: UnitChartDataType[];\r\n\r\n  // Titles, Labels, and Sources\r\n  /** Title of the graph */\r\n  graphTitle?: string | React.ReactNode;\r\n  /** Description of the graph */\r\n  graphDescription?: string | React.ReactNode;\r\n  /** Note with h2 tag just above the graph. Can be used to highlight text */\r\n  note?: string;\r\n  /** Footnote for the graph */\r\n  footNote?: string | React.ReactNode;\r\n  /** Source data for the graph */\r\n  sources?: SourcesDataType[];\r\n  /** Accessibility label */\r\n  ariaLabel?: string;\r\n\r\n  // Colors and Styling\r\n  /** Colors of the highlighted circles */\r\n  colors?: string[];\r\n  /** Background color of the graph */\r\n  backgroundColor?: string | boolean;\r\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n  styles?: StyleObject;\r\n  /** Custom class names */\r\n  classNames?: ClassNameObject;\r\n\r\n  // Size and Spacing\r\n  /** Width of the graph */\r\n  width?: number;\r\n  /** Height of the graph */\r\n  height?: number;\r\n  /** Minimum height of the graph */\r\n  minHeight?: number;\r\n  /** Relative height scaling factor. This overwrites the height props */\r\n  relativeHeight?: number;\r\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n  padding?: string;\r\n\r\n  // Graph Parameters\r\n  /** Size of the visualization */\r\n  size?: number;\r\n  /** No. of dots in a single row */\r\n  gridSize?: number;\r\n  /** Spacing between 2 dots */\r\n  unitPadding?: number;\r\n  /** Total no. of dot that are rendered in the chart */\r\n  totalNoOfDots?: number;\r\n  /** Toggle visibility of stroke for the unfilled dots */\r\n  showStrokeForWhiteDots?: boolean;\r\n  /** Toggles if the graph animates in when loaded.  */\r\n  animate?: boolean | AnimateDataType;\r\n  /** Toggle visibility of color scale */\r\n  showColorScale?: boolean;\r\n  /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */\r\n  numberDisplayOptions?: NumberFormatOptions;\r\n  /** Defines how “NA” values should be displayed/labelled in the graph */\r\n  naLabel?: string;\r\n  /** Enable graph download option as png */\r\n  graphDownload?: boolean;\r\n  /** Enable data download option as a csv */\r\n  dataDownload?: boolean;\r\n\r\n  // Configuration and Options\r\n  /** Language setting  */\r\n  language?: Languages;\r\n  /** Color theme */\r\n  theme?: 'light' | 'dark';\r\n  /** Unique ID for the graph */\r\n  graphID?: string;\r\n}\r\n\r\nexport function UnitChart(props: Props) {\r\n  const {\r\n    data,\r\n    size = 200,\r\n    graphTitle,\r\n    sources,\r\n    colors = Colors.light.categoricalColors.colors,\r\n    graphDescription,\r\n    totalNoOfDots = 100,\r\n    unitPadding = 3,\r\n    gridSize = 10,\r\n    footNote,\r\n    padding,\r\n    backgroundColor = false,\r\n    graphID,\r\n    graphDownload = false,\r\n    language = 'en',\r\n    showColorScale = true,\r\n    showStrokeForWhiteDots = true,\r\n    note,\r\n    dataDownload = false,\r\n    theme = 'light',\r\n    width,\r\n    height,\r\n    minHeight = 0,\r\n    relativeHeight,\r\n    ariaLabel,\r\n    styles,\r\n    classNames,\r\n    animate = false,\r\n    naLabel = 'NA',\r\n    numberDisplayOptions,\r\n  } = props;\r\n  const svgRef = useRef(null);\r\n  const animateValue =\r\n    animate === true\r\n      ? { duration: 0.5, once: true, amount: 0.5 }\r\n      : animate || { duration: 0, once: true, amount: 0 };\r\n  const isInView = useInView(svgRef, {\r\n    once: animateValue.once,\r\n    amount: animateValue.amount,\r\n  });\r\n  const totalValue = sum(data.map(d => d.value));\r\n  const graphParentDiv = useRef<HTMLDivElement>(null);\r\n  const graphDiv = useRef<HTMLDivElement>(null);\r\n  const gridDimension = size / gridSize;\r\n  const radius = (gridDimension - unitPadding * 2) / 2;\r\n  if (radius <= 0) {\r\n    console.error(\r\n      'The size of single unit is less than or equal to zero. Check values for ((dimension / gridSize) - (padding * 2)) / 2 is not less than or equal to 0.',\r\n    );\r\n    return null;\r\n  }\r\n\r\n  const cellsData: { color: string }[] = [];\r\n  data.forEach((item, index) => {\r\n    const count = Math.round((item.value / totalValue) * totalNoOfDots);\r\n    for (let i = 0; i < count; i += 1) {\r\n      cellsData.push({ color: colors[index] });\r\n    }\r\n  });\r\n  return (\r\n    <GraphContainer\r\n      className={classNames?.graphContainer}\r\n      style={styles?.graphContainer}\r\n      id={graphID}\r\n      ref={graphParentDiv}\r\n      aria-label={ariaLabel}\r\n      backgroundColor={backgroundColor}\r\n      theme={theme}\r\n      language={language}\r\n      minHeight={minHeight}\r\n      width={width}\r\n      height={height}\r\n      relativeHeight={relativeHeight}\r\n      padding={padding}\r\n    >\r\n      {graphTitle || graphDescription || graphDownload ? (\r\n        <GraphHeader\r\n          styles={{\r\n            title: styles?.title,\r\n            description: styles?.description,\r\n          }}\r\n          classNames={{\r\n            title: classNames?.title,\r\n            description: classNames?.description,\r\n          }}\r\n          graphTitle={graphTitle}\r\n          graphDescription={graphDescription}\r\n          width={width}\r\n          graphDownload={graphDownload ? graphParentDiv : undefined}\r\n          dataDownload={\r\n            dataDownload\r\n              ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n                ? data.map(d => d.data).filter(d => d !== undefined)\r\n                : data.filter(d => d !== undefined)\r\n              : null\r\n          }\r\n        />\r\n      ) : null}\r\n      {note ? (\r\n        <H2\r\n          marginBottom='2xs'\r\n          className='text-primary-gray-700 dark:text-primary-gray-100 font-bold'\r\n          style={{ width: width ? `${width}px` : '100%' }}\r\n        >\r\n          {note}\r\n        </H2>\r\n      ) : null}\r\n      {showColorScale ? (\r\n        <div\r\n          className='mb-4 leading-0'\r\n          style={{ width: width ? `${width}px` : '100%' }}\r\n          aria-label='Color legend'\r\n        >\r\n          <div className='flex mb-0 flex-wrap gap-x-4 gap-y-1'>\r\n            {data.map((d, i) => (\r\n              <div className='flex gap-2 items-center' key={i}>\r\n                <div className='w-3 h-3 rounded-full' style={{ backgroundColor: colors[i] }} />\r\n                <P\r\n                  marginBottom='none'\r\n                  size='sm'\r\n                  className='text-primary-gray-700 dark:text-primary-gray-100'\r\n                >\r\n                  {d.label}:{' '}\r\n                  <span className='font-bold'>\r\n                    {numberFormattingFunction(\r\n                      d.value,\r\n                      naLabel,\r\n                      numberDisplayOptions?.precision ?? 2,\r\n                      numberDisplayOptions?.prefix,\r\n                      numberDisplayOptions?.suffix,\r\n                      numberDisplayOptions?.locale || 'en',\r\n                      numberDisplayOptions?.padZeros || false,\r\n                    )}\r\n                  </span>\r\n                </P>\r\n              </div>\r\n            ))}\r\n          </div>\r\n        </div>\r\n      ) : null}\r\n      <GraphArea ref={graphDiv}>\r\n        <svg\r\n          width={`${width || size}px`}\r\n          height={`${Math.max(\r\n            minHeight,\r\n            height\r\n              ? relativeHeight && width\r\n                ? minHeight\r\n                  ? width * relativeHeight > minHeight\r\n                    ? width * relativeHeight\r\n                    : minHeight\r\n                  : width * relativeHeight\r\n                : height\r\n              : Math.floor((totalNoOfDots - 1) / gridSize) * gridDimension +\r\n                  gridDimension / 2 +\r\n                  radius +\r\n                  5,\r\n          )}px`}\r\n          ref={svgRef}\r\n          direction='ltr'\r\n          viewBox={`0 0 ${width || size} ${Math.max(\r\n            minHeight,\r\n            height\r\n              ? relativeHeight && width\r\n                ? minHeight\r\n                  ? width * relativeHeight > minHeight\r\n                    ? width * relativeHeight\r\n                    : minHeight\r\n                  : width * relativeHeight\r\n                : height\r\n              : Math.floor((totalNoOfDots - 1) / gridSize) * gridDimension +\r\n                  gridDimension / 2 +\r\n                  radius +\r\n                  5,\r\n          )}`}\r\n        >\r\n          <AnimatePresence>\r\n            <g>\r\n              {cellsData.map((d, i) => (\r\n                <motion.circle\r\n                  key={i}\r\n                  style={{\r\n                    strokeWidth: 1,\r\n                  }}\r\n                  variants={{\r\n                    initial: {\r\n                      fill: '#fff',\r\n                      opacity: 0,\r\n                      ...(!showStrokeForWhiteDots ? { stroke: d.color } : {}),\r\n                      strokeWidth: 1,\r\n                    },\r\n                    whileInView: {\r\n                      fill: d.color,\r\n                      opacity: 1,\r\n                      ...(!showStrokeForWhiteDots ? { stroke: d.color } : {}),\r\n                      strokeWidth: 1,\r\n                      cx: (i % gridSize) * gridDimension + gridDimension / 2,\r\n                      cy: Math.floor(i / gridSize) * gridDimension + gridDimension / 2,\r\n                      transition: {\r\n                        duration: 0,\r\n                        delay: (animateValue.duration / cellsData.length) * i,\r\n                      },\r\n                    },\r\n                  }}\r\n                  initial='initial'\r\n                  animate={isInView ? 'whileInView' : 'initial'}\r\n                  className={\r\n                    (d.color.toLowerCase() === '#fff' ||\r\n                      d.color.toLowerCase() === '#ffffff' ||\r\n                      d.color.toLowerCase() === 'white') &&\r\n                    showStrokeForWhiteDots\r\n                      ? 'stroke-primary-gray-400 dark:stroke-primary-gray-500'\r\n                      : ''\r\n                  }\r\n                  r={radius}\r\n                />\r\n              ))}\r\n            </g>\r\n          </AnimatePresence>\r\n        </svg>\r\n      </GraphArea>\r\n      {sources || footNote ? (\r\n        <GraphFooter\r\n          styles={{\r\n            footnote: styles?.footnote,\r\n            source: styles?.source,\r\n          }}\r\n          sources={sources}\r\n          footNote={footNote}\r\n          width={width}\r\n        />\r\n      ) : null}\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"names":["UnitChart","props","$","_c","data","size","t0","graphTitle","sources","colors","t1","graphDescription","totalNoOfDots","t2","unitPadding","t3","gridSize","t4","footNote","padding","backgroundColor","t5","graphID","graphDownload","t6","language","t7","showColorScale","t8","showStrokeForWhiteDots","t9","note","dataDownload","t10","theme","t11","width","height","minHeight","t12","relativeHeight","ariaLabel","styles","classNames","animate","t13","naLabel","t14","numberDisplayOptions","undefined","Colors","light","categoricalColors","svgRef","useRef","t15","duration","once","amount","animateValue","t16","isInView","useInView","t17","sum","map","_temp","totalValue","graphParentDiv","graphDiv","gridDimension","radius","console","error","T0","T1","T2","t18","t19","t20","t21","t22","t23","t24","t25","t26","t27","t28","t29","t30","t31","t32","t33","t34","t35","t36","t37","t38","t39","t40","description","graphContainer","title","locale","padZeros","precision","prefix","suffix","cellsData","forEach","item","index","count","Math","round","value","i","push","color","GraphContainer","jsx","GraphHeader","_temp2","filter","_temp3","length","_temp4","_temp5","_temp6","H2","d_5","i_0","jsxs","P","d","label","numberFormattingFunction","GraphArea","max","floor","AnimatePresence","d_6","i_1","strokeWidth","initial","fill","opacity","stroke","whileInView","cx","cy","transition","delay","toLowerCase","t41","t42","t43","t44","footnote","source","GraphFooter","t45","d_2","d_1","d_0","d_4","d_3"],"mappings":"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"}
+{"version":3,"file":"UnitChart.js","names":[],"sources":["../src/Components/Graphs/UnitChart/index.tsx"],"sourcesContent":["import { H2, P } from '@undp/design-system-react/Typography';\nimport sum from 'lodash.sum';\nimport { AnimatePresence, motion, useInView } from 'motion/react';\nimport { useRef } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\nimport type {\n  AnimateDataType,\n  ClassNameObject,\n  Languages,\n  NumberFormatOptions,\n  SourcesDataType,\n  StyleObject,\n  UnitChartDataType,\n} from '@/Types';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\n\ninterface Props {\n  // Data\n  /** Array of data objects */\n  data: UnitChartDataType[];\n\n  // Titles, Labels, and Sources\n  /** Title of the graph */\n  graphTitle?: string | React.ReactNode;\n  /** Description of the graph */\n  graphDescription?: string | React.ReactNode;\n  /** Note with h2 tag just above the graph. Can be used to highlight text */\n  note?: string;\n  /** Footnote for the graph */\n  footNote?: string | React.ReactNode;\n  /** Source data for the graph */\n  sources?: SourcesDataType[];\n  /** Accessibility label */\n  ariaLabel?: string;\n\n  // Colors and Styling\n  /** Colors of the highlighted circles */\n  colors?: string[];\n  /** Background color of the graph */\n  backgroundColor?: string | boolean;\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\n  styles?: StyleObject;\n  /** Custom class names */\n  classNames?: ClassNameObject;\n\n  // Size and Spacing\n  /** Width of the graph */\n  width?: number;\n  /** Height of the graph */\n  height?: number;\n  /** Minimum height of the graph */\n  minHeight?: number;\n  /** Relative height scaling factor. This overwrites the height props */\n  relativeHeight?: number;\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\n  padding?: string;\n\n  // Graph Parameters\n  /** Size of the visualization */\n  size?: number;\n  /** No. of dots in a single row */\n  gridSize?: number;\n  /** Spacing between 2 dots */\n  unitPadding?: number;\n  /** Total no. of dot that are rendered in the chart */\n  totalNoOfDots?: number;\n  /** Toggle visibility of stroke for the unfilled dots */\n  showStrokeForWhiteDots?: boolean;\n  /** Toggles if the graph animates in when loaded.  */\n  animate?: boolean | AnimateDataType;\n  /** Toggle visibility of color scale */\n  showColorScale?: boolean;\n  /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */\n  numberDisplayOptions?: NumberFormatOptions;\n  /** Defines how “NA” values should be displayed/labelled in the graph */\n  naLabel?: string;\n  /** Enable graph download option as png */\n  graphDownload?: boolean;\n  /** Enable data download option as a csv */\n  dataDownload?: boolean;\n\n  // Configuration and Options\n  /** Language setting  */\n  language?: Languages;\n  /** Color theme */\n  theme?: 'light' | 'dark';\n  /** Unique ID for the graph */\n  graphID?: string;\n}\n\nexport function UnitChart(props: Props) {\n  const {\n    data,\n    size = 200,\n    graphTitle,\n    sources,\n    colors = Colors.light.categoricalColors.colors,\n    graphDescription,\n    totalNoOfDots = 100,\n    unitPadding = 3,\n    gridSize = 10,\n    footNote,\n    padding,\n    backgroundColor = false,\n    graphID,\n    graphDownload = false,\n    language = 'en',\n    showColorScale = true,\n    showStrokeForWhiteDots = true,\n    note,\n    dataDownload = false,\n    theme = 'light',\n    width,\n    height,\n    minHeight = 0,\n    relativeHeight,\n    ariaLabel,\n    styles,\n    classNames,\n    animate = false,\n    naLabel = 'NA',\n    numberDisplayOptions,\n  } = props;\n  const svgRef = useRef(null);\n  const animateValue =\n    animate === true\n      ? { duration: 0.5, once: true, amount: 0.5 }\n      : animate || { duration: 0, once: true, amount: 0 };\n  const isInView = useInView(svgRef, {\n    once: animateValue.once,\n    amount: animateValue.amount,\n  });\n  const totalValue = sum(data.map((d) => d.value));\n  const graphParentDiv = useRef<HTMLDivElement>(null);\n  const graphDiv = useRef<HTMLDivElement>(null);\n  const gridDimension = size / gridSize;\n  const radius = (gridDimension - unitPadding * 2) / 2;\n  if (radius <= 0) {\n    console.error(\n      'The size of single unit is less than or equal to zero. Check values for ((dimension / gridSize) - (padding * 2)) / 2 is not less than or equal to 0.',\n    );\n    return null;\n  }\n\n  const cellsData: { color: string }[] = [];\n  data.forEach((item, index) => {\n    const count = Math.round((item.value / totalValue) * totalNoOfDots);\n    for (let i = 0; i < count; i += 1) {\n      cellsData.push({ color: colors[index] });\n    }\n  });\n  return (\n    <GraphContainer\n      className={classNames?.graphContainer}\n      style={styles?.graphContainer}\n      id={graphID}\n      ref={graphParentDiv}\n      aria-label={ariaLabel}\n      backgroundColor={backgroundColor}\n      theme={theme}\n      language={language}\n      minHeight={minHeight}\n      width={width}\n      height={height}\n      relativeHeight={relativeHeight}\n      padding={padding}\n    >\n      {graphTitle || graphDescription || graphDownload ? (\n        <GraphHeader\n          styles={{\n            title: styles?.title,\n            description: styles?.description,\n          }}\n          classNames={{\n            title: classNames?.title,\n            description: classNames?.description,\n          }}\n          graphTitle={graphTitle}\n          graphDescription={graphDescription}\n          width={width}\n          graphDownload={graphDownload ? graphParentDiv : undefined}\n          dataDownload={\n            dataDownload\n              ? data.map((d) => d.data).filter((d) => d !== undefined).length > 0\n                ? data.map((d) => d.data).filter((d) => d !== undefined)\n                : data.filter((d) => d !== undefined)\n              : null\n          }\n        />\n      ) : null}\n      {note ? (\n        <H2\n          marginBottom='2xs'\n          className='text-primary-gray-700 dark:text-primary-gray-100 font-bold'\n          style={{ width: width ? `${width}px` : '100%' }}\n        >\n          {note}\n        </H2>\n      ) : null}\n      {showColorScale ? (\n        <div className='mb-4 leading-0' style={{ width: width ? `${width}px` : '100%' }}>\n          <div className='flex mb-0 flex-wrap gap-x-4 gap-y-1'>\n            {data.map((d, i) => (\n              <div className='flex gap-2 items-center' key={d.label}>\n                <div className='w-3 h-3 rounded-full' style={{ backgroundColor: colors[i] }} />\n                <P\n                  marginBottom='none'\n                  size='sm'\n                  className='text-primary-gray-700 dark:text-primary-gray-100'\n                >\n                  {d.label}:{' '}\n                  <span className='font-bold'>\n                    {numberFormattingFunction(\n                      d.value,\n                      naLabel,\n                      numberDisplayOptions?.precision ?? 2,\n                      numberDisplayOptions?.prefix,\n                      numberDisplayOptions?.suffix,\n                      numberDisplayOptions?.locale || 'en',\n                      numberDisplayOptions?.padZeros || false,\n                    )}\n                  </span>\n                </P>\n              </div>\n            ))}\n          </div>\n        </div>\n      ) : null}\n      <GraphArea ref={graphDiv}>\n        <svg\n          width={`${width || size}px`}\n          height={`${Math.max(\n            minHeight,\n            height\n              ? relativeHeight && width\n                ? minHeight\n                  ? width * relativeHeight > minHeight\n                    ? width * relativeHeight\n                    : minHeight\n                  : width * relativeHeight\n                : height\n              : Math.floor((totalNoOfDots - 1) / gridSize) * gridDimension +\n                  gridDimension / 2 +\n                  radius +\n                  5,\n          )}px`}\n          ref={svgRef}\n          direction='ltr'\n          viewBox={`0 0 ${width || size} ${Math.max(\n            minHeight,\n            height\n              ? relativeHeight && width\n                ? minHeight\n                  ? width * relativeHeight > minHeight\n                    ? width * relativeHeight\n                    : minHeight\n                  : width * relativeHeight\n                : height\n              : Math.floor((totalNoOfDots - 1) / gridSize) * gridDimension +\n                  gridDimension / 2 +\n                  radius +\n                  5,\n          )}`}\n        >\n          <AnimatePresence>\n            <g>\n              {cellsData.map((d, i) => (\n                <motion.circle\n                  // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n                  key={i}\n                  style={{\n                    strokeWidth: 1,\n                  }}\n                  variants={{\n                    initial: {\n                      fill: '#fff',\n                      opacity: 0,\n                      ...(!showStrokeForWhiteDots ? { stroke: d.color } : {}),\n                      strokeWidth: 1,\n                    },\n                    whileInView: {\n                      fill: d.color,\n                      opacity: 1,\n                      ...(!showStrokeForWhiteDots ? { stroke: d.color } : {}),\n                      strokeWidth: 1,\n                      cx: (i % gridSize) * gridDimension + gridDimension / 2,\n                      cy: Math.floor(i / gridSize) * gridDimension + gridDimension / 2,\n                      transition: {\n                        duration: 0,\n                        delay: (animateValue.duration / cellsData.length) * i,\n                      },\n                    },\n                  }}\n                  initial='initial'\n                  animate={isInView ? 'whileInView' : 'initial'}\n                  className={\n                    (d.color.toLowerCase() === '#fff' ||\n                      d.color.toLowerCase() === '#ffffff' ||\n                      d.color.toLowerCase() === 'white') &&\n                    showStrokeForWhiteDots\n                      ? 'stroke-primary-gray-400 dark:stroke-primary-gray-500'\n                      : ''\n                  }\n                  r={radius}\n                />\n              ))}\n            </g>\n          </AnimatePresence>\n        </svg>\n      </GraphArea>\n      {sources || footNote ? (\n        <GraphFooter\n          styles={{\n            footnote: styles?.footnote,\n            source: styles?.source,\n          }}\n          sources={sources}\n          footNote={footNote}\n          width={width}\n        />\n      ) : null}\n    </GraphContainer>\n  );\n}\n"],"mappings":"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"}

package/dist/Utils/checkDataValidity.d.ts

@@ -0,0 +1,6 @@
+import { GraphConfigurationDataType, GraphType, ThreeDGraphType } from '../Types';
+export declare function checkDataConfigValidity(dataConfig: GraphConfigurationDataType[], graph: GraphType | ThreeDGraphType, dataKeys: string[]): {
+    isValid: boolean;
+    err: string | undefined;
+};
+//# sourceMappingURL=checkDataValidity.d.ts.map

package/dist/Utils/checkDataValidity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkDataValidity.d.ts","sourceRoot":"","sources":["../../src/Utils/checkDataValidity.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,0BAA0B,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAOtF,wBAAgB,uBAAuB,CACrC,UAAU,EAAE,0BAA0B,EAAE,EACxC,KAAK,EAAE,SAAS,GAAG,eAAe,EAClC,QAAQ,EAAE,MAAM,EAAE;;;EAyBnB"}

package/dist/Utils/checkIfMultiple.d.ts

@@ -0,0 +1,3 @@
+import { GraphConfigurationDataType } from '../Types';
+export declare function checkIfMultiple(id: string, graphConfig: GraphConfigurationDataType[]): boolean;
+//# sourceMappingURL=checkIfMultiple.d.ts.map

package/dist/Utils/checkIfMultiple.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkIfMultiple.d.ts","sourceRoot":"","sources":["../../src/Utils/checkIfMultiple.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAC;AAE1D,wBAAgB,eAAe,CAAC,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,0BAA0B,EAAE,WAKpF"}

package/dist/Utils/checkIfNullOrUndefined.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Checks whether a given value is `null` or `undefined`.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is `null` or `undefined`, otherwise `false`.
+ *
+ * @example
+ * checkIfNullOrUndefined(null); // true
+ * checkIfNullOrUndefined(undefined); // true
+ * checkIfNullOrUndefined(0); // false
+ * checkIfNullOrUndefined(''); // false
+ */
+export declare function checkIfNullOrUndefined(value: any): boolean;
+//# sourceMappingURL=checkIfNullOrUndefined.d.ts.map

package/dist/Utils/checkIfNullOrUndefined.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkIfNullOrUndefined.d.ts","sourceRoot":"","sources":["../../src/Utils/checkIfNullOrUndefined.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,GAAG,WAGhD"}

package/dist/Utils/ensureCompleteData.d.ts

@@ -0,0 +1,8 @@
+import { BarGraphDataType, BulletChartDataType, ButterflyChartDataType, DumbbellChartDataType, GroupedBarGraphDataType, ScatterPlotDataType } from '../Types';
+export declare function ensureCompleteDataForBarChart(data: BarGraphDataType[], dateFormat: string): BarGraphDataType[];
+export declare function ensureCompleteDataForStackedBarChart(data: GroupedBarGraphDataType[], dateFormat: string): GroupedBarGraphDataType[];
+export declare function ensureCompleteDataForButterFlyChart(data: ButterflyChartDataType[], dateFormat: string): ButterflyChartDataType[];
+export declare function ensureCompleteDataForScatterPlot(data: ScatterPlotDataType[], dateFormat: string): ScatterPlotDataType[];
+export declare function ensureCompleteDataForDumbbellChart(data: DumbbellChartDataType[], dateFormat: string): DumbbellChartDataType[];
+export declare function ensureCompleteDataForBulletChart(data: BulletChartDataType[], dateFormat: string): BulletChartDataType[];
+//# sourceMappingURL=ensureCompleteData.d.ts.map

package/dist/Utils/ensureCompleteData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ensureCompleteData.d.ts","sourceRoot":"","sources":["../../src/Utils/ensureCompleteData.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,gBAAgB,EAChB,mBAAmB,EACnB,sBAAsB,EACtB,qBAAqB,EACrB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAEjB,wBAAgB,6BAA6B,CAAC,IAAI,EAAE,gBAAgB,EAAE,EAAE,UAAU,EAAE,MAAM,sBAyCzF;AAED,wBAAgB,oCAAoC,CAClD,IAAI,EAAE,uBAAuB,EAAE,EAC/B,UAAU,EAAE,MAAM,6BAgCnB;AAED,wBAAgB,mCAAmC,CACjD,IAAI,EAAE,sBAAsB,EAAE,EAC9B,UAAU,EAAE,MAAM,4BAkCnB;AAED,wBAAgB,gCAAgC,CAAC,IAAI,EAAE,mBAAmB,EAAE,EAAE,UAAU,EAAE,MAAM,yBA2C/F;AAED,wBAAgB,kCAAkC,CAChD,IAAI,EAAE,qBAAqB,EAAE,EAC7B,UAAU,EAAE,MAAM,2BAiCnB;AAED,wBAAgB,gCAAgC,CAAC,IAAI,EAAE,mBAAmB,EAAE,EAAE,UAAU,EAAE,MAAM,yBAkC/F"}

package/dist/Utils/excelDownload.d.ts

@@ -0,0 +1,30 @@
+interface WsColInterface {
+    wch: number;
+}
+/**
+ * Downloads CSV data as an Excel file with specified headers and column widths.
+ *
+ * The function converts JSON data (`csvData`) to an Excel sheet, adds headers, and applies custom column widths.
+ * The resulting file is then downloaded using `file-saver` as an `.xlsx` file.
+ *
+ * @param csvData - The data to be exported as an Excel sheet, represented as an array of objects.
+ * @param fileName - The name of the file to be downloaded (without extension).
+ * @param headers - The headers for the Excel sheet.
+ * @param xlsxHeader - The header data to be used for the Excel file (should match `headers`).
+ * @param wscols - The column width configuration, where each item corresponds to a column.
+ *
+ * @example
+ * const data = [{ name: 'Alice', age: 25 }, { name: 'Bob', age: 30 }];
+ * const headers = ['name', 'age'];
+ * const xlsxHeader = {
+ *  name: "Full Name",
+ *  age: "Age",
+ * };
+ * const columnWidths = [{ wch: 10 }, { wch: 5 }];
+ * excelDownload(data, 'user_data', headers, xlsxHeader, columnWidths);
+ */
+export declare const excelDownload: (csvData: any, fileName: string, headers: string[], xlsxHeader: {
+    [key: string]: string;
+}, wscols: WsColInterface[]) => void;
+export {};
+//# sourceMappingURL=excelDownload.d.ts.map

package/dist/Utils/excelDownload.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"excelDownload.d.ts","sourceRoot":"","sources":["../../src/Utils/excelDownload.ts"],"names":[],"mappings":"AAGA,UAAU,cAAc;IACtB,GAAG,EAAE,MAAM,CAAC;CACb;AACD;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,eAAO,MAAM,aAAa,GAExB,SAAS,GAAG,EACZ,UAAU,MAAM,EAChB,SAAS,MAAM,EAAE,EACjB,YAAY;IACV,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,EACD,QAAQ,cAAc,EAAE,SAmBzB,CAAC"}

package/dist/Utils/fetchAndParseData.d.ts

@@ -0,0 +1,65 @@
+import { ColumnConfigurationDataType, FileSettingsDataType } from '../Types';
+/**
+ * Fetches a CSV file from a URL, parses it, and applies transformations based on the provided configuration.
+ *
+ * @param dataURL - The URL of the CSV file to fetch.
+ * @param dataTransformation - Optional Handlebars template for data transformation.
+ * @param columnsToArray - Optional columns configuration to transform certain columns to arrays.
+ * @param debugMode - Optional flag to log data to the console for debugging.
+ * @param delimiter - Optional delimiter used in the CSV file (default is comma).
+ * @param header - Optional flag to specify whether the CSV file contains headers (default is true).
+ *
+ * @returns A promise that resolves to the parsed and transformed data.
+ *
+ * @example
+ * fetchAndParseCSV('https://example.com/data.csv', '{{data}}', [], true)
+ *   .then(parsedData => console.log(parsedData))
+ *   .catch(error => console.error('Error:', error));
+ */
+export declare function fetchAndParseCSV(dataURL: string, dataTransformation?: string, columnsToArray?: ColumnConfigurationDataType[], debugMode?: boolean, delimiter?: string, header?: boolean): Promise<unknown>;
+/**
+ * Parses CSV data from a string, applying optional transformations.
+ *
+ * @param data - The CSV data as a string.
+ * @param dataTransformation - Optional Handlebars template for data transformation.
+ * @param columnsToArray - Optional columns configuration to transform certain columns to arrays.
+ * @param debugMode - Optional flag to log data to the console for debugging.
+ * @param delimiter - Optional delimiter used in the CSV file (default is comma).
+ * @param header - Optional flag to specify whether the CSV file contains headers (default is true).
+ *
+ * @returns A promise that resolves to the parsed and transformed data.
+ */
+export declare function fetchAndParseCSVFromTextBlob(data: string, dataTransformation?: string, columnsToArray?: ColumnConfigurationDataType[], debugMode?: boolean, delimiter?: string, header?: boolean): Promise<unknown>;
+/**
+ * Fetches and parses a JSON file from a URL, and applies optional transformations.
+ *
+ * @param dataURL - The URL of the JSON file to fetch.
+ * @param columnsToArray - Optional columns configuration to transform certain columns to arrays.
+ * @param dataTransformation - Optional Handlebars template for data transformation.
+ * @param debugMode - Optional flag to log data to the console for debugging.
+ *
+ * @returns A promise that resolves to the parsed and transformed data.
+ */
+export declare function fetchAndParseJSON(dataURL: string, columnsToArray?: ColumnConfigurationDataType[], dataTransformation?: string, debugMode?: boolean): Promise<any>;
+/**
+ * Fetches and transforms data from an API, and applies optional transformations.
+ *
+ * @param requestURL - The URL of the API to fetch data from.
+ * @param headers - Optional headers to include in the API request.
+ * @param columnsToArray - Optional columns configuration to transform certain columns to arrays.
+ * @param dataTransformation - Optional Handlebars template for data transformation.
+ * @param debugMode - Optional flag to log data to the console for debugging.
+ *
+ * @returns A promise that resolves to the transformed data.
+ */
+export declare function fetchAndTransformDataFromAPI(requestURL: string, headers?: any, columnsToArray?: ColumnConfigurationDataType[], dataTransformation?: string, debugMode?: boolean): Promise<any>;
+/**
+ * Fetches and parses data from multiple sources (CSV, JSON, API), and merges the results.
+ *
+ * @param dataURL - An array of file settings containing URLs, column configurations, and other settings.
+ * @param idColumnTitle - Optional title of the ID column to merge data sources by.
+ *
+ * @returns A promise that resolves to the merged data from all sources.
+ */
+export declare function fetchAndParseMultipleDataSources(dataURL: FileSettingsDataType[], idColumnTitle?: string): Promise<any[]>;
+//# sourceMappingURL=fetchAndParseData.d.ts.map

package/dist/Utils/fetchAndParseData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fetchAndParseData.d.ts","sourceRoot":"","sources":["../../src/Utils/fetchAndParseData.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,2BAA2B,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAcjF;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAsB,gBAAgB,CACpC,OAAO,EAAE,MAAM,EACf,kBAAkB,CAAC,EAAE,MAAM,EAC3B,cAAc,CAAC,EAAE,2BAA2B,EAAE,EAC9C,SAAS,CAAC,EAAE,OAAO,EACnB,SAAS,CAAC,EAAE,MAAM,EAClB,MAAM,CAAC,EAAE,OAAO,oBA4BjB;AACD;;;;;;;;;;;GAWG;AACH,wBAAsB,4BAA4B,CAChD,IAAI,EAAE,MAAM,EACZ,kBAAkB,CAAC,EAAE,MAAM,EAC3B,cAAc,CAAC,EAAE,2BAA2B,EAAE,EAC9C,SAAS,CAAC,EAAE,OAAO,EACnB,SAAS,CAAC,EAAE,MAAM,EAClB,MAAM,CAAC,EAAE,OAAO,oBA0BjB;AACD;;;;;;;;;GASG;AACH,wBAAsB,iBAAiB,CACrC,OAAO,EAAE,MAAM,EACf,cAAc,CAAC,EAAE,2BAA2B,EAAE,EAC9C,kBAAkB,CAAC,EAAE,MAAM,EAC3B,SAAS,CAAC,EAAE,OAAO,gBA0BpB;AACD;;;;;;;;;;GAUG;AACH,wBAAsB,4BAA4B,CAChD,UAAU,EAAE,MAAM,EAElB,OAAO,CAAC,EAAE,GAAG,EACb,cAAc,CAAC,EAAE,2BAA2B,EAAE,EAC9C,kBAAkB,CAAC,EAAE,MAAM,EAC3B,SAAS,CAAC,EAAE,OAAO,gBA0BpB;AACD;;;;;;;GAOG;AACH,wBAAsB,gCAAgC,CACpD,OAAO,EAAE,oBAAoB,EAAE,EAC/B,aAAa,CAAC,EAAE,MAAM,kBAiCvB"}

package/dist/Utils/generateCodes.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Represents a parameter to be embedded in a URL.
+ */
+interface ParamsProps {
+    id: string;
+    value: string | boolean | number | string[] | number[];
+}
+/**
+ * Generates an embed link with custom query parameters.
+ * @param link - The base URL.
+ * @param params - An array of parameters to append.
+ * @returns A URL string with encoded query parameters.
+ */
+export declare function generateEmbedLink(link: string, params: ParamsProps[]): string;
+/**
+ * Generates an iframe HTML string using a base link and parameters.
+ * @param link - The base URL.
+ * @param params - Parameters to convert into query string.
+ * @returns A string of iframe HTML.
+ */
+export declare function generateIframeCode(link: string, params: ParamsProps[]): string;
+export {};
+//# sourceMappingURL=generateCodes.d.ts.map

package/dist/Utils/generateCodes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateCodes.d.ts","sourceRoot":"","sources":["../../src/Utils/generateCodes.ts"],"names":[],"mappings":"AAaA;;GAEG;AACH,UAAU,WAAW;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC;CACxD;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,UAoBpE;AAED;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,UAKrE"}