@undp/data-viz 1.5.2 → 1.5.3

package/dist/StripChart.js

@@ -1,12 +1,11 @@
 import { j as l, m as ni } from "./index-CHPV5EwG-BPSP-7Jg.js";
-import { u as gi } from "./index-AqnpA7_O.js";
-import { useRef as si, useState as E, useEffect as ui } from "react";
+import { useRef as si, useState as E, useEffect as fi } from "react";
 import { i as pi } from "./index-Bwrro8-q.js";
-import { s as mi } from "./index-fwdktvAS.js";
-import { X as xi } from "./Modal-DVVwpKhP.js";
+import { X as mi } from "./Modal-DVVwpKhP.js";
+import { o as xi } from "./index-DvVprvy6.js";
 import { T as yi } from "./Tooltip-CVCGWyzw.js";
 import { c as J } from "./checkIfNullOrUndefined-DmfiKkNw.js";
-import { n as di } from "./numberFormattingFunction-14YCbkN2.js";
+import { n as gi } from "./numberFormattingFunction-14YCbkN2.js";
 import { Colors as c } from "./Colors.js";
 import { s as vi } from "./string2HTML-oFCROsus.js";
 import { a as wi } from "./linear-DUdu7l2G.js";
@@ -17,17 +16,18 @@ import { GraphFooter as Ci } from "./GraphFooter.js";
 import { GraphHeader as ji } from "./GraphHeader.js";
 import { ColorLegendWithMouseOver as Mi } from "./ColorLegendWithMouseOver.js";
 import { E as Di } from "./EmptyState-DdTp-Mdn.js";
