@undp/data-viz 2.5.4 → 2.6.1

package/dist/SparkLine.js

@@ -1,295 +1,2 @@
-import { c as wt, m as Mt, j as i } from "./index-CHPV5EwG-BzibaIRc.js";
-import { useState as ut, useRef as bt, useEffect as Dt } from "react";
-import { f as _t, p as St } from "./parse-Dv4of-PN.js";
-import { o as At } from "./index-BZQYSqar.js";
-import { T as Nt } from "./Tooltip-3EYDVa3w.js";
-import { c as $t } from "./checkIfNullOrUndefined-DmfiKkNw.js";
-import { t as kt } from "./time-vyz6Y89P.js";
-import { a as Ot } from "./linear-DNXM5Pdl.js";
-import { a as Gt } from "./area-B6r7cv2o.js";
-import { c as Ht, l as Rt } from "./line-DFlZsxI1.js";
-import { c as Et, s as Ft, a as It, m as Lt } from "./step-BrDul-H4.js";
-import { s as Pt } from "./select-DKy99ogv.js";
-import { a as Tt } from "./init-BhZylTFx.js";
-import { p as Wt } from "./pointer-CWRWOsrb.js";
-import { GraphFooter as Yt } from "./GraphFooter.js";
-import { GraphHeader as Bt } from "./GraphHeader.js";
-import { Colors as Vt } from "./Colors.js";
-import { g as Xt } from "./generateRandomString-za3IQGfQ.js";
-import { a as zt, G as Ut } from "./GraphContainer-B8ZqOzKI.js";
-function qt(e) {
-  const t = wt.c(71), {
-    data: b,
-    width: S,
-    height: W,
-    lineColor: l,
-    dateFormat: a,
-    areaId: $,
-    leftMargin: c,
-    rightMargin: A,
-    topMargin: ot,
-    bottomMargin: rt,
-    tooltip: N,
-    onSeriesMouseOver: Y,
-    minValue: B,
-    maxValue: V,
-    curveType: X,
-    styles: k,
-    classNames: w,
-    customLayers: j
-  } = e, it = X === "linear" ? Ht : X === "step" ? Et : X === "stepAfter" ? Ft : X === "stepBefore" ? It : Lt, [u, nt] = ut(void 0), [O, at] = ut(void 0), [z, lt] = ut(void 0);
-  let U;
-  t[0] !== rt || t[1] !== c || t[2] !== A || t[3] !== ot ? (U = {
-    top: ot,
-    bottom: rt,
-    left: c,
-    right: A
-  }, t[0] = rt, t[1] = c, t[2] = A, t[3] = ot, t[4] = U) : U = t[4];
-  const D = U, G = bt(null);
-  let q;
-  t[5] !== a ? (q = (d) => ({
-    ...d,
-    date: St(`${d.date}`, a, /* @__PURE__ */ new Date())
-  }), t[5] = a, t[6] = q) : q = t[6];
-  const o = At(b.map(q), ["date"], ["asc"]), r = S - D.left - D.right, n = W - D.top - D.bottom, ct = o[0].date, mt = o[o.length - 1].date, J = Math.min(...o.map(me).filter(ce)) !== 1 / 0 ? Math.min(...o.map(le).filter(ae)) > 0 ? 0 : Math.min(...o.map(se).filter(ne)) : 0, H = Math.max(...o.map(ie).filter(re)) !== 1 / 0 ? Math.max(...o.map(oe).filter(ee)) : 0, s = kt().domain([ct, mt]).range([0, r]);
-  let R;
-  t[7] !== J || t[8] !== B ? (R = $t(B) ? J : B, t[7] = J, t[8] = B, t[9] = R) : R = t[9];
-  let E;
-  t[10] !== H || t[11] !== V ? (E = $t(V) ? H > 0 ? H : 0 : V, t[10] = H, t[11] = V, t[12] = E) : E = t[12];
-  const F = Ot().domain([R, E]).range([n, 0]).nice(), st = Gt().x((d) => s(d.date)).y1((d) => F(d.y)).y0(n).curve(it), pt = Rt().x((d) => s(d.date)).y((d) => F(d.y)).curve(it);
-  Dt(() => {
-    const d = (yt) => {
-      const jt = o[Tt(o.map(te), s.invert(Wt(yt)[0]), 0)];
-      nt(jt || o[o.length - 1]), Y?.(jt || o[o.length - 1]), lt(yt.clientY), at(yt.clientX);
-    }, Ct = () => {
-      nt(void 0), Y?.(void 0), at(void 0), lt(void 0);
-    };
-    Pt(G.current).on("mousemove", d).on("mouseout", Ct), Y?.(void 0);
-  }, [s, o, Y]);
-  let I;
-  t[13] !== $ || t[14] !== l ? (I = $ ? /* @__PURE__ */ i.jsxs("linearGradient", { id: $, x1: "0", x2: "0", y1: "0", y2: "1", children: [
-    /* @__PURE__ */ i.jsx("stop", { style: {
-      stopColor: l
-    }, stopOpacity: "0.1", offset: "0%" }),
-    /* @__PURE__ */ i.jsx("stop", { style: {
-      stopColor: l
-    }, stopOpacity: "0", offset: "100%" })
-  ] }) : null, t[13] = $, t[14] = l, t[15] = I) : I = t[15];
-  let L;
-  t[16] !== j ? (L = j.filter(Zt).map(Qt), t[16] = j, t[17] = L) : L = t[17];
-  const K = w?.xAxis?.labels;
-  let h;
-  t[18] !== K ? (h = Mt("xs:max-[360px]:hidden fill-primary-gray-700 dark:fill-primary-gray-300 text-[9px] md:text-[10px] lg:text-xs", K), t[18] = K, t[19] = h) : h = t[19];
-  const Q = o[o.length - 1];
-  let g;
-  t[20] !== Q.date || t[21] !== s ? (g = s(Q.date), t[20] = Q.date, t[21] = s, t[22] = g) : g = t[22];
-  const ft = k?.xAxis?.labels;
-  let x;
-  t[23] !== ft ? (x = {
-    textAnchor: "end",
-    ...ft
-  }, t[23] = ft, t[24] = x) : x = t[24];
-  const dt = o[o.length - 1];
-  let M;
-  t[25] !== a || t[26] !== dt.date ? (M = _t(dt.date, a), t[25] = a, t[26] = dt.date, t[27] = M) : M = t[27];
-  let C;
-  t[28] !== n || t[29] !== x || t[30] !== M || t[31] !== h || t[32] !== g ? (C = /* @__PURE__ */ i.jsx("text", { className: h, y: n, x: g, style: x, dy: "1em", children: M }), t[28] = n, t[29] = x, t[30] = M, t[31] = h, t[32] = g, t[33] = C) : C = t[33];
-  let v;
-  t[34] !== o || t[35] !== s ? (v = s(o[0].date), t[34] = o, t[35] = s, t[36] = v) : v = t[36];
-  const P = k?.xAxis?.labels;
-  let _;
-  t[37] !== P ? (_ = {
-    textAnchor: "start",
-    ...P
-  }, t[37] = P, t[38] = _) : _ = t[38];
-  const Z = w?.xAxis?.labels;
-  let m;
-  t[39] !== Z ? (m = Mt("xs:max-[360px]:hidden fill-primary-gray-700 dark:fill-primary-gray-300 text-[9px] md:text-[10px] lg:text-xs", Z), t[39] = Z, t[40] = m) : m = t[40];
-  let p;
-  t[41] !== o || t[42] !== a ? (p = _t(o[0].date, a), t[41] = o, t[42] = a, t[43] = p) : p = t[43];
-  let f;
-  t[44] !== n || t[45] !== v || t[46] !== _ || t[47] !== m || t[48] !== p ? (f = /* @__PURE__ */ i.jsx("text", { y: n, x: v, style: _, className: m, dy: "1em", children: p }), t[44] = n, t[45] = v, t[46] = _, t[47] = m, t[48] = p, t[49] = f) : f = t[49];
-  let y;
-  t[50] !== C || t[51] !== f ? (y = /* @__PURE__ */ i.jsxs("g", { children: [
-    C,
-    f
-  ] }), t[50] = C, t[51] = f, t[52] = y) : y = t[52];
-  const T = `url(#${$})`;
-  let tt;
-  t[53] !== T ? (tt = {
-    fill: T,
-    clipPath: "url(#clip)"
-  }, t[53] = T, t[54] = tt) : tt = t[54];
-  let et;
-  t[55] !== l ? (et = {
-    stroke: l,
-    fill: "none",
-    strokeWidth: 2
-  }, t[55] = l, t[56] = et) : et = t[56];
-  let ht;
-  t[57] !== j ? (ht = j.filter(Kt).map(Jt), t[57] = j, t[58] = ht) : ht = t[58];
-  let gt;
-  t[59] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (gt = {
-    fill: "none",
-    pointerEvents: "all"
-  }, t[59] = gt) : gt = t[59];
-  let xt;
-  t[60] !== G || t[61] !== n || t[62] !== r ? (xt = /* @__PURE__ */ i.jsx("rect", { ref: G, style: gt, width: r, height: n }), t[60] = G, t[61] = n, t[62] = r, t[63] = xt) : xt = t[63];
-  let vt;
-  return t[64] !== w?.tooltip || t[65] !== O || t[66] !== z || t[67] !== u || t[68] !== k?.tooltip || t[69] !== N ? (vt = u && N && O && z ? /* @__PURE__ */ i.jsx(Nt, { data: u, body: N, xPos: O, yPos: z, backgroundStyle: k?.tooltip, className: w?.tooltip }) : null, t[64] = w?.tooltip, t[65] = O, t[66] = z, t[67] = u, t[68] = k?.tooltip, t[69] = N, t[70] = vt) : vt = t[70], /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
-    /* @__PURE__ */ i.jsxs("svg", { width: `${S}px`, height: `${W}px`, viewBox: `0 0 ${S} ${W}`, direction: "ltr", children: [
-      I,
-      /* @__PURE__ */ i.jsxs("g", { transform: `translate(${D.left},${D.top})`, children: [
-        L,
-        y,
-        /* @__PURE__ */ i.jsxs("g", { children: [
-          /* @__PURE__ */ i.jsx("path", { d: st(o) || "", style: tt }),
-          /* @__PURE__ */ i.jsx("path", { d: pt(o) || "", style: et }),
-          u ? /* @__PURE__ */ i.jsx("circle", { y1: 0, cy: F(u.y), cx: s(u.date), r: 5, style: {
-            fill: l
-          } }) : null
-        ] }),
-        ht,
-        xt
-      ] })
-    ] }),
-    vt
-  ] });
-}
-function Jt(e) {
-  return e.layer;
-}
-function Kt(e) {
-  return e.position === "after";
-}
-function Qt(e) {
-  return e.layer;
-}
-function Zt(e) {
-  return e.position === "before";
-}
-function te(e) {
-  return e.date;
-}
-function ee(e) {
-  return e != null;
-}
-function oe(e) {
-  return e.y;
-}
-function re(e) {
-  return e != null;
-}
-function ie(e) {
-  return e.y;
-}
-function ne(e) {
-  return e != null;
-}
-function se(e) {
-  return e.y;
-}
-function ae(e) {
-  return e != null;
-}
-function le(e) {
-  return e.y;
-}
-function ce(e) {
-  return e != null;
-}
-function me(e) {
-  return e.y;
-}
-function Re(e) {
-  const t = wt.c(60), {
-    data: b,
-    graphTitle: S,
-    lineColor: W,
-    sources: l,
-    graphDescription: a,
-    height: $,
-    width: c,
-    footNote: A,
-    dateFormat: ot,
-    area: rt,
-    padding: N,
-    backgroundColor: Y,
-    leftMargin: B,
-    rightMargin: V,
-    topMargin: X,
-    bottomMargin: k,
-    tooltip: w,
-    relativeHeight: j,
-    onSeriesMouseOver: it,
-    graphID: u,
-    minValue: nt,
-    maxValue: O,
-    graphDownload: at,
-    dataDownload: z,
-    language: lt,
-    minHeight: U,
-    theme: D,
-    ariaLabel: G,
-    curveType: q,
-    styles: o,
-    classNames: r,
-    customLayers: n
-  } = e, ct = ot === void 0 ? "yyyy" : ot, mt = rt === void 0 ? !1 : rt, J = Y === void 0 ? !0 : Y, H = B === void 0 ? 5 : B, s = V === void 0 ? 5 : V, R = X === void 0 ? 10 : X, E = k === void 0 ? 20 : k, F = at === void 0 ? !1 : at, st = z === void 0 ? !1 : z, pt = lt === void 0 ? "en" : lt, I = U === void 0 ? 0 : U, L = D === void 0 ? "light" : D, K = q === void 0 ? "curve" : q;
-  let h;
-  t[0] !== n ? (h = n === void 0 ? [] : n, t[0] = n, t[1] = h) : h = t[1];
-  const Q = h, [g, ft] = ut(0), [x, dt] = ut(0), M = bt(null), C = bt(null);
-  let v, P;
-  t[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (v = () => {
-    const tt = new ResizeObserver((et) => {
-      ft(et[0].target.clientWidth || 620), dt(et[0].target.clientHeight || 480);
-    });
-    return M.current && tt.observe(M.current), () => tt.disconnect();
-  }, P = [], t[2] = v, t[3] = P) : (v = t[2], P = t[3]), Dt(v, P);
-  const _ = r?.graphContainer, Z = o?.graphContainer;
-  let m;
-  t[4] !== r?.description || t[5] !== r?.title || t[6] !== b || t[7] !== st || t[8] !== a || t[9] !== F || t[10] !== S || t[11] !== o?.description || t[12] !== o?.title || t[13] !== c ? (m = S || a || F || st ? /* @__PURE__ */ i.jsx(Bt, { styles: {
-    title: o?.title,
-    description: o?.description
-  }, classNames: {
-    title: r?.title,
-    description: r?.description
-  }, graphTitle: S, graphDescription: a, width: c, graphDownload: F ? C : void 0, dataDownload: st ? b.map(he).filter(ue).length > 0 ? b.map(de).filter(fe) : b.filter(pe) : null }) : null, t[4] = r?.description, t[5] = r?.title, t[6] = b, t[7] = st, t[8] = a, t[9] = F, t[10] = S, t[11] = o?.description, t[12] = o?.title, t[13] = c, t[14] = m) : m = t[14];
-  let p;
-  t[15] !== mt || t[16] !== E || t[17] !== r || t[18] !== K || t[19] !== Q || t[20] !== b || t[21] !== ct || t[22] !== H || t[23] !== W || t[24] !== O || t[25] !== nt || t[26] !== it || t[27] !== s || t[28] !== o || t[29] !== x || t[30] !== g || t[31] !== w || t[32] !== R ? (p = g && x ? /* @__PURE__ */ i.jsx(qt, { data: b, lineColor: W || Vt.primaryColors["blue-600"], width: g, height: x, dateFormat: ct, areaId: mt ? Xt(8) : void 0, leftMargin: H, rightMargin: s, topMargin: R, bottomMargin: E, tooltip: w, onSeriesMouseOver: it, minValue: nt, maxValue: O, curveType: K, styles: o, classNames: r, customLayers: Q }) : null, t[15] = mt, t[16] = E, t[17] = r, t[18] = K, t[19] = Q, t[20] = b, t[21] = ct, t[22] = H, t[23] = W, t[24] = O, t[25] = nt, t[26] = it, t[27] = s, t[28] = o, t[29] = x, t[30] = g, t[31] = w, t[32] = R, t[33] = p) : p = t[33];
-  let f;
-  t[34] !== p ? (f = /* @__PURE__ */ i.jsx(zt, { ref: M, children: p }), t[34] = p, t[35] = f) : f = t[35];
-  let y;
-  t[36] !== r?.footnote || t[37] !== r?.source || t[38] !== A || t[39] !== l || t[40] !== o?.footnote || t[41] !== o?.source || t[42] !== c ? (y = l || A ? /* @__PURE__ */ i.jsx(Yt, { styles: {
-    footnote: o?.footnote,
-    source: o?.source
-  }, classNames: {
-    footnote: r?.footnote,
-    source: r?.source
-  }, sources: l, footNote: A, width: c }) : null, t[36] = r?.footnote, t[37] = r?.source, t[38] = A, t[39] = l, t[40] = o?.footnote, t[41] = o?.source, t[42] = c, t[43] = y) : y = t[43];
-  let T;
-  return t[44] !== G || t[45] !== J || t[46] !== u || t[47] !== $ || t[48] !== pt || t[49] !== I || t[50] !== N || t[51] !== j || t[52] !== _ || t[53] !== Z || t[54] !== m || t[55] !== f || t[56] !== y || t[57] !== L || t[58] !== c ? (T = /* @__PURE__ */ i.jsxs(Ut, { className: _, style: Z, id: u, ref: C, "aria-label": G, backgroundColor: J, theme: L, language: pt, minHeight: I, width: c, height: $, relativeHeight: j, padding: N, children: [
-    m,
-    f,
-    y
-  ] }), t[44] = G, t[45] = J, t[46] = u, t[47] = $, t[48] = pt, t[49] = I, t[50] = N, t[51] = j, t[52] = _, t[53] = Z, t[54] = m, t[55] = f, t[56] = y, t[57] = L, t[58] = c, t[59] = T) : T = t[59], T;
-}
-function pe(e) {
-  return e !== void 0;
-}
-function fe(e) {
-  return e !== void 0;
-}
-function de(e) {
-  return e.data;
-}
-function ue(e) {
-  return e !== void 0;
-}
-function he(e) {
-  return e.data;
-}
-export {
-  Re as SparkLine
-};
-//# sourceMappingURL=SparkLine.js.map
+import { t as e } from "./SparkLine-DTNx2kjz.js";
+export { e as SparkLine };

package/dist/StackedAreaChart-CtlLKKP4.js

@@ -0,0 +1,381 @@
+import { o as e } from "./chunk-foFoljWS.js";
+import { t } from "./jsx-runtime-C76bEyh7.js";
+import { Colors as n } from "./Colors.js";
+import { ColorLegend as r } from "./ColorLegend.js";
+import { GraphFooter as ee } from "./GraphFooter.js";
+import { GraphHeader as i } from "./GraphHeader.js";
+import { t as a } from "./checkIfNullOrUndefined-C5gqSAtF.js";
+import { t as o } from "./lodash.sum-CX6zs3_n.js";
+import { n as te, t as s } from "./GraphContainer-DgEB1AVN.js";
+import { n as c, t as l } from "./parse-5MWhaq6h.js";
+import { t as u } from "./lodash.orderby-Dn2sr3tw.js";
+import { t as ne } from "./EmptyState-DBmT1Adf.js";
+import { n as d } from "./init-CT6uqW57.js";
+import { t as f } from "./linear-BkosG4OK.js";
+import { t as re } from "./time-BSWvT9ln.js";
+import { t as p } from "./proxy-BiRrIImK.js";
+import { t as ie } from "./AnimatePresence-CE6xBsMZ.js";
+import { t as ae } from "./use-in-view-CjlKdln1.js";
+import { t as oe } from "./Axis-B3ai1eeP.js";
+import { t as se } from "./AxisTitle-DqJw_G-f.js";
+import { t as ce } from "./numberFormattingFunction-Cha8dhHc.js";
+import { t as le } from "./XTicksAndGridLines-B2XZgwzW.js";
+import { t as ue } from "./YTicksAndGridLines-CVTzNJYP.js";
+import { n as de } from "./ReferenceLine-C8owKJx1.js";
+import { t as fe } from "./Tooltip-Y6uTGwkF.js";
+import { i as pe } from "./line-6wslDyQb.js";
+import { t as me } from "./area-BLagdTXz.js";
+import { i as he, n as m, r as ge, t as h } from "./step-Bxl4gFpO.js";
+import { t as _e } from "./select-0Z0HV7nm.js";
+import { t as g } from "./pointer-CoEekBJE.js";
+import { n as _, r as ve, t as v } from "./getLineEndPoint-BkKmq-KI.js";
+import { t as y } from "./HighlightArea-BljOOgRP.js";
+import { cn as b } from "@undp/design-system-react/cn";
+import { useEffect as ye, useRef as x, useState as S } from "react";
+//#region src/Components/Graphs/StackedAreaChart/Graph.tsx
+var C = /* @__PURE__ */ e(u(), 1), w = /* @__PURE__ */ e(o(), 1), T = t();
+function E(e) {
+	let { data: t, width: n, height: r, colors: ee, dateFormat: i, noOfXTicks: o, rightMargin: te, leftMargin: s, topMargin: u, bottomMargin: ne, yAxisTitle: E, tooltip: D, onSeriesMouseOver: O, highlightAreaSettings: be, refValues: xe, minValue: k, maxValue: A, rtl: j, annotations: M, customHighlightAreaSettings: N, noOfYTicks: P, prefix: F, suffix: I, curveType: L, styles: R, classNames: z, precision: B, customLayers: Se, animate: V, locale: H, padZeros: U } = e, Ce = x(null), W = ae(Ce, {
+		once: V.once,
+		amount: V.amount
+	}), we = L === "linear" ? pe : L === "step" ? ge : L === "stepAfter" ? h : L === "stepBefore" ? m : he, [G, Te] = S(void 0), [Ee, De] = S(void 0), [Oe, ke] = S(void 0), K = {
+		top: u,
+		bottom: ne,
+		left: E ? s + 30 : s,
+		right: te
+	}, Ae = x(null), q = (0, C.default)(t.map((e) => ({
+		...e,
+		date: l(`${e.date}`, i, /* @__PURE__ */ new Date())
+	})), ["date"], ["asc"]), je = be.map((e) => ({
+		...e,
+		coordinates: [e.coordinates[0] === null ? null : l(`${e.coordinates[0]}`, i, /* @__PURE__ */ new Date()), e.coordinates[1] === null ? null : l(`${e.coordinates[1]}`, i, /* @__PURE__ */ new Date())]
+	})), Me = N.map((e) => ({
+		...e,
+		coordinates: e.coordinates.map((e, t) => t % 2 == 0 ? l(`${e}`, i, /* @__PURE__ */ new Date()) : e)
+	})), Ne = q[0].y.map((e, t) => q.map((e) => ({
+		date: e.date,
+		y0: t === 0 ? 0 : (0, w.default)(e.y.filter((e, n) => n < t)),
+		y1: (0, w.default)(e.y.filter((e, n) => n <= t))
+	}))), J = n - K.left - K.right, Y = r - K.top - K.bottom, Pe = q[0].date, Fe = q[q.length - 1].date, X = a(k) ? 0 : k, Ie = a(A) ? Math.max(...t.map((e) => (0, w.default)(e.y) || 0)) : A, Z = re().domain([Pe, Fe]).range([0, J]), Q = f().domain([X, Ie]).range([Y, 0]).nice(), $ = me().x((e) => Z(e.date)).y0((e) => Q(e.y0)).y1((e) => Q(e.y1)).curve(we), Le = Q.ticks(P), Re = Z.ticks(o);
+	return ye(() => {
+		_e(Ae.current).on("mousemove", (e) => {
+			let t = q[d(q.map((e) => e.date), Z.invert(g(e)[0]), 0)];
+			Te(t || q[q.length - 1]), O?.(t || q[q.length - 1]), ke(e.clientY), De(e.clientX);
+		}).on("mouseout", () => {
+			Te(void 0), De(void 0), ke(void 0), O?.(void 0);
+		}), O?.(void 0);
+	}, [
+		Z,
+		q,
+		O
+	]), /* @__PURE__ */ (0, T.jsxs)(T.Fragment, { children: [/* @__PURE__ */ (0, T.jsx)(p.svg, {
+		width: `${n}px`,
+		height: `${r}px`,
+		viewBox: `0 0 ${n} ${r}`,
+		direction: "ltr",
+		ref: Ce,
+		children: /* @__PURE__ */ (0, T.jsx)(ie, { children: /* @__PURE__ */ (0, T.jsxs)(p.g, {
+			transform: `translate(${K.left},${K.top})`,
+			children: [
+				/* @__PURE__ */ (0, T.jsx)(y, {
+					areaSettings: je,
+					width: J,
+					height: Y,
+					scale: Z,
+					animate: V,
+					isInView: W
+				}),
+				/* @__PURE__ */ (0, T.jsx)(_, {
+					animate: V,
+					areaSettings: Me,
+					scaleX: Z,
+					scaleY: Q,
+					isInView: W
+				}),
+				/* @__PURE__ */ (0, T.jsxs)("g", { children: [
+					/* @__PURE__ */ (0, T.jsx)(ue, {
+						values: Le.filter((e) => e !== 0),
+						y: Le.filter((e) => e !== 0).map((e) => Q(e)),
+						x1: 0 - s,
+						x2: J + K.right,
+						styles: {
+							gridLines: R?.yAxis?.gridLines,
+							labels: R?.yAxis?.labels
+						},
+						classNames: {
+							gridLines: z?.yAxis?.gridLines,
+							labels: z?.yAxis?.labels
+						},
+						suffix: I,
+						prefix: F,
+						labelType: "secondary",
+						showGridLines: !0,
+						labelPos: "vertical",
+						precision: B,
+						locale: H,
+						padZeros: U
+					}),
+					/* @__PURE__ */ (0, T.jsx)(oe, {
+						y1: Q(X < 0 ? 0 : X),
+						y2: Q(X < 0 ? 0 : X),
+						x1: 0 - s,
+						x2: J + K.right,
+						label: ce(X < 0 ? 0 : X, void 0, B, F, I, H, U),
+						labelPos: {
+							x: 0 - s,
+							dx: 0,
+							dy: Ie < 0 ? "1em" : -5,
+							y: Q(X < 0 ? 0 : X)
+						},
+						classNames: {
+							axis: z?.xAxis?.axis,
+							label: z?.yAxis?.labels
+						},
+						styles: {
+							axis: R?.xAxis?.axis,
+							label: R?.yAxis?.labels
+						}
+					}),
+					/* @__PURE__ */ (0, T.jsx)(se, {
+						x: 0 - s - 15,
+						y: Y / 2,
+						style: R?.yAxis?.title,
+						className: z?.yAxis?.title,
+						text: E,
+						rotate90: !0
+					})
+				] }),
+				/* @__PURE__ */ (0, T.jsx)(le, {
+					values: Re.map((e) => c(e, i)),
+					x: Re.map((e) => Z(e)),
+					y1: 0,
+					y2: Y,
+					styles: {
+						gridLines: R?.xAxis?.gridLines,
+						labels: R?.xAxis?.labels
+					},
+					classNames: {
+						gridLines: b("opacity-0", z?.xAxis?.gridLines),
+						labels: b("fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[8px] sm:text-[9px] md:text-[10px] lg:text-xs", z?.xAxis?.labels)
+					},
+					suffix: I,
+					prefix: F,
+					labelType: "primary",
+					showGridLines: !0,
+					precision: B,
+					locale: H,
+					padZeros: U
+				}),
+				Se.filter((e) => e.position === "before").map((e) => e.layer),
+				/* @__PURE__ */ (0, T.jsxs)(p.g, { children: [Ne.map((e, t) => /* @__PURE__ */ (0, T.jsx)(p.path, {
+					d: $(e),
+					exit: {
+						opacity: 0,
+						transition: { duration: V.duration }
+					},
+					variants: {
+						initial: {
+							d: $(e.map((e) => ({
+								...e,
+								y0: 0,
+								y1: 0
+							}))),
+							opacity: 0
+						},
+						whileInView: {
+							d: $(e),
+							opacity: 1,
+							transition: { duration: V.duration }
+						}
+					},
+					initial: "initial",
+					animate: W ? "whileInView" : "initial",
+					style: {
+						fill: ee[t],
+						opacity: .8
+					}
+				}, t)), G ? /* @__PURE__ */ (0, T.jsx)("line", {
+					y1: 0,
+					y2: Y,
+					x1: Z(G.date),
+					x2: Z(G.date),
+					className: b("undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100", z?.mouseOverLine),
+					style: R?.mouseOverLine
+				}) : null] }),
+				xe?.map((e) => /* @__PURE__ */ (0, T.jsx)(de, {
+					text: e.text,
+					color: e.color,
+					y: Q(e.value),
+					x1: 0 - s,
+					x2: J + K.right,
+					classNames: e.classNames,
+					styles: e.styles,
+					animate: V,
+					isInView: W
+				}, e.text)),
+				/* @__PURE__ */ (0, T.jsx)("g", { children: M.map((e) => {
+					let t = v({
+						x: e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) + (e.xOffset || 0) : 0 + (e.xOffset || 0),
+						y: e.yCoordinate ? Q(e.yCoordinate) + (e.yOffset || 0) - 8 : 0 + (e.yOffset || 0) - 8
+					}, {
+						x: e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) : 0,
+						y: e.yCoordinate ? Q(e.yCoordinate) : 0
+					}, a(e.connectorRadius) ? 3.5 : e.connectorRadius), n = e.showConnector ? {
+						y1: t.y,
+						x1: t.x,
+						y2: e.yCoordinate ? Q(e.yCoordinate) + (e.yOffset || 0) : 0 + (e.yOffset || 0),
+						x2: e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) + (e.xOffset || 0) : 0 + (e.xOffset || 0),
+						cx: e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) : 0,
+						cy: e.yCoordinate ? Q(e.yCoordinate) : 0,
+						circleRadius: a(e.connectorRadius) ? 3.5 : e.connectorRadius,
+						strokeWidth: e.showConnector === !0 ? 2 : Math.min(e.showConnector || 0, 1)
+					} : void 0, r = {
+						y: e.yCoordinate ? Q(e.yCoordinate) + (e.yOffset || 0) - 8 : 0 + (e.yOffset || 0) - 8,
+						x: j ? 0 : e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) + (e.xOffset || 0) : 0 + (e.xOffset || 0),
+						width: j ? e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) + (e.xOffset || 0) : 0 + (e.xOffset || 0) : J + K.right - (e.xCoordinate ? Z(l(`${e.xCoordinate}`, i, /* @__PURE__ */ new Date())) + (e.xOffset || 0) : 0 + (e.xOffset || 0)),
+						maxWidth: e.maxWidth,
+						fontWeight: e.fontWeight,
+						align: e.align
+					};
+					return /* @__PURE__ */ (0, T.jsx)(ve, {
+						color: e.color,
+						connectorsSettings: n,
+						labelSettings: r,
+						text: e.text,
+						classNames: e.classNames,
+						styles: e.styles,
+						animate: V,
+						isInView: W
+					}, e.text);
+				}) }),
+				Se.filter((e) => e.position === "after").map((e) => e.layer),
+				/* @__PURE__ */ (0, T.jsx)("rect", {
+					ref: Ae,
+					style: {
+						fill: "none",
+						pointerEvents: "all"
+					},
+					width: J,
+					height: Y
+				})
+			]
+		}) })
+	}), G && D && Ee && Oe ? /* @__PURE__ */ (0, T.jsx)(fe, {
+		data: G,
+		body: D,
+		xPos: Ee,
+		yPos: Oe,
+		backgroundStyle: R?.tooltip,
+		className: z?.tooltip
+	}) : null] });
+}
+//#endregion
+//#region src/Components/Graphs/StackedAreaChart/index.tsx
+function D(e) {
+	let { data: t, graphTitle: a, colors: o = n.light.categoricalColors.colors, sources: c, graphDescription: l, height: u, width: d, footNote: f, noOfXTicks: re = 10, dateFormat: p = "yyyy", colorDomain: ie, padding: ae, backgroundColor: oe = !1, colorLegendTitle: se, leftMargin: ce = 50, rightMargin: le = 20, topMargin: ue = 20, bottomMargin: de = 25, highlightAreaSettings: fe = [], tooltip: pe, relativeHeight: me, onSeriesMouseOver: he, refValues: m = [], graphID: ge, minValue: h, maxValue: _e, graphDownload: g = !1, dataDownload: _ = !1, showColorScale: ve = !0, language: v = "en", minHeight: y = 0, annotations: b = [], customHighlightAreaSettings: C = [], theme: w = "light", ariaLabel: D, yAxisTitle: O, noOfYTicks: be = 5, curveType: xe = "curve", styles: k, classNames: A, customLayers: j = [], animate: M = !1, numberDisplayOptions: N } = e, [P, F] = S(0), [I, L] = S(0), R = x(null), z = x(null);
+	return ye(() => {
+		let e = new ResizeObserver((e) => {
+			F(e[0].target.clientWidth || 620), L(e[0].target.clientHeight || 480);
+		});
+		return R.current && e.observe(R.current), () => e.disconnect();
+	}, []), /* @__PURE__ */ (0, T.jsxs)(te, {
+		className: A?.graphContainer,
+		style: k?.graphContainer,
+		id: ge,
+		ref: z,
+		"aria-label": D,
+		backgroundColor: oe,
+		theme: w,
+		language: v,
+		minHeight: y,
+		width: d,
+		height: u,
+		relativeHeight: me,
+		padding: ae,
+		children: [
+			a || l || g || _ ? /* @__PURE__ */ (0, T.jsx)(i, {
+				styles: {
+					title: k?.title,
+					description: k?.description
+				},
+				classNames: {
+					title: A?.title,
+					description: A?.description
+				},
+				graphTitle: a,
+				graphDescription: l,
+				width: d,
+				graphDownload: g ? z : void 0,
+				dataDownload: _ ? 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,
+			ve !== !1 && t.length > 0 ? /* @__PURE__ */ (0, T.jsx)(r, {
+				colorDomain: ie,
+				colors: o,
+				colorLegendTitle: se,
+				showNAColor: !1,
+				className: A?.colorLegend
+			}) : null,
+			/* @__PURE__ */ (0, T.jsxs)(s, {
+				ref: R,
+				children: [t.length === 0 && /* @__PURE__ */ (0, T.jsx)(ne, {}), P && I && t.length > 0 ? /* @__PURE__ */ (0, T.jsx)(E, {
+					data: t,
+					colors: o,
+					width: P,
+					height: I,
+					dateFormat: p,
+					noOfXTicks: re,
+					leftMargin: ce,
+					rightMargin: le,
+					topMargin: ue,
+					bottomMargin: de,
+					tooltip: pe,
+					onSeriesMouseOver: he,
+					highlightAreaSettings: fe,
+					refValues: m,
+					minValue: h,
+					maxValue: _e,
+					rtl: v === "he" || v === "ar",
+					annotations: b,
+					customHighlightAreaSettings: C,
+					yAxisTitle: O,
+					noOfYTicks: be,
+					curveType: xe,
+					styles: k,
+					classNames: A,
+					customLayers: j,
+					animate: M === !0 ? {
+						duration: .5,
+						once: !0,
+						amount: .5
+					} : M || {
+						duration: 0,
+						once: !0,
+						amount: 0
+					},
+					locale: N?.locale || "en",
+					padZeros: N?.padZeros || !1,
+					suffix: N?.suffix || "",
+					prefix: N?.prefix || "",
+					precision: N?.precision ?? 2
+				}) : null]
+			}),
+			c || f ? /* @__PURE__ */ (0, T.jsx)(ee, {
+				styles: {
+					footnote: k?.footnote,
+					source: k?.source
+				},
+				classNames: {
+					footnote: A?.footnote,
+					source: A?.source
+				},
+				sources: c,
+				footNote: f,
+				width: d
+			}) : null
+		]
+	});
+}
+//#endregion
+export { D as t };
+
+//# sourceMappingURL=StackedAreaChart-CtlLKKP4.js.map