@undp/data-viz 1.5.1 → 1.5.3

package/dist/MultiLineAltChart.js

@@ -1,8 +1,7 @@
 import { j as t, m as xe } from "./index-CHPV5EwG-BPSP-7Jg.js";
-import { useRef as ge, useState as G, useEffect as Me } from "react";
-import { u as ue } from "./index-AqnpA7_O.js";
+import { useRef as ge, useState as G, useEffect as $e } from "react";
 import { p as u, f as Ve } from "./parse-DlCRUFh_.js";
-import { s as $e } from "./index-fwdktvAS.js";
+import { o as Te } from "./index-DvVprvy6.js";
 import { n as Se } from "./numberFormattingFunction-14YCbkN2.js";
 import { T as He } from "./Tooltip-CVCGWyzw.js";
 import { c as x } from "./checkIfNullOrUndefined-DmfiKkNw.js";
@@ -14,21 +13,23 @@ import { R as Pe } from "./ReferenceLine-CfAW3vKJ.js";
 import { Y as Ee } from "./YTicksAndGridLines-B6ah7CRf.js";
 import { H as Ge } from "./index-DKCxu1Gh.js";
 import { Colors as T } from "./Colors.js";
-import { t as Be } from "./time-BzJP5SPC.js";
-import { a as ze } from "./linear-DUdu7l2G.js";
-import { D as qe } from "./delaunay-C1uAf38t.js";
-import { l as Ue, c as Je } from "./line-CPfhohvF.js";
-import { c as Ke, s as Qe, a as Ze, m as _e } from "./step-BrDul-H4.js";
-import { s as et } from "./select-DKy99ogv.js";
-import { a as tt } from "./init-BhZylTFx.js";
-import { p as it } from "./pointer-CWRWOsrb.js";
-import { u as ot } from "./use-in-view-yS6jzJAp.js";
+import { u as ue } from "./uniqBy-BHy4I8PK.js";
+import { s as Be } from "./sort-DfK1b0F5.js";
+import { c as ze, a as qe } from "./init-BhZylTFx.js";
+import { t as Ue } from "./time-BzJP5SPC.js";
+import { a as Je } from "./linear-DUdu7l2G.js";
+import { D as Ke } from "./delaunay-C1uAf38t.js";
+import { l as Qe, c as Ze } from "./line-CPfhohvF.js";
+import { c as _e, s as et, a as tt, m as it } from "./step-BrDul-H4.js";
+import { s as ot } from "./select-DKy99ogv.js";
+import { p as at } from "./pointer-CWRWOsrb.js";
+import { u as rt } from "./use-in-view-yS6jzJAp.js";
 import { m as E } from "./proxy-CkpFesk1.js";