-function Ni(P, o) {
+import { u as di } from "./uniqBy-BHy4I8PK.js";
+function Ni(P, e) {
   if (P < 2) return [];
-  const d = o / (P - 1);
-  return Array.from({ length: P }, (p, e) => e * d);
+  const d = e / (P - 1);
+  return Array.from({ length: P }, (p, o) => o * d);
 }
 function Vi(P) {
   const {
-    data: o,
+    data: e,
     width: d,
     height: p,
-    colors: e,
+    colors: o,
     colorDomain: n,
     radius: h,
     leftMargin: s,
@@ -36,7 +36,7 @@ function Vi(P) {
     bottomMargin: ii,
     tooltip: F,
     onSeriesMouseOver: k,
-    highlightedDataPoints: a,
+    highlightedDataPoints: r,
     selectedColor: R,
     minValue: G,
     maxValue: _,
@@ -59,15 +59,21 @@ function Vi(P) {
   } = P, q = si(null), D = Oi(q, {
     once: m.once,
     amount: m.amount
-  }), [H, x] = E(void 0), [f, A] = E(void 0), [U, L] = E(void 0), [u, g] = E(void 0), O = {
+  }), [H, x] = E(void 0), [u, A] = E(void 0), [U, L] = E(void 0), [f, g] = E(void 0), O = {
     top: Y,
     bottom: ii,
     left: s,
     right: X
-  }, V = d - O.left - O.right, W = p - O.top - O.bottom, oi = o.map((i, t) => ({ ...i, id: `${t}` })), ei = mi(oi, (i) => {
-    const t = (a || []).indexOf(i.label);
-    return t === -1 ? 1 / 0 : t;
-  }).reverse(), li = J(_) ? Math.max(...o.filter((i) => !J(i.position)).map((i) => i.position)) < 0 ? 0 : Math.max(...o.filter((i) => !J(i.position)).map((i) => i.position)) : _, C = J(G) ? Math.min(...o.filter((i) => !J(i.position)).map((i) => i.position)) >= 0 ? 0 : Math.min(...o.filter((i) => !J(i.position)).map((i) => i.position)) : G, z = wi().domain([C, li]).range([0, V]).nice(), ri = Ni(w, V);
+  }, V = d - O.left - O.right, W = p - O.top - O.bottom, ei = e.map((i, t) => ({ ...i, id: `${t}` })), oi = xi(
+    ei,
+    [
+      (i) => {
+        const t = (r || []).indexOf(i.label);
+        return t === -1 ? 1 / 0 : t;
+      }
+    ],
+    ["desc"]
+  ), li = J(_) ? Math.max(...e.filter((i) => !J(i.position)).map((i) => i.position)) < 0 ? 0 : Math.max(...e.filter((i) => !J(i.position)).map((i) => i.position)) : _, C = J(G) ? Math.min(...e.filter((i) => !J(i.position)).map((i) => i.position)) >= 0 ? 0 : Math.min(...e.filter((i) => !J(i.position)).map((i) => i.position)) : G, z = wi().domain([C, li]).range([0, V]).nice(), ri = Ni(w, V);
   return /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
     /* @__PURE__ */ l.jsx(
       ai.svg,
@@ -80,7 +86,7 @@ function Vi(P) {
         children: /* @__PURE__ */ l.jsxs("g", { transform: `translate(${O.left},${O.top})`, children: [
           M.filter((i) => i.position === "before").map((i) => i.layer),
           /* @__PURE__ */ l.jsxs(bi, { children: [
-            ei.map((i) => /* @__PURE__ */ l.jsxs(
+            oi.map((i) => /* @__PURE__ */ l.jsxs(
               ai.g,
               {
                 className: "undp-viz-g-with-hover",
@@ -93,7 +99,7 @@ function Vi(P) {
                   whileInView: {
                     x: z(i.position),
                     y: W / 2,
-                    opacity: R ? i.color && e[n.indexOf(i.color)] === R ? 0.95 : T : a.length !== 0 ? a.indexOf(i.label) !== -1 ? 0.95 : T : v,
+                    opacity: R ? i.color && o[n.indexOf(i.color)] === R ? 0.95 : T : r.length !== 0 ? r.indexOf(i.label) !== -1 ? 0.95 : T : v,
                     transition: { duration: m.duration }
                   }
                 },
@@ -104,7 +110,7 @@ function Vi(P) {
                   x(i), g(t.clientY), L(t.clientX), k?.(i);
                 },
                 onClick: () => {
-                  (S || N) && (pi(f, i) && ti ? (A(void 0), S?.(void 0)) : (A(i), S?.(i)));
+                  (S || N) && (pi(u, i) && ti ? (A(void 0), S?.(void 0)) : (A(i), S?.(i)));
                 },
                 onMouseMove: (t) => {
                   x(i), g(t.clientY), L(t.clientX);
@@ -120,10 +126,10 @@ function Vi(P) {
                       cx: 0,
                       variants: {
                         initial: {
-                          fill: y && a ? a.indexOf(i.label) !== -1 ? y : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray
+                          fill: y && r ? r.indexOf(i.label) !== -1 ? y : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray
                         },
                         whileInView: {
-                          fill: y && a ? a.indexOf(i.label) !== -1 ? y : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray,
+                          fill: y && r ? r.indexOf(i.label) !== -1 ? y : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray,
                           transition: { duration: m.duration }
                         }
                       },
@@ -141,10 +147,10 @@ function Vi(P) {
                       width: 2,
                       variants: {
                         initial: {
-                          fill: y && a ? a.indexOf(i.label) !== -1 ? y : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray
+                          fill: y && r ? r.indexOf(i.label) !== -1 ? y : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray
                         },
                         whileInView: {
-                          fill: y && a ? a.indexOf(i.label) !== -1 ? y : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray,
+                          fill: y && r ? r.indexOf(i.label) !== -1 ? y : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray,
                           transition: { duration: m.duration }
                         }
                       },
@@ -153,7 +159,7 @@ function Vi(P) {
                       exit: { opacity: 0, transition: { duration: m.duration } }
                     }
                   ),
-                  a.length !== 0 && a.indexOf(i.label) !== -1 ? /* @__PURE__ */ l.jsx(
+                  r.length !== 0 && r.indexOf(i.label) !== -1 ? /* @__PURE__ */ l.jsx(
                     ai.text,
                     {
                       x: 0,
@@ -169,7 +175,7 @@ function Vi(P) {
                       animate: D ? "whileInView" : "initial",
                       exit: { opacity: 0, transition: { duration: m.duration } },
                       style: {
-                        fill: I || (y && a ? a.indexOf(i.label) !== -1 ? y : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray),
+                        fill: I || (y && r ? r.indexOf(i.label) !== -1 ? y : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray),
                         textAnchor: "middle",
                         ...j?.graphObjectValues || {}
                       },
@@ -177,7 +183,7 @@ function Vi(P) {
                         "graph-value text-sm font-bold",
                         $?.graphObjectValues
                       ),
-                      children: di(i.position, "NA", B, K, b)
+                      children: gi(i.position, "NA", B, K, b)
                     }
                   ) : null
                 ]
@@ -198,7 +204,7 @@ function Vi(P) {
                   $?.xAxis?.labels
                 ),
                 dy: "1em",
-                children: di(z.invert(i), "NA", B, K, b)
+                children: gi(z.invert(i), "NA", B, K, b)
               },
               t
             ))
@@ -207,21 +213,21 @@ function Vi(P) {
         ] })
       }
     ),
-    H && F && U && u ? /* @__PURE__ */ l.jsx(
+    H && F && U && f ? /* @__PURE__ */ l.jsx(
       yi,
       {
         data: H,
         body: F,
         xPos: U,
-        yPos: u,
+        yPos: f,
         backgroundStyle: j?.tooltip,
         className: $?.tooltip
       }
     ) : null,
-    N && f !== void 0 ? /* @__PURE__ */ l.jsx(
-      xi,
+    N && u !== void 0 ? /* @__PURE__ */ l.jsx(
+      mi,
       {
-        open: f !== void 0,
+        open: u !== void 0,
         onClose: () => {
           A(void 0);
         },
@@ -229,8 +235,8 @@ function Vi(P) {
           "div",
           {
             className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof N == "string" ? { __html: vi(N, f) } : void 0,
-            children: typeof N == "function" ? N(f) : null
+            dangerouslySetInnerHTML: typeof N == "string" ? { __html: vi(N, u) } : void 0,
+            children: typeof N == "function" ? N(u) : null
           }
         )
       }
@@ -239,10 +245,10 @@ function Vi(P) {
 }
 function ki(P) {
   const {
-    data: o,
+    data: e,
     graphTitle: d,
     colors: p,
-    sources: e,
+    sources: o,
     graphDescription: n,
     height: h,
     width: s,
@@ -251,7 +257,7 @@ function ki(P) {
     colorLegendTitle: ii,
     radius: F = 5,
     padding: k,
-    backgroundColor: a = !1,
+    backgroundColor: r = !1,
     leftMargin: R = 5,
     rightMargin: G = 5,
     topMargin: _ = 10,
@@ -275,40 +281,40 @@ function ki(P) {
     dotOpacity: D = 0.3,
     showNAColor: H = !0,
     minHeight: x = 0,
-    theme: f = "light",
+    theme: u = "light",
     ariaLabel: A,
     resetSelectionOnDoubleClick: U = !0,
     detailsOnClick: L,
-    styles: u,
+    styles: f,
     classNames: g,
     valueColor: O,
     animate: V = !1,
     noOfTicks: W = 2,
-    dimmedOpacity: oi = 0.3,
-    precision: ei = 2,
+    dimmedOpacity: ei = 0.3,
+    precision: oi = 2,
     customLayers: li = []
-  } = P, [C, z] = E(0), [ri, i] = E(0), [t, fi] = E(void 0), Z = si(null), ci = si(null);
-  return ui(() => {
-    const r = new ResizeObserver((hi) => {
+  } = P, [C, z] = E(0), [ri, i] = E(0), [t, ui] = E(void 0), Z = si(null), ci = si(null);
+  return fi(() => {
+    const a = new ResizeObserver((hi) => {
       z(s || hi[0].target.clientWidth || 620), i(h || hi[0].target.clientHeight || 480);
     });
-    return Z.current && (i(Z.current.clientHeight || 480), z(Z.current.clientWidth || 620), s || r.observe(Z.current)), () => r.disconnect();
+    return Z.current && (i(Z.current.clientHeight || 480), z(Z.current.clientWidth || 620), s || a.observe(Z.current)), () => a.disconnect();
   }, [s, h]), /* @__PURE__ */ l.jsx(
     "div",
     {
-      className: `${f || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
+      className: `${u || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
       dir: M === "he" || M === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ l.jsx(
         "div",
         {
           className: ni(
-            `${a ? a === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${M || "en"}`,
+            `${r ? r === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${M || "en"}`,
             s ? "w-fit" : "w-full",
             g?.graphContainer
           ),
           style: {
-            ...u?.graphContainer || {},
-            ...a && a !== !0 ? { backgroundColor: a } : {}
+            ...f?.graphContainer || {},
+            ...r && r !== !0 ? { backgroundColor: r } : {}
           },
           id: ti,
           ref: ci,
@@ -317,14 +323,14 @@ function ki(P) {
             "div",
             {
               className: "flex grow",
-              style: { padding: a ? k || "1rem" : k || 0 },
+              style: { padding: r ? k || "1rem" : k || 0 },
               children: /* @__PURE__ */ l.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
                 d || n || I || m ? /* @__PURE__ */ l.jsx(
                   ji,
                   {
                     styles: {
-                      title: u?.title,
-                      description: u?.description
+                      title: f?.title,
+                      description: f?.description
                     },
                     classNames: {
                       title: g?.title,
@@ -334,21 +340,18 @@ function ki(P) {
                     graphDescription: n,
                     width: s,
                     graphDownload: I ? ci.current : void 0,
-                    dataDownload: m ? o.map((r) => r.data).filter((r) => r !== void 0).length > 0 ? o.map((r) => r.data).filter((r) => r !== void 0) : o.filter((r) => r !== void 0) : null
+                    dataDownload: m ? e.map((a) => a.data).filter((a) => a !== void 0).length > 0 ? e.map((a) => a.data).filter((a) => a !== void 0) : e.filter((a) => a !== void 0) : null
                   }
                 ) : null,
-                /* @__PURE__ */ l.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: o.length === 0 ? /* @__PURE__ */ l.jsx(Di, {}) : /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
-                  y !== !1 && o.filter((r) => r.color).length !== 0 ? /* @__PURE__ */ l.jsx(
+                /* @__PURE__ */ l.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: e.length === 0 ? /* @__PURE__ */ l.jsx(Di, {}) : /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
+                  y !== !1 && e.filter((a) => a.color).length !== 0 ? /* @__PURE__ */ l.jsx(
                     Mi,
                     {
                       width: s,
                       colorLegendTitle: ii,
-                      colors: p || c[f].categoricalColors.colors,
-                      colorDomain: Y || gi(
-                        o.filter((r) => r.color),
-                        "color"
-                      ).map((r) => r.color),
-                      setSelectedColor: fi,
+                      colors: p || c[u].categoricalColors.colors,
+                      colorDomain: Y || di(e, "color", !0),
+                      setSelectedColor: ui,
                       showNAColor: H ?? !0
                     }
                   ) : null,
@@ -361,17 +364,14 @@ function ki(P) {
                       children: (s || C) && (h || ri) ? /* @__PURE__ */ l.jsx(
                         Vi,
                         {
-                          data: o,
+                          data: e,
                           width: s || C,
                           height: Math.max(
                             x,
                             h || (b ? x ? (s || C) * b > x ? (s || C) * b : x : (s || C) * b : ri)
                           ),
-                          colorDomain: o.filter((r) => r.color).length === 0 ? [] : Y || gi(
-                            o.filter((r) => r.color),
-                            "color"
-                          ).map((r) => r.color),
-                          colors: o.filter((r) => r.color).length === 0 ? p ? [p] : [c.primaryColors["blue-600"]] : p || c[f].categoricalColors.colors,
+                          colorDomain: e.filter((a) => a.color).length === 0 ? [] : Y || di(e, "color", !0),
+                          colors: e.filter((a) => a.color).length === 0 ? p ? [p] : [c.primaryColors["blue-600"]] : p || c[u].categoricalColors.colors,
                           selectedColor: t,
                           radius: F,
                           leftMargin: R,
@@ -391,28 +391,28 @@ function ki(P) {
                           dotOpacity: D,
                           resetSelectionOnDoubleClick: U,
                           detailsOnClick: L,
-                          styles: u,
+                          styles: f,
                           classNames: g,
                           valueColor: O,
                           animate: V === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : V || { duration: 0, once: !0, amount: 0 },
                           noOfTicks: W,
-                          dimmedOpacity: oi,
-                          precision: ei,
+                          dimmedOpacity: ei,
+                          precision: oi,
                           customLayers: li
                         }
                       ) : null
                     }
                   )
                 ] }) }),
-                e || X ? /* @__PURE__ */ l.jsx(
+                o || X ? /* @__PURE__ */ l.jsx(
                   Ci,
                   {
-                    styles: { footnote: u?.footnote, source: u?.source },
+                    styles: { footnote: f?.footnote, source: f?.source },
                     classNames: {
                       footnote: g?.footnote,
                       source: g?.source
                     },
-                    sources: e,
+                    sources: o,
                     footNote: X,
                     width: s
                   }
@@ -427,10 +427,10 @@ function ki(P) {
 }
 function Si(P) {
   const {
-    data: o,
+    data: e,
     width: d,
     height: p,
-    colors: e,
+    colors: o,
     colorDomain: n,
     radius: h,
     leftMargin: s,
@@ -439,7 +439,7 @@ function Si(P) {
     bottomMargin: ii,
     tooltip: F,
     onSeriesMouseOver: k,
-    highlightedDataPoints: a,
+    highlightedDataPoints: r,
     selectedColor: R,
     minValue: G,
     maxValue: _,
@@ -462,15 +462,21 @@ function Si(P) {
   } = P, q = si(null), D = Oi(q, {
     once: w.once,
     amount: w.amount
-  }), [H, x] = E(void 0), [f, A] = E(void 0), [U, L] = E(void 0), [u, g] = E(void 0), O = {
+  }), [H, x] = E(void 0), [u, A] = E(void 0), [U, L] = E(void 0), [f, g] = E(void 0), O = {
     top: Y,
     bottom: ii,
     left: s,
     right: X
-  }, V = d - O.left - O.right, W = p - O.top - O.bottom, oi = o.map((i, t) => ({ ...i, id: `${t}` })), ei = mi(oi, (i) => {
-    const t = (a || []).indexOf(i.label);
-    return t === -1 ? 1 / 0 : t;
-  }).reverse(), li = J(_) ? Math.max(...o.filter((i) => !J(i.position)).map((i) => i.position)) < 0 ? 0 : Math.max(...o.filter((i) => !J(i.position)).map((i) => i.position)) : _, C = J(G) ? Math.min(...o.filter((i) => !J(i.position)).map((i) => i.position)) >= 0 ? 0 : Math.min(...o.filter((i) => !J(i.position)).map((i) => i.position)) : G, z = wi().domain([C, li]).range([W, 0]).nice(), ri = Ni(K, W);
+  }, V = d - O.left - O.right, W = p - O.top - O.bottom, ei = e.map((i, t) => ({ ...i, id: `${t}` })), oi = xi(
+    ei,
+    [
+      (i) => {
+        const t = (r || []).indexOf(i.label);
+        return t === -1 ? 1 / 0 : t;
+      }
+    ],
+    ["desc"]
+  ), li = J(_) ? Math.max(...e.filter((i) => !J(i.position)).map((i) => i.position)) < 0 ? 0 : Math.max(...e.filter((i) => !J(i.position)).map((i) => i.position)) : _, C = J(G) ? Math.min(...e.filter((i) => !J(i.position)).map((i) => i.position)) >= 0 ? 0 : Math.min(...e.filter((i) => !J(i.position)).map((i) => i.position)) : G, z = wi().domain([C, li]).range([W, 0]).nice(), ri = Ni(K, W);
   return /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
     /* @__PURE__ */ l.jsx(
       ai.svg,
@@ -483,7 +489,7 @@ function Si(P) {
         children: /* @__PURE__ */ l.jsxs("g", { transform: `translate(${O.left},${O.top})`, children: [
           M.filter((i) => i.position === "before").map((i) => i.layer),
           /* @__PURE__ */ l.jsxs(bi, { children: [
-            ei.map((i) => /* @__PURE__ */ l.jsxs(
+            oi.map((i) => /* @__PURE__ */ l.jsxs(
               ai.g,
               {
                 className: "undp-viz-g-with-hover",
@@ -496,7 +502,7 @@ function Si(P) {
                   whileInView: {
                     x: V / 2,
                     y: z(i.position),
-                    opacity: R ? i.color && e[n.indexOf(i.color)] === R ? 0.95 : T : a.length !== 0 ? a.indexOf(i.label) !== -1 ? 0.95 : T : ti,
+                    opacity: R ? i.color && o[n.indexOf(i.color)] === R ? 0.95 : T : r.length !== 0 ? r.indexOf(i.label) !== -1 ? 0.95 : T : ti,
                     transition: { duration: w.duration }
                   }
                 },
@@ -507,7 +513,7 @@ function Si(P) {
                   x(i), g(t.clientY), L(t.clientX), k?.(i);
                 },
                 onClick: () => {
-                  (S || j) && (pi(f, i) && N ? (A(void 0), S?.(void 0)) : (A(i), S?.(i)));
+                  (S || j) && (pi(u, i) && N ? (A(void 0), S?.(void 0)) : (A(i), S?.(i)));
                 },
                 onMouseMove: (t) => {
                   x(i), g(t.clientY), L(t.clientX);
@@ -523,10 +529,10 @@ function Si(P) {
                       cx: 0,
                       variants: {
                         initial: {
-                          fill: v && a ? a.indexOf(i.label) !== -1 ? v : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray
+                          fill: v && r ? r.indexOf(i.label) !== -1 ? v : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray
                         },
                         whileInView: {
-                          fill: v && a ? a.indexOf(i.label) !== -1 ? v : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray,
+                          fill: v && r ? r.indexOf(i.label) !== -1 ? v : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray,
                           transition: { duration: w.duration }
                         }
                       },
@@ -544,10 +550,10 @@ function Si(P) {
                       height: 2,
                       variants: {
                         initial: {
-                          fill: v && a ? a.indexOf(i.label) !== -1 ? v : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray
+                          fill: v && r ? r.indexOf(i.label) !== -1 ? v : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray
                         },
                         whileInView: {
-                          fill: v && a ? a.indexOf(i.label) !== -1 ? v : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray,
+                          fill: v && r ? r.indexOf(i.label) !== -1 ? v : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray,
                           transition: { duration: w.duration }
                         }
                       },
@@ -556,7 +562,7 @@ function Si(P) {
                       exit: { opacity: 0, transition: { duration: w.duration } }
                     }
                   ),
-                  a.length !== 0 && a.indexOf(i.label) !== -1 ? /* @__PURE__ */ l.jsx(
+                  r.length !== 0 && r.indexOf(i.label) !== -1 ? /* @__PURE__ */ l.jsx(
                     ai.text,
                     {
                       y: 0,
@@ -573,7 +579,7 @@ function Si(P) {
                       animate: D ? "whileInView" : "initial",
                       exit: { opacity: 0, transition: { duration: w.duration } },
                       style: {
-                        fill: m || (v && a ? a.indexOf(i.label) !== -1 ? v : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray : o.filter((t) => t.color).length === 0 ? e[0] : i.color ? e[n.indexOf(i.color)] : c.gray),
+                        fill: m || (v && r ? r.indexOf(i.label) !== -1 ? v : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray : e.filter((t) => t.color).length === 0 ? o[0] : i.color ? o[n.indexOf(i.color)] : c.gray),
                         textAnchor: "start",
                         ...$?.graphObjectValues || {}
                       },
@@ -581,7 +587,7 @@ function Si(P) {
                         "graph-value text-sm font-bold",
                         I?.graphObjectValues
                       ),
-                      children: di(i.position, "NA", B, b, Q)
+                      children: gi(i.position, "NA", B, b, Q)
                     }
                   ) : null
                 ]
@@ -601,7 +607,7 @@ function Si(P) {
                   "fill-primary-gray-550 dark:fill-primary-gray-500 text-xs",
                   I?.yAxis?.labels
                 ),
-                children: di(z.invert(i), "NA", B, b, Q)
+                children: gi(z.invert(i), "NA", B, b, Q)
               },
               t
             ))
@@ -610,21 +616,21 @@ function Si(P) {
         ] })
       }
     ),
-    H && F && U && u ? /* @__PURE__ */ l.jsx(
+    H && F && U && f ? /* @__PURE__ */ l.jsx(
       yi,
       {
         data: H,
         body: F,
         xPos: U,
-        yPos: u,
+        yPos: f,
         backgroundStyle: $?.tooltip,
         className: I?.tooltip
       }
     ) : null,
-    j && f !== void 0 ? /* @__PURE__ */ l.jsx(
-      xi,
+    j && u !== void 0 ? /* @__PURE__ */ l.jsx(
+      mi,
       {
-        open: f !== void 0,
+        open: u !== void 0,
         onClose: () => {
           A(void 0);
         },
@@ -632,8 +638,8 @@ function Si(P) {
           "div",
           {
             className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof j == "string" ? { __html: vi(j, f) } : void 0,
-            children: typeof j == "function" ? j(f) : null
+            dangerouslySetInnerHTML: typeof j == "string" ? { __html: vi(j, u) } : void 0,
+            children: typeof j == "function" ? j(u) : null
           }
         )
       }
@@ -642,10 +648,10 @@ function Si(P) {
 }
 function $i(P) {
   const {
-    data: o,
+    data: e,
     graphTitle: d,
     colors: p,
-    sources: e,
+    sources: o,
     graphDescription: n,
     height: h,
     width: s,
@@ -654,7 +660,7 @@ function $i(P) {
     colorLegendTitle: ii,
     radius: F = 5,
     padding: k,
-    backgroundColor: a = !1,
+    backgroundColor: r = !1,
     leftMargin: R = 20,
     rightMargin: G = 20,
     topMargin: _ = 10,
@@ -678,40 +684,40 @@ function $i(P) {
     dotOpacity: D = 0.3,
     showNAColor: H = !0,
     minHeight: x = 0,
-    theme: f = "light",
+    theme: u = "light",
     ariaLabel: A,
     resetSelectionOnDoubleClick: U = !0,
     detailsOnClick: L,
-    styles: u,
+    styles: f,
     classNames: g,
     valueColor: O,
     animate: V = !1,
     noOfTicks: W = 2,
-    dimmedOpacity: oi = 0.3,
-    precision: ei = 2,
+    dimmedOpacity: ei = 0.3,
+    precision: oi = 2,
     customLayers: li = []
-  } = P, [C, z] = E(0), [ri, i] = E(0), [t, fi] = E(void 0), Z = si(null), ci = si(null);
-  return ui(() => {
-    const r = new ResizeObserver((hi) => {
+  } = P, [C, z] = E(0), [ri, i] = E(0), [t, ui] = E(void 0), Z = si(null), ci = si(null);
+  return fi(() => {
+    const a = new ResizeObserver((hi) => {
       z(s || hi[0].target.clientWidth || 620), i(h || hi[0].target.clientHeight || 480);
     });
-    return Z.current && (i(Z.current.clientHeight || 480), z(Z.current.clientWidth || 620), s || r.observe(Z.current)), () => r.disconnect();
+    return Z.current && (i(Z.current.clientHeight || 480), z(Z.current.clientWidth || 620), s || a.observe(Z.current)), () => a.disconnect();
   }, [s, h]), /* @__PURE__ */ l.jsx(
     "div",
     {
-      className: `${f || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
+      className: `${u || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
       dir: M === "he" || M === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ l.jsx(
         "div",
         {
           className: ni(
-            `${a ? a === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${M || "en"}`,
+            `${r ? r === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${M || "en"}`,
             s ? "w-fit" : "w-full",
             g?.graphContainer
           ),
           style: {
-            ...u?.graphContainer || {},
-            ...a && a !== !0 ? { backgroundColor: a } : {}
+            ...f?.graphContainer || {},
+            ...r && r !== !0 ? { backgroundColor: r } : {}
           },
           id: ti,
           ref: ci,
@@ -720,14 +726,14 @@ function $i(P) {
             "div",
             {
               className: "flex grow",
-              style: { padding: a ? k || "1rem" : k || 0 },
+              style: { padding: r ? k || "1rem" : k || 0 },
               children: /* @__PURE__ */ l.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
                 d || n || I || m ? /* @__PURE__ */ l.jsx(
                   ji,
                   {
                     styles: {
-                      title: u?.title,
-                      description: u?.description
+                      title: f?.title,
+                      description: f?.description
                     },
                     classNames: {
                       title: g?.title,
@@ -737,21 +743,18 @@ function $i(P) {
                     graphDescription: n,
                     width: s,
                     graphDownload: I ? ci.current : void 0,
-                    dataDownload: m ? o.map((r) => r.data).filter((r) => r !== void 0).length > 0 ? o.map((r) => r.data).filter((r) => r !== void 0) : o.filter((r) => r !== void 0) : null
+                    dataDownload: m ? e.map((a) => a.data).filter((a) => a !== void 0).length > 0 ? e.map((a) => a.data).filter((a) => a !== void 0) : e.filter((a) => a !== void 0) : null
                   }
                 ) : null,
-                /* @__PURE__ */ l.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: o.length === 0 ? /* @__PURE__ */ l.jsx(Di, {}) : /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
-                  y !== !1 && o.filter((r) => r.color).length !== 0 ? /* @__PURE__ */ l.jsx(
+                /* @__PURE__ */ l.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: e.length === 0 ? /* @__PURE__ */ l.jsx(Di, {}) : /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
+                  y !== !1 && e.filter((a) => a.color).length !== 0 ? /* @__PURE__ */ l.jsx(
                     Mi,
                     {
                       width: s,
                       colorLegendTitle: ii,
-                      colors: p || c[f].categoricalColors.colors,
-                      colorDomain: Y || gi(
-                        o.filter((r) => r.color),
-                        "color"
-                      ).map((r) => r.color),
-                      setSelectedColor: fi,
+                      colors: p || c[u].categoricalColors.colors,
+                      colorDomain: Y || di(e, "color", !0),
+                      setSelectedColor: ui,
                       showNAColor: H
                     }
                   ) : null,
@@ -763,17 +766,14 @@ function $i(P) {
                       children: (s || C) && (h || ri) ? /* @__PURE__ */ l.jsx(
                         Si,
                         {
-                          data: o,
+                          data: e,
                           width: s || C,
                           height: Math.max(
                             x,
                             h || (b ? x ? (s || C) * b > x ? (s || C) * b : x : (s || C) * b : ri)
                           ),
-                          colorDomain: o.filter((r) => r.color).length === 0 ? [] : Y || gi(
-                            o.filter((r) => r.color),
-                            "color"
-                          ).map((r) => r.color),
-                          colors: o.filter((r) => r.color).length === 0 ? p ? [p] : [c.primaryColors["blue-600"]] : p || c[f].categoricalColors.colors,
+                          colorDomain: e.filter((a) => a.color).length === 0 ? [] : Y || di(e, "color", !0),
+                          colors: e.filter((a) => a.color).length === 0 ? p ? [p] : [c.primaryColors["blue-600"]] : p || c[u].categoricalColors.colors,
                           selectedColor: t,
                           radius: F,
                           leftMargin: R,
@@ -793,28 +793,28 @@ function $i(P) {
                           dotOpacity: D,
                           resetSelectionOnDoubleClick: U,
                           detailsOnClick: L,
-                          styles: u,
+                          styles: f,
                           classNames: g,
                           valueColor: O,
                           animate: V === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : V || { duration: 0, once: !0, amount: 0 },
                           noOfTicks: W,
-                          dimmedOpacity: oi,
-                          precision: ei,
+                          dimmedOpacity: ei,
+                          precision: oi,
                           customLayers: li
                         }
                       ) : null
                     }
                   )
                 ] }) }),
-                e || X ? /* @__PURE__ */ l.jsx(
+                o || X ? /* @__PURE__ */ l.jsx(
                   Ci,
                   {
-                    styles: { footnote: u?.footnote, source: u?.source },
+                    styles: { footnote: f?.footnote, source: f?.source },
                     classNames: {
                       footnote: g?.footnote,
                       source: g?.source
                     },
-                    sources: e,
+                    sources: o,
                     footNote: X,
                     width: s
                   }
@@ -829,10 +829,10 @@ function $i(P) {
 }
 function Ki(P) {
   const {
-    data: o,
+    data: e,
     graphTitle: d,
     colors: p,
-    sources: e,
+    sources: o,
     graphDescription: n,
     height: h,
     width: s,
@@ -841,7 +841,7 @@ function Ki(P) {
     colorLegendTitle: ii,
     radius: F,
     padding: k,
-    backgroundColor: a,
+    backgroundColor: r,
     leftMargin: R,
     rightMargin: G,
     topMargin: _,
@@ -865,27 +865,27 @@ function Ki(P) {
     highlightColor: D,
     dotOpacity: H,
     showNAColor: x,
-    minHeight: f,
+    minHeight: u,
     theme: A,
     ariaLabel: U,
     valueColor: L,
-    resetSelectionOnDoubleClick: u,
+    resetSelectionOnDoubleClick: f,
     detailsOnClick: g,
     orientation: O = "vertical",
     styles: V,
     classNames: W,
-    animate: oi,
-    dimmedOpacity: ei = 0.3,
+    animate: ei,
+    dimmedOpacity: oi = 0.3,
     precision: li,
     customLayers: C
   } = P;
   return O === "vertical" ? /* @__PURE__ */ l.jsx(
     $i,
     {
-      data: o,
+      data: e,
       graphTitle: d,
       colors: p,
-      sources: e,
+      sources: o,
       graphDescription: n,
       height: h,
       width: s,
@@ -894,7 +894,7 @@ function Ki(P) {
       colorLegendTitle: ii,
       radius: F,
       padding: k,
-      backgroundColor: a,
+      backgroundColor: r,
       leftMargin: R,
       rightMargin: G,
       topMargin: _,
@@ -918,26 +918,26 @@ function Ki(P) {
       highlightColor: D,
       dotOpacity: H,
       showNAColor: x,
-      minHeight: f,
+      minHeight: u,
       theme: A,
       ariaLabel: U,
-      resetSelectionOnDoubleClick: u,
+      resetSelectionOnDoubleClick: f,
       styles: V,
       valueColor: L,
       detailsOnClick: g,
       classNames: W,
-      animate: oi,
-      dimmedOpacity: ei,
+      animate: ei,
+      dimmedOpacity: oi,
       precision: li,
       customLayers: C
     }
   ) : /* @__PURE__ */ l.jsx(
     ki,
     {
-      data: o,
+      data: e,
       graphTitle: d,
       colors: p,
-      sources: e,
+      sources: o,
       graphDescription: n,
       height: h,
       width: s,
@@ -946,7 +946,7 @@ function Ki(P) {
       colorLegendTitle: ii,
       radius: F,
       padding: k,
-      backgroundColor: a,
+      backgroundColor: r,
       leftMargin: R,
       rightMargin: G,
       topMargin: _,
@@ -970,16 +970,16 @@ function Ki(P) {
       highlightColor: D,
       dotOpacity: H,
       showNAColor: x,
-      minHeight: f,
+      minHeight: u,
       theme: A,
       ariaLabel: U,
-      resetSelectionOnDoubleClick: u,
+      resetSelectionOnDoubleClick: f,
       styles: V,
       valueColor: L,
       detailsOnClick: g,
       classNames: W,
-      animate: oi,
-      dimmedOpacity: ei,
+      animate: ei,
+      dimmedOpacity: oi,
       precision: li,
       customLayers: C
     }