-import { GraphFooter as at } from "./GraphFooter.js";
-import { GraphHeader as rt } from "./GraphHeader.js";
-import { E as nt } from "./EmptyState-DdTp-Mdn.js";
-import { ColorLegendWithMouseOver as st } from "./ColorLegendWithMouseOver.js";
-function lt(pe) {
+import { GraphFooter as nt } from "./GraphFooter.js";
+import { GraphHeader as st } from "./GraphHeader.js";
+import { E as lt } from "./EmptyState-DdTp-Mdn.js";
+import { ColorLegendWithMouseOver as ct } from "./ColorLegendWithMouseOver.js";
+function mt(pe) {
   const {
     data: n,
     width: S,
@@ -69,11 +70,11 @@ function lt(pe) {
     precision: M,
     naLabel: Ce,
     customLayers: ne
-  } = pe, se = ge(null), y = ot(se, {
+  } = pe, se = ge(null), y = rt(se, {
     once: a.once,
     amount: a.amount
   }), [A, Oe] = G(!1);
-  Me(() => {
+  $e(() => {
     if (y && !A) {
       const e = setTimeout(
         () => {
@@ -84,30 +85,26 @@ function lt(pe) {
       return () => clearTimeout(e);
     }
   }, [y, A, a.duration]);
-  const je = U === "linear" ? Je : U === "step" ? Ke : U === "stepAfter" ? Qe : U === "stepBefore" ? Ze : _e, l = $e(
+  const je = U === "linear" ? Ze : U === "step" ? _e : U === "stepAfter" ? et : U === "stepBefore" ? tt : it, l = Te(
     n.map((e) => ({
       ...e,
       date: u(`${e.date}`, f, /* @__PURE__ */ new Date())
     })),
-    "date"
-  ).filter((e) => !x(e.y)), Ae = ue(l, (e) => e.label).map((e) => e.label), Z = ue(
-    $e(
-      n.map((e) => ({
-        ...e,
-        date: u(`${e.date}`, f, /* @__PURE__ */ new Date())
-      })),
-      "date"
-    ),
-    (e) => e.date
-  ).map((e) => e.date), [g, d] = G(void 0), [N, Y] = G(void 0), [le, F] = G(void 0), w = {
+    ["date"],
+    ["asc"]
+  ).filter((e) => !x(e.y)), Ae = ue(l, "label", !0), Z = Be(
+    ue(n, "date", !0).map((e) => u(`${e}`, f, /* @__PURE__ */ new Date())),
+    (e, i) => ze(e, i)
+  ), [g, d] = G(void 0), [N, Y] = G(void 0), [le, F] = G(void 0), w = {
     top: de,
     bottom: B,
     left: oe ? O + 30 : O,
     right: _
   }, X = ge(null), ce = Ae.map(
-    (e) => $e(
-      l.filter((o) => o.label == e),
-      "date"
+    (e) => Te(
+      l.filter((i) => i.label == e),
+      ["date"],
+      ["asc"]
     )
   ), me = k.map((e) => ({
     ...e,
@@ -118,9 +115,9 @@ function lt(pe) {
   })), fe = ve.map((e) => ({
     ...e,
     coordinates: e.coordinates.map(
-      (o, m) => m % 2 === 0 ? u(`${o}`, f, /* @__PURE__ */ new Date()) : o
+      (i, m) => m % 2 === 0 ? u(`${i}`, f, /* @__PURE__ */ new Date()) : i
     )
-  })), v = S - w.left - w.right, V = K - w.top - w.bottom, P = ae ? u(`${ae}`, f, /* @__PURE__ */ new Date()) : Z[0], he = re ? u(`${re}`, f, /* @__PURE__ */ new Date()) : Z[Z.length - 1], i = x(z) ? Math.min(...l.map((e) => e.y).filter((e) => !x(e))) ? Math.min(
+  })), v = S - w.left - w.right, V = K - w.top - w.bottom, P = ae ? u(`${ae}`, f, /* @__PURE__ */ new Date()) : Z[0], he = re ? u(`${re}`, f, /* @__PURE__ */ new Date()) : Z[Z.length - 1], o = x(z) ? Math.min(...l.map((e) => e.y).filter((e) => !x(e))) ? Math.min(
     ...l.map((e) => e.y).filter((e) => !x(e))
   ) > 0 ? 0 : Math.min(
     ...l.map((e) => e.y).filter((e) => !x(e))
@@ -128,26 +125,26 @@ function lt(pe) {
     ...l.map((e) => e.y).filter((e) => !x(e))
   ) ? Math.max(
     ...l.map((e) => e.y).filter((e) => !x(e))
-  ) : 0, r = Be().domain([P, he]).range([0, v]), c = ze().domain([
-    x(z) ? i : z,
+  ) : 0, r = Ue().domain([P, he]).range([0, v]), c = Je().domain([
+    x(z) ? o : z,
     x(te) ? J > 0 ? J : 0 : te
-  ]).range([V, 0]).nice(), ke = qe.from(
+  ]).range([V, 0]).nice(), ke = Ke.from(
     l.filter((e) => !x(e.date) && !x(e.y)),
     (e) => r(e.date),
     (e) => c(e.y)
-  ).voronoi([0, 0, v < 0 ? 0 : v, V < 0 ? 0 : V]), De = Ue().x((e) => r(e.date)).y((e) => c(e.y)).curve(je), Ne = c.ticks(be), Te = r.ticks(ye);
-  return Me(() => {
+  ).voronoi([0, 0, v < 0 ? 0 : v, V < 0 ? 0 : V]), De = Qe().x((e) => r(e.date)).y((e) => c(e.y)).curve(je), Me = c.ticks(be), Ne = r.ticks(ye);
+  return $e(() => {
     const e = (m) => {
-      const H = l[tt(
+      const H = l[qe(
         l.map((Le) => Le.date),
-        r.invert(it(m)[0]),
+        r.invert(at(m)[0]),
         0
       )];
       d(H || l[l.length - 1]), F(m.clientY), Y(m.clientX), W?.(H || l[l.length - 1]);
-    }, o = () => {
+    }, i = () => {
       d(void 0), Y(void 0), F(void 0);
     };
-    et(X.current).on("mousemove", e).on("mouseout", o), W?.(void 0);
+    ot(X.current).on("mousemove", e).on("mouseout", i), W?.(void 0);
   }, [r, l, W]), /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
       E.svg,
@@ -183,8 +180,8 @@ function lt(pe) {
             /* @__PURE__ */ t.jsx(
               Ee,
               {
-                values: Ne.filter((e) => e !== 0),
-                y: Ne.filter((e) => e !== 0).map((e) => c(e)),
+                values: Me.filter((e) => e !== 0),
+                y: Me.filter((e) => e !== 0).map((e) => c(e)),
                 x1: 0 - O,
                 x2: v + w.right,
                 styles: {
@@ -206,12 +203,12 @@ function lt(pe) {
             /* @__PURE__ */ t.jsx(
               Fe,
               {
-                y1: c(i < 0 ? 0 : i),
-                y2: c(i < 0 ? 0 : i),
+                y1: c(o < 0 ? 0 : o),
+                y2: c(o < 0 ? 0 : o),
                 x1: 0 - O,
                 x2: v + w.right,
                 label: Se(
-                  i < 0 ? 0 : i,
+                  o < 0 ? 0 : o,
                   "NA",
                   M,
                   h,
@@ -219,7 +216,7 @@ function lt(pe) {
                 ),
                 labelPos: {
                   x: 0 - O,
-                  y: c(i < 0 ? 0 : i),
+                  y: c(o < 0 ? 0 : o),
                   dx: 0,
                   dy: J < 0 ? "1em" : -5
                 },
@@ -248,8 +245,8 @@ function lt(pe) {
           /* @__PURE__ */ t.jsx("g", { children: /* @__PURE__ */ t.jsx(
             Xe,
             {
-              values: Te.map((e) => Ve(e, f)),
-              x: Te.map((e) => r(e)),
+              values: Ne.map((e) => Ve(e, f)),
+              x: Ne.map((e) => r(e)),
               y1: 0,
               y2: V,
               styles: {
@@ -292,7 +289,7 @@ function lt(pe) {
                     E.path,
                     {
                       d: De(
-                        e.filter((o) => !x(o.y))
+                        e.filter((i) => !x(i.y))
                       ) || "",
                       style: {
                         fill: "none",
@@ -303,18 +300,18 @@ function lt(pe) {
                         initial: {
                           pathLength: 0,
                           d: De(
-                            e.filter((o) => !x(o.y))
+                            e.filter((i) => !x(i.y))
                           ) || "",
                           opacity: 1,
-                          stroke: n.filter((o) => o.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray
+                          stroke: n.filter((i) => i.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray
                         },
                         whileInView: {
                           pathLength: 1,
                           d: De(
-                            e.filter((o) => !x(o.y))
+                            e.filter((i) => !x(i.y))
                           ) || "",
                           opacity: 1,
-                          stroke: n.filter((o) => o.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray,
+                          stroke: n.filter((i) => i.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray,
                           transition: { duration: a.duration }
                         }
                       },
@@ -322,7 +319,7 @@ function lt(pe) {
                       animate: y ? "whileInView" : "initial"
                     }
                   ),
-                  e.map((o, m) => /* @__PURE__ */ t.jsx(E.g, { children: x(o.y) ? null : /* @__PURE__ */ t.jsx(t.Fragment, { children: q ? /* @__PURE__ */ t.jsx(
+                  e.map((i, m) => /* @__PURE__ */ t.jsx(E.g, { children: x(i.y) ? null : /* @__PURE__ */ t.jsx(t.Fragment, { children: q ? /* @__PURE__ */ t.jsx(
                     E.circle,
                     {
                       r: v / e.length < 5 ? 0 : v / e.length < 20 ? 2 : 4,
@@ -331,8 +328,8 @@ function lt(pe) {
                         initial: {
                           opacity: 0,
                           fill: n.filter((H) => H.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray,
-                          cx: r(o.date),
-                          cy: c(o.y)
+                          cx: r(i.date),
+                          cy: c(i.y)
                         },
                         whileInView: {
                           opacity: 1,
@@ -341,8 +338,8 @@ function lt(pe) {
                             duration: A ? a.duration : 0.5,
                             delay: A ? 0 : a.duration
                           },
-                          cx: r(o.date),
-                          cy: c(o.y)
+                          cx: r(i.date),
+                          cy: c(i.y)
                         }
                       },
                       initial: "initial",
@@ -353,7 +350,7 @@ function lt(pe) {
                     E.text,
                     {
                       style: {
-                        fill: n.filter((o) => o.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray
+                        fill: n.filter((i) => i.color).length === 0 ? s[0] : e[0].color ? s[C.indexOf(e[0].color)] : T.gray
                       },
                       className: "text-sm font-bold",
                       dx: 5,
@@ -399,7 +396,7 @@ function lt(pe) {
               }
             ) : null
           ] }),
-          l.filter((e) => !x(e.y)).map((e, o) => /* @__PURE__ */ t.jsx("g", { children: /* @__PURE__ */ t.jsx(
+          l.filter((e) => !x(e.y)).map((e, i) => /* @__PURE__ */ t.jsx("g", { children: /* @__PURE__ */ t.jsx(
             "path",
             {
               d: ke.renderCell(
@@ -416,8 +413,8 @@ function lt(pe) {
                 d(void 0), Y(void 0), F(void 0), W?.(void 0);
               }
             }
-          ) }, o)),
-          Q ? /* @__PURE__ */ t.jsx(t.Fragment, { children: Q.map((e, o) => /* @__PURE__ */ t.jsx(
+          ) }, i)),
+          Q ? /* @__PURE__ */ t.jsx(t.Fragment, { children: Q.map((e, i) => /* @__PURE__ */ t.jsx(
             Pe,
             {
               text: e.text,
@@ -430,9 +427,9 @@ function lt(pe) {
               animate: a,
               isInView: y
             },
-            o
+            i
           )) }) : null,
-          /* @__PURE__ */ t.jsx("g", { children: we.map((e, o) => {
+          /* @__PURE__ */ t.jsx("g", { children: we.map((e, i) => {
             const m = Ie(
               {
                 x: e.xCoordinate ? r(u(`${e.xCoordinate}`, f, /* @__PURE__ */ new Date())) + (e.xOffset || 0) : 0 + (e.xOffset || 0),
@@ -472,7 +469,7 @@ function lt(pe) {
                 animate: a,
                 isInView: y
               },
-              o
+              i
             );
           }) }),
           ne.filter((e) => e.position === "after").map((e) => e.layer)
@@ -492,7 +489,7 @@ function lt(pe) {
     ) : null
   ] });
 }
-function Yt(pe) {
+function Pt(pe) {
   const {
     data: n,
     graphTitle: S,
@@ -549,11 +546,11 @@ function Yt(pe) {
     customLayers: F = [],
     naLabel: w = "NA"
   } = pe, [X, ce] = G(0), [me, fe] = G(0), [v, V] = G(void 0), P = ge(null), he = ge(null);
-  return Me(() => {
-    const i = new ResizeObserver((J) => {
+  return $e(() => {
+    const o = new ResizeObserver((J) => {
       ce(h || J[0].target.clientWidth || 620), fe(D || J[0].target.clientHeight || 480);
     });
-    return P.current && (fe(P.current.clientHeight || 480), ce(P.current.clientWidth || 620), h || i.observe(P.current)), () => i.disconnect();
+    return P.current && (fe(P.current.clientHeight || 480), ce(P.current.clientWidth || 620), h || o.observe(P.current)), () => o.disconnect();
   }, [h, D]), /* @__PURE__ */ t.jsx(
     "div",
     {
@@ -581,7 +578,7 @@ function Yt(pe) {
               style: { padding: k ? Q || "1rem" : Q || 0 },
               children: /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
                 S || B || C || I ? /* @__PURE__ */ t.jsx(
-                  rt,
+                  st,
                   {
                     styles: {
                       title: d?.title,
@@ -595,29 +592,26 @@ function Yt(pe) {
                     graphDescription: B,
                     width: h,
                     graphDownload: C ? he.current : void 0,
-                    dataDownload: I ? n.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? n.map((i) => i.data).filter((i) => i !== void 0) : n.filter((i) => i !== void 0) : null
+                    dataDownload: I ? n.map((o) => o.data).filter((o) => o !== void 0).length > 0 ? n.map((o) => o.data).filter((o) => o !== void 0) : n.filter((o) => o !== void 0) : null
                   }
                 ) : null,
-                /* @__PURE__ */ t.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: n.length === 0 ? /* @__PURE__ */ t.jsx(nt, {}) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-                  ie && n.filter((i) => i.color).length !== 0 ? /* @__PURE__ */ t.jsx(
-                    st,
+                /* @__PURE__ */ t.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: n.length === 0 ? /* @__PURE__ */ t.jsx(lt, {}) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+                  ie && n.filter((o) => o.color).length !== 0 ? /* @__PURE__ */ t.jsx(
+                    ct,
                     {
                       width: h,
                       colorLegendTitle: j,
                       colors: s || T[A].categoricalColors.colors,
-                      colorDomain: f || ue(
-                        n.filter((i) => i.color),
-                        "color"
-                      ).map((i) => i.color).filter((i) => i !== void 0),
+                      colorDomain: f || ue(n, "color", !0),
                       setSelectedColor: V,
                       showNAColor: K
                     }
                   ) : null,
                   /* @__PURE__ */ t.jsx("div", { className: "w-full grow leading-0", ref: P, "aria-label": "Graph area", children: (h || X) && (D || me) ? /* @__PURE__ */ t.jsx(
-                    lt,
+                    mt,
                     {
                       data: n,
-                      lineColors: n.filter((i) => i.color).length === 0 ? s ? [s] : [T.primaryColors["blue-600"]] : s || T[A].categoricalColors.colors,
+                      lineColors: n.filter((o) => o.color).length === 0 ? s ? [s] : [T.primaryColors["blue-600"]] : s || T[A].categoricalColors.colors,
                       width: h || X,
                       height: Math.max(
                         M,
@@ -653,10 +647,7 @@ function Yt(pe) {
                       classNames: N,
                       selectedColor: v,
                       showLabels: ve,
-                      colorDomain: n.filter((i) => i.color).length === 0 ? [] : f || ue(
-                        n.filter((i) => i.color),
-                        "color"
-                      ).map((i) => i.color),
+                      colorDomain: n.filter((o) => o.color).length === 0 ? [] : f || ue(n, "color", !0),
                       dimmedOpacity: Y,
                       precision: le,
                       customLayers: F,
@@ -665,7 +656,7 @@ function Yt(pe) {
                   ) : null })
                 ] }) }),
                 _ || O ? /* @__PURE__ */ t.jsx(
-                  at,
+                  nt,
                   {
                     styles: { footnote: d?.footnote, source: d?.source },
                     classNames: {
@@ -686,6 +677,6 @@ function Yt(pe) {
   );
 }
 export {
-  Yt as MultiLineAltChart
+  Pt as MultiLineAltChart
 };
 //# sourceMappingURL=MultiLineAltChart.js.map