@undp/data-viz 1.5.7 → 1.5.9

package/dist/ChoroplethMap.js

@@ -1,124 +1,127 @@
-import { j as e, m as je } from "./index-CHPV5EwG-BPSP-7Jg.js";
-import { useState as b, useRef as ae, useEffect as pe } from "react";
-import { g as we, x as $e } from "./getSliderMarks-9cNoRkDx.js";
-import { y as Ne } from "./Spinner-C85UF28E.js";
-import { p as Ce, f as Me } from "./parse-DlCRUFh_.js";
-import { i as De } from "./index-Bwrro8-q.js";
-import { z as Se, t as Oe, g as Ee, a as Pe, b as Ie, c as Le, d as ze } from "./zoom-QipiAl5W.js";
-import { X as We } from "./Modal-DVVwpKhP.js";
-import { u as ke } from "./Typography-Ctgfl1J5.js";
-import { t as Te } from "./index-9tDEUqOZ.js";
-import { n as Be } from "./numberFormattingFunction-14YCbkN2.js";
-import { T as Ae } from "./Tooltip-CVCGWyzw.js";
-import { s as Ve } from "./string2HTML-oFCROsus.js";
-import { c as Fe } from "./checkIfNullOrUndefined-DmfiKkNw.js";
-import { X as He, P as qe, f as Xe } from "./index-BmCqpO1B.js";
-import { o as _e } from "./ordinal-w9Lu4Stb.js";
-import { t as Ue } from "./threshold-DFfqcDMa.js";
-import { s as be } from "./select-DKy99ogv.js";
-import { u as Ge } from "./use-in-view-yS6jzJAp.js";
-import { m as de } from "./proxy-CkpFesk1.js";
-import { A as Re } from "./index-CNvov0eg.js";
-import { GraphFooter as Ye } from "./GraphFooter.js";
-import { GraphHeader as Je } from "./GraphHeader.js";
-import { Colors as me } from "./Colors.js";
-import { f as Ke } from "./fetchAndParseData-sapWbnYk.js";
-import { g as Ze } from "./getUniqValue-DiCh_MOD.js";
-import { g as Qe } from "./getJenks-BbngDoBQ.js";
-import { u as et } from "./uniqBy-BHy4I8PK.js";
-import { s as tt } from "./sort-DfK1b0F5.js";
-import { c as rt } from "./init-BhZylTFx.js";
-function at(he) {
+import { j as e, m as we } from "./index-CHPV5EwG-DBWUSD9b.js";
+import { useState as v, useRef as oe, useEffect as pe } from "react";
+import { g as $e, x as Ne } from "./getSliderMarks-_pYOWEtO.js";
+import { y as Ce } from "./Spinner-Bpz70q_g.js";
+import { p as De, f as Me } from "./parse-DlCRUFh_.js";
+import { i as Se } from "./index-Bwrro8-q.js";
+import { z as Oe, t as Ee, g as Pe, a as Ie, b as Le, c as ze, d as We } from "./zoom-QipiAl5W.js";
+import { G as Te } from "./Modal-Cg8daIlV.js";
+import { u as je } from "./Typography-LmZ9LEpe.js";
+import { t as Be } from "./index-9tDEUqOZ.js";
+import { n as Ae } from "./numberFormattingFunction-14YCbkN2.js";
+import { T as Ve } from "./Tooltip-6LIdPQGC.js";
+import { s as Fe } from "./string2HTML-oFCROsus.js";
+import { c as He } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { X as qe, P as _e, f as Ue } from "./index-zZjQEHlm.js";
+import { o as Ge } from "./ordinal-w9Lu4Stb.js";
+import { t as Xe } from "./threshold-DFfqcDMa.js";
+import { s as ke } from "./select-DKy99ogv.js";
+import { u as Ye } from "./use-in-view-DR-UTB96.js";
+import { m as me } from "./proxy-BYIC9BuT.js";
+import { A as Re } from "./index-Cwgh7i7X.js";
+import { GraphFooter as Je } from "./GraphFooter.js";
+import { GraphHeader as Ke } from "./GraphHeader.js";
+import { Colors as de } from "./Colors.js";
+import { f as Ze } from "./fetchAndParseData-sapWbnYk.js";
+import { g as Qe } from "./getUniqValue-DiCh_MOD.js";
+import { g as et } from "./getJenks-BbngDoBQ.js";
+import { u as tt } from "./uniqBy-BHy4I8PK.js";
+import { s as rt } from "./sort-DfK1b0F5.js";
+import { c as at } from "./init-BhZylTFx.js";
+function ot(he) {
   const {
-    data: k,
+    data: b,
     colorDomain: g,
     colors: c,
     mapData: x,
-    colorLegendTitle: V,
-    categorical: E,
+    colorLegendTitle: F,
+    categorical: S,
     height: h,
     width: s,
-    scale: oe,
-    centerPoint: T,
-    tooltip: ie,
-    mapBorderWidth: P,
-    mapBorderColor: F,
-    mapNoDataColor: R,
-    onSeriesMouseOver: Y,
+    scale: ie,
+    centerPoint: z,
+    tooltip: ne,
+    mapBorderWidth: O,
+    mapBorderColor: H,
+    mapNoDataColor: K,
+    onSeriesMouseOver: Z,
     showColorScale: ge,
     zoomScaleExtend: ue,
-    zoomTranslateExtend: I,
-    highlightedIds: H,
-    onSeriesMouseClick: f,
-    mapProperty: q,
+    zoomTranslateExtend: E,
+    highlightedIds: q,
+    onSeriesMouseClick: y,
+    mapProperty: _,
     resetSelectionOnDoubleClick: fe,
     detailsOnClick: C,
     styles: ye,
     classNames: xe,
-    mapProjection: X,
-    zoomInteraction: B,
-    animate: j,
-    dimmedOpacity: _,
-    customLayers: ne
-  } = he, [w, M] = b(void 0), J = ae(null), [K, v] = b(!(s < 680)), [D, Z] = b(void 0), [U, Q] = b(void 0), [S, $] = b(void 0), [se, ee] = b(void 0), L = ae(null), te = Ge(L, {
-    once: j.once,
-    amount: j.amount
-  }), le = ae(null), y = E ? _e().domain(g).range(c) : Ue().domain(g).range(c);
+    mapProjection: U,
+    zoomInteraction: W,
+    animate: k,
+    dimmedOpacity: G,
+    customLayers: se,
+    collapseColorScaleByDefault: Q
+  } = he, [j, P] = v(void 0), T = oe(null), [w, X] = v(
+    Q === void 0 ? !(s < 680) : !Q
+  ), [B, ee] = v(void 0), [Y, $] = v(void 0), [D, te] = v(void 0), [le, R] = v(void 0), A = oe(null), re = Ye(A, {
+    once: k.once,
+    amount: k.amount
+  }), u = oe(null), ve = S ? Ge().domain(g).range(c) : Xe().domain(g).range(c);
   pe(() => {
-    const r = be(le.current), l = be(L.current), m = (o) => {
-      if (B === "noZoom") return !1;
-      if (B === "button") return !o.type.includes("wheel");
+    const r = ke(u.current), l = ke(A.current), d = (o) => {
+      if (W === "noZoom") return !1;
+      if (W === "button") return !o.type.includes("wheel");
       const n = o.type === "wheel", t = o.type.startsWith("touch"), a = o.type === "mousedown" || o.type === "mousemove";
-      return t ? !0 : n ? B === "scroll" ? !0 : o.ctrlKey : a && !o.button && !o.ctrlKey;
-    }, i = Se().scaleExtent(ue).translateExtent(
-      I || [
+      return t ? !0 : n ? W === "scroll" ? !0 : o.ctrlKey : a && !o.button && !o.ctrlKey;
+    }, i = Oe().scaleExtent(ue).translateExtent(
+      E || [
         [-20, -20],
         [s + 20, h + 20]
       ]
-    ).filter(m).on("zoom", ({ transform: o }) => {
+    ).filter(d).on("zoom", ({ transform: o }) => {
       r.attr("transform", o);
     });
-    l.call(i), J.current = i;
-  }, [h, s, B]);
-  const u = Oe(x), z = Te(x), re = u[2] - u[0], ce = u[3] - u[1], A = s * 190 / 960 * 360 / re, ve = h * 190 / 678 * 180 / ce, d = oe * Math.min(A, ve), N = X === "mercator" ? Ee().rotate([0, 0]).center(T || z.geometry.coordinates).translate([s / 2, h / 2]).scale(d) : X === "equalEarth" ? Pe().rotate([0, 0]).center(T || z.geometry.coordinates).translate([s / 2, h / 2]).scale(d) : X === "naturalEarth" ? Ie().rotate([0, 0]).center(T || z.geometry.coordinates).translate([s / 2, h / 2]).scale(d) : X === "orthographic" ? Le().rotate([0, 0]).center(T || z.geometry.coordinates).translate([s / 2, h / 2]).scale(d) : ze().rotate([0, 0]).center(T || z.geometry.coordinates).translate([s / 2, h / 2]).scale(d), G = (r) => {
-    if (!L.current || !J.current) return;
-    be(L.current).call(J.current.scaleBy, r === "in" ? 1.2 : 1 / 1.2);
+    l.call(i), T.current = i;
+  }, [h, s, W]);
+  const f = Ee(x), I = Be(x), ae = f[2] - f[0], ce = f[3] - f[1], V = s * 190 / 960 * 360 / ae, be = h * 190 / 678 * 180 / ce, m = ie * Math.min(V, be), N = U === "mercator" ? Pe().rotate([0, 0]).center(z || I.geometry.coordinates).translate([s / 2, h / 2]).scale(m) : U === "equalEarth" ? Ie().rotate([0, 0]).center(z || I.geometry.coordinates).translate([s / 2, h / 2]).scale(m) : U === "naturalEarth" ? Le().rotate([0, 0]).center(z || I.geometry.coordinates).translate([s / 2, h / 2]).scale(m) : U === "orthographic" ? ze().rotate([0, 0]).center(z || I.geometry.coordinates).translate([s / 2, h / 2]).scale(m) : We().rotate([0, 0]).center(z || I.geometry.coordinates).translate([s / 2, h / 2]).scale(m), J = (r) => {
+    if (!A.current || !T.current) return;
+    ke(A.current).call(T.current.scaleBy, r === "in" ? 1.2 : 1 / 1.2);
   };
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
       /* @__PURE__ */ e.jsx(
-        de.svg,
+        me.svg,
         {
           width: `${s}px`,
           height: `${h}px`,
           viewBox: `0 0 ${s} ${h}`,
-          ref: L,
+          ref: A,
           direction: "ltr",
-          children: /* @__PURE__ */ e.jsxs("g", { ref: le, children: [
-            ne.filter((r) => r.position === "before").map((r) => r.layer),
+          children: /* @__PURE__ */ e.jsxs("g", { ref: u, children: [
+            se.filter((r) => r.position === "before").map((r) => r.layer),
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            x.features.map((r, l) => k.findIndex((i) => i.id === r.properties[q]) !== -1 ? null : /* @__PURE__ */ e.jsx(
+            x.features.map((r, l) => b.findIndex((i) => i.id === r.properties[_]) !== -1 ? null : /* @__PURE__ */ e.jsx(
               "g",
               {
-                opacity: w ? _ : H.length !== 0 ? H.indexOf(r.properties[q]) !== -1 ? 1 : _ : 1,
+                opacity: j ? G : q.length !== 0 ? q.indexOf(r.properties[_]) !== -1 ? 1 : G : 1,
                 children: r.geometry.type === "MultiPolygon" ? (
                   // eslint-disable-next-line @typescript-eslint/no-explicit-any
                   r.geometry.coordinates.map((i, o) => {
                     let n = "";
                     return i.forEach((t) => {
                       let a = " M";
-                      t.forEach((p, W) => {
-                        const O = N([p[0], p[1]]);
-                        W !== t.length - 1 ? a = `${a}${O[0]} ${O[1]}L` : a = `${a}${O[0]} ${O[1]}`;
+                      t.forEach((p, L) => {
+                        const M = N([p[0], p[1]]);
+                        L !== t.length - 1 ? a = `${a}${M[0]} ${M[1]}L` : a = `${a}${M[0]} ${M[1]}`;
                       }), n += a;
                     }), /* @__PURE__ */ e.jsx(
                       "path",
                       {
                         d: n,
                         style: {
-                          stroke: F,
-                          strokeWidth: P,
-                          fill: R
+                          stroke: H,
+                          strokeWidth: O,
+                          fill: K
                         }
                       },
                       o
@@ -136,9 +139,9 @@ function at(he) {
                       {
                         d: n,
                         style: {
-                          stroke: F,
-                          strokeWidth: P,
-                          fill: R
+                          stroke: H,
+                          strokeWidth: O,
+                          fill: K
                         }
                       },
                       o
@@ -148,38 +151,38 @@ function at(he) {
               },
               l
             )),
-            /* @__PURE__ */ e.jsx(Re, { children: k.map((r) => {
+            /* @__PURE__ */ e.jsx(Re, { children: b.map((r) => {
               const l = x.features.findIndex(
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                (i) => r.id === i.properties[q]
-              ), m = Fe(r.x) ? R : (
+                (i) => r.id === i.properties[_]
+              ), d = He(r.x) ? K : (
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                y(r.x)
+                ve(r.x)
               );
               return /* @__PURE__ */ e.jsx(
-                de.g,
+                me.g,
                 {
                   variants: {
                     initial: { opacity: 0 },
                     whileInView: {
-                      opacity: w ? w === m ? 1 : _ : H.length !== 0 ? H.indexOf(r.id) !== -1 ? 1 : _ : 1,
-                      transition: { duration: j.duration }
+                      opacity: j ? j === d ? 1 : G : q.length !== 0 ? q.indexOf(r.id) !== -1 ? 1 : G : 1,
+                      transition: { duration: k.duration }
                     }
                   },
                   initial: "initial",
-                  animate: te ? "whileInView" : "initial",
-                  exit: { opacity: 0, transition: { duration: j.duration } },
+                  animate: re ? "whileInView" : "initial",
+                  exit: { opacity: 0, transition: { duration: k.duration } },
                   onMouseEnter: (i) => {
-                    Q(r), ee(i.clientY), $(i.clientX), Y?.(r);
+                    $(r), R(i.clientY), te(i.clientX), Z?.(r);
                   },
                   onMouseMove: (i) => {
-                    Q(r), ee(i.clientY), $(i.clientX);
+                    $(r), R(i.clientY), te(i.clientX);
                   },
                   onMouseLeave: () => {
-                    Q(void 0), $(void 0), ee(void 0), Y?.(void 0);
+                    $(void 0), te(void 0), R(void 0), Z?.(void 0);
                   },
                   onClick: () => {
-                    (f || C) && (De(D, r) && fe ? (Z(void 0), f?.(void 0)) : (Z(r), f?.(r)));
+                    (y || C) && (Se(B, r) && fe ? (ee(void 0), y?.(void 0)) : (ee(r), y?.(r)));
                   },
                   children: l === -1 ? null : x.features[l].geometry.type === "MultiPolygon" ? x.features[l].geometry.coordinates.map(
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -187,28 +190,28 @@ function at(he) {
                       let n = "";
                       return i.forEach((t) => {
                         let a = " M";
-                        t.forEach((p, W) => {
-                          const O = N([p[0], p[1]]);
-                          W !== t.length - 1 ? a = `${a}${O[0]} ${O[1]}L` : a = `${a}${O[0]} ${O[1]}`;
+                        t.forEach((p, L) => {
+                          const M = N([p[0], p[1]]);
+                          L !== t.length - 1 ? a = `${a}${M[0]} ${M[1]}L` : a = `${a}${M[0]} ${M[1]}`;
                         }), n += a;
                       }), /* @__PURE__ */ e.jsx(
-                        de.path,
+                        me.path,
                         {
                           d: n,
                           variants: {
-                            initial: { fill: m, opacity: 0 },
+                            initial: { fill: d, opacity: 0 },
                             whileInView: {
-                              fill: m,
+                              fill: d,
                               opacity: 1,
-                              transition: { duration: j.duration }
+                              transition: { duration: k.duration }
                             }
                           },
                           initial: "initial",
-                          animate: te ? "whileInView" : "initial",
-                          exit: { opacity: 0, transition: { duration: j.duration } },
+                          animate: re ? "whileInView" : "initial",
+                          exit: { opacity: 0, transition: { duration: k.duration } },
                           style: {
-                            stroke: F,
-                            strokeWidth: P
+                            stroke: H,
+                            strokeWidth: O
                           }
                         },
                         `${r.id}-${o}`
@@ -222,23 +225,23 @@ function at(he) {
                         const p = N([t[0], t[1]]);
                         a !== i.length - 1 ? n = `${n}${p[0]} ${p[1]}L` : n = `${n}${p[0]} ${p[1]}`;
                       }), /* @__PURE__ */ e.jsx(
-                        de.path,
+                        me.path,
                         {
                           d: n,
                           variants: {
-                            initial: { fill: m, opacity: 0 },
+                            initial: { fill: d, opacity: 0 },
                             whileInView: {
-                              fill: m,
+                              fill: d,
                               opacity: 1,
-                              transition: { duration: j.duration }
+                              transition: { duration: k.duration }
                             }
                           },
                           initial: "initial",
-                          animate: te ? "whileInView" : "initial",
-                          exit: { opacity: 0, transition: { duration: j.duration } },
+                          animate: re ? "whileInView" : "initial",
+                          exit: { opacity: 0, transition: { duration: k.duration } },
                           style: {
-                            stroke: F,
-                            strokeWidth: P
+                            stroke: H,
+                            strokeWidth: O
                           }
                         },
                         `${r.id}-${o}`
@@ -249,18 +252,18 @@ function at(he) {
                 r.id
               );
             }) }),
-            U ? x.features.filter(
+            Y ? x.features.filter(
               // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              (r) => r.properties[q] === U.id
+              (r) => r.properties[_] === Y.id
             ).map((r, l) => /* @__PURE__ */ e.jsx("g", { children: r.geometry.type === "MultiPolygon" ? (
               // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              r.geometry.coordinates.map((m, i) => {
+              r.geometry.coordinates.map((d, i) => {
                 let o = "";
-                return m.forEach((n) => {
+                return d.forEach((n) => {
                   let t = " M";
                   n.forEach((a, p) => {
-                    const W = N([a[0], a[1]]);
-                    p !== n.length - 1 ? t = `${t}${W[0]} ${W[1]}L` : t = `${t}${W[0]} ${W[1]}`;
+                    const L = N([a[0], a[1]]);
+                    p !== n.length - 1 ? t = `${t}${L[0]} ${L[1]}L` : t = `${t}${L[0]} ${L[1]}`;
                   }), o += t;
                 }), /* @__PURE__ */ e.jsx(
                   "path",
@@ -278,11 +281,11 @@ function at(he) {
               })
             ) : (
               // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              r.geometry.coordinates.map((m, i) => {
+              r.geometry.coordinates.map((d, i) => {
                 let o = "M";
-                return m.forEach((n, t) => {
+                return d.forEach((n, t) => {
                   const a = N([n[0], n[1]]);
-                  t !== m.length - 1 ? o = `${o}${a[0]} ${a[1]}L` : o = `${o}${a[0]} ${a[1]}`;
+                  t !== d.length - 1 ? o = `${o}${a[0]} ${a[1]}L` : o = `${o}${a[0]} ${a[1]}`;
                 }), /* @__PURE__ */ e.jsx(
                   "path",
                   {
@@ -298,44 +301,31 @@ function at(he) {
                 );
               })
             ) }, l)) : null,
-            ne.filter((r) => r.position === "after").map((r) => r.layer)
+            se.filter((r) => r.position === "after").map((r) => r.layer)
           ] })
         }
       ),
-      ge === !1 ? null : /* @__PURE__ */ e.jsx("div", { className: "absolute left-4 bottom-4", children: K ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      ge === !1 ? null : /* @__PURE__ */ e.jsx("div", { className: "absolute left-4 bottom-4 map-color-legend", children: w ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsx(
           "div",
           {
-            style: {
-              backgroundColor: "rgba(240,240,240, 0.7)",
-              border: "1px solid var(--gray-400)",
-              borderRadius: "999px",
-              width: "24px",
-              height: "24px",
-              padding: "3px",
-              cursor: "pointer",
-              zIndex: 10,
-              position: "absolute",
-              right: "-0.75rem",
-              top: "-0.75rem"
-            },
+            className: "color-legend-close-button bg-[rgba(240,240,240,0.7)] dark:bg-[rgba(30,30,30,0.7)] border border-[var(--gray-400)] rounded-full w-6 h-6 p-[3px] cursor-pointer z-10 absolute right-[-0.75rem] top-[-0.75rem]",
             onClick: () => {
-              v(!1);
+              X(!1);
             },
-            children: /* @__PURE__ */ e.jsx(He, {})
+            children: /* @__PURE__ */ e.jsx(qe, {})
           }
         ),
         /* @__PURE__ */ e.jsxs(
           "div",
           {
-            className: "p-2",
+            className: "color-legend-box p-2 bg-[rgba(240,240,240,0.7)] dark:bg-[rgba(30,30,30,0.7)]",
             style: {
-              backgroundColor: "rgba(240,240,240, 0.7)",
-              width: E ? void 0 : "340px"
+              width: S ? void 0 : "340px"
             },
             children: [
-              V && V !== "" ? /* @__PURE__ */ e.jsx(
-                ke,
+              F && F !== "" ? /* @__PURE__ */ e.jsx(
+                je,
                 {
                   size: "xs",
                   marginBottom: "xs",
@@ -345,18 +335,18 @@ function at(he) {
                     WebkitLineClamp: "1",
                     WebkitBoxOrient: "vertical"
                   },
-                  children: V
+                  children: F
                 }
               ) : null,
-              E ? /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-3", children: g.map((r, l) => /* @__PURE__ */ e.jsxs(
+              S ? /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-3", children: g.map((r, l) => /* @__PURE__ */ e.jsxs(
                 "div",
                 {
                   className: "flex gap-2 items-center",
                   onMouseOver: () => {
-                    M(c[l % c.length]);
+                    P(c[l % c.length]);
                   },
                   onMouseLeave: () => {
-                    M(void 0);
+                    P(void 0);
                   },
                   children: [
                     /* @__PURE__ */ e.jsx(
@@ -366,7 +356,7 @@ function at(he) {
                         style: { backgroundColor: c[l % c.length] }
                       }
                     ),
-                    /* @__PURE__ */ e.jsx(ke, { size: "sm", marginBottom: "none", leading: "none", children: r })
+                    /* @__PURE__ */ e.jsx(je, { size: "sm", marginBottom: "none", leading: "none", children: r })
                   ]
                 },
                 l
@@ -375,10 +365,10 @@ function at(he) {
                   "g",
                   {
                     onMouseOver: () => {
-                      M(c[l]);
+                      P(c[l]);
                     },
                     onMouseLeave: () => {
-                      M(void 0);
+                      P(void 0);
                     },
                     className: "cursor-pointer",
                     children: [
@@ -389,10 +379,10 @@ function at(he) {
                           y: 1,
                           width: 320 / c.length - 2,
                           height: 8,
-                          className: w === c[l] ? "stroke-primary-gray-700 dark:stroke-primary-gray-300" : "",
+                          className: j === c[l] ? "stroke-primary-gray-700 dark:stroke-primary-gray-300" : "",
                           style: {
                             fill: c[l],
-                            ...w === c[l] ? {} : { stroke: c[l] }
+                            ...j === c[l] ? {} : { stroke: c[l] }
                           }
                         }
                       ),
@@ -403,7 +393,7 @@ function at(he) {
                           y: 25,
                           className: "fill-primary-gray-700 dark:fill-primary-gray-300 text-xs",
                           style: { textAnchor: "middle" },
-                          children: Be(r, "NA")
+                          children: Ae(r, "NA")
                         }
                       )
                     ]
@@ -414,19 +404,19 @@ function at(he) {
                   "rect",
                   {
                     onMouseOver: () => {
-                      M(c[g.length]);
+                      P(c[g.length]);
                     },
                     onMouseLeave: () => {
-                      M(void 0);
+                      P(void 0);
                     },
                     x: g.length * 320 / c.length + 1,
                     y: 1,
                     width: 320 / c.length - 2,
                     height: 8,
-                    className: `cursor-pointer ${w === c[g.length] ? "stroke-1 stroke-primary-gray-700 dark:stroke-primary-gray-300" : ""}`,
+                    className: `cursor-pointer ${j === c[g.length] ? "stroke-1 stroke-primary-gray-700 dark:stroke-primary-gray-300" : ""}`,
                     style: {
                       fill: c[g.length],
-                      ...w === c[g.length] ? {} : { stroke: c[g.length] }
+                      ...j === c[g.length] ? {} : { stroke: c[g.length] }
                     }
                   }
                 ) })
@@ -438,217 +428,218 @@ function at(he) {
         "button",
         {
           type: "button",
-          className: "mb-0 border-0 bg-transparent p-0 self-start",
+          className: "mb-0 border-0 bg-transparent p-0 self-start map-legend-button",
           onClick: () => {
-            v(!0);
+            X(!0);
           },
-          children: /* @__PURE__ */ e.jsx("div", { className: "items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-550 border-primary-gray-400 dark:border-primary-gray-500", children: "Show Legend" })
+          children: /* @__PURE__ */ e.jsx("div", { className: "show-color-legend-button items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-600 border-primary-gray-400 dark:border-primary-gray-500", children: "Show Legend" })
         }
       ) }),
-      B === "button" && /* @__PURE__ */ e.jsxs("div", { className: "absolute left-4 top-4 flex flex-col", children: [
+      W === "button" && /* @__PURE__ */ e.jsxs("div", { className: "absolute left-4 top-4 flex flex-col", children: [
         /* @__PURE__ */ e.jsx(
           "button",
           {
-            onClick: () => G("in"),
-            className: "leading-0 px-2 py-3.5 text-primary-gray-700 border border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-400 dark:bg-primary-gray-600 dark:text-primary-gray-100",
+            onClick: () => J("in"),
+            className: "leading-0 px-2 py-3.5 text-primary-gray-700 border border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-550 dark:bg-primary-gray-600 dark:text-primary-gray-100",
             children: "+"
           }
         ),
         /* @__PURE__ */ e.jsx(
           "button",
           {
-            onClick: () => G("out"),
-            className: "leading-0 px-2 py-3.5 text-primary-gray-700 border border-t-0 border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-400 dark:bg-primary-gray-600 dark:text-primary-gray-100",
+            onClick: () => J("out"),
+            className: "leading-0 px-2 py-3.5 text-primary-gray-700 border border-t-0 border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-550 dark:bg-primary-gray-600 dark:text-primary-gray-100",
             children: "–"
           }
         )
       ] })
     ] }),
-    C && D !== void 0 ? /* @__PURE__ */ e.jsx(
-      We,
+    C && B !== void 0 ? /* @__PURE__ */ e.jsx(
+      Te,
       {
-        open: D !== void 0,
+        open: B !== void 0,
         onClose: () => {
-          Z(void 0);
+          ee(void 0);
         },
         children: /* @__PURE__ */ e.jsx(
           "div",
           {
             className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof C == "string" ? { __html: Ve(C, D) } : void 0,
-            children: typeof C == "function" ? C(D) : null
+            dangerouslySetInnerHTML: typeof C == "string" ? { __html: Fe(C, B) } : void 0,
+            children: typeof C == "function" ? C(B) : null
           }
         )
       }
     ) : null,
-    U && ie && S && se ? /* @__PURE__ */ e.jsx(
-      Ae,
+    Y && ne && D && le ? /* @__PURE__ */ e.jsx(
+      Ve,
       {
-        data: U,
-        body: ie,
-        xPos: S,
-        yPos: se,
+        data: Y,
+        body: ne,
+        xPos: D,
+        yPos: le,
         backgroundStyle: ye?.tooltip,
         className: xe?.tooltip
       }
     ) : null
   ] });
 }
-function Lt(he) {
+function zt(he) {
   const {
-    data: k,
+    data: b,
     mapData: g = "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap.json",
     graphTitle: c,
     colors: x,
-    sources: V,
-    graphDescription: E,
+    sources: F,
+    graphDescription: S,
     height: h,
     width: s,
-    footNote: oe = "The designations employed and the presentation of material on this map do not imply the expression of any opinion whatsoever on the part of the Secretariat of the United Nations or UNDP concerning the legal status of any country, territory, city or area or its authorities, or concerning the delimitation of its frontiers or boundaries.",
-    colorDomain: T,
-    colorLegendTitle: ie,
-    scaleType: P = "threshold",
-    scale: F = 0.95,
-    centerPoint: R,
-    padding: Y,
+    footNote: ie = "The designations employed and the presentation of material on this map do not imply the expression of any opinion whatsoever on the part of the Secretariat of the United Nations or UNDP concerning the legal status of any country, territory, city or area or its authorities, or concerning the delimitation of its frontiers or boundaries.",
+    colorDomain: z,
+    colorLegendTitle: ne,
+    scaleType: O = "threshold",
+    scale: H = 0.95,
+    centerPoint: K,
+    padding: Z,
     mapBorderWidth: ge = 0.5,
-    mapNoDataColor: ue = me.light.graphNoData,
-    backgroundColor: I = !1,
-    mapBorderColor: H = me.light.grays["gray-500"],
-    relativeHeight: f,
-    tooltip: q,
+    mapNoDataColor: ue = de.light.graphNoData,
+    backgroundColor: E = !1,
+    mapBorderColor: q = de.light.grays["gray-500"],
+    relativeHeight: y,
+    tooltip: _,
     onSeriesMouseOver: fe,
     isWorldMap: C = !0,
     showColorScale: ye = !0,
     zoomScaleExtend: xe = [0.8, 6],
-    zoomTranslateExtend: X,
-    graphID: B,
-    highlightedIds: j = [],
-    onSeriesMouseClick: _,
-    mapProperty: ne = "ISO3",
-    graphDownload: w = !1,
-    dataDownload: M = !1,
-    showAntarctica: J = !1,
-    language: K = "en",
-    minHeight: v = 0,
-    theme: D = "light",
-    ariaLabel: Z,
-    resetSelectionOnDoubleClick: U = !0,
-    detailsOnClick: Q,
-    styles: S,
-    classNames: $,
-    mapProjection: se,
-    zoomInteraction: ee = "button",
-    animate: L = !1,
-    dimmedOpacity: te = 0.3,
-    customLayers: le = [],
-    timeline: y = { enabled: !1, autoplay: !1, showOnlyActiveDate: !0 }
-  } = he, [u, z] = b(0), [re, ce] = b(0), [A, ve] = b(y.autoplay), d = tt(
-    et(k, "date", !0).map(
-      (t) => Ce(`${t}`, y.dateFormat || "yyyy", /* @__PURE__ */ new Date()).getTime()
+    zoomTranslateExtend: U,
+    graphID: W,
+    highlightedIds: k = [],
+    onSeriesMouseClick: G,
+    mapProperty: se = "ISO3",
+    graphDownload: Q = !1,
+    dataDownload: j = !1,
+    showAntarctica: P = !1,
+    language: T = "en",
+    minHeight: w = 0,
+    theme: X = "light",
+    ariaLabel: B,
+    resetSelectionOnDoubleClick: ee = !0,
+    detailsOnClick: Y,
+    styles: $,
+    classNames: D,
+    mapProjection: te,
+    zoomInteraction: le = "button",
+    animate: R = !1,
+    dimmedOpacity: A = 0.3,
+    customLayers: re = [],
+    timeline: u = { enabled: !1, autoplay: !1, showOnlyActiveDate: !0 },
+    collapseColorScaleByDefault: ve
+  } = he, [f, I] = v(0), [ae, ce] = v(0), [V, be] = v(u.autoplay), m = rt(
+    tt(b, "date", !0).map(
+      (t) => De(`${t}`, u.dateFormat || "yyyy", /* @__PURE__ */ new Date()).getTime()
     ),
-    (t, a) => rt(t, a)
-  ), [N, G] = b(y.autoplay ? 0 : d.length - 1), [r, l] = b(void 0), m = ae(null), i = ae(null);
+    (t, a) => at(t, a)
+  ), [N, J] = v(u.autoplay ? 0 : m.length - 1), [r, l] = v(void 0), d = oe(null), i = oe(null);
   pe(() => {
     const t = new ResizeObserver((a) => {
-      z(s || a[0].target.clientWidth || 760), ce(h || a[0].target.clientHeight || 480);
+      I(s || a[0].target.clientWidth || 760), ce(h || a[0].target.clientHeight || 480);
     });
-    return m.current && (ce(m.current.clientHeight || 480), z(m.current.clientWidth || 760), s || t.observe(m.current)), () => t.disconnect();
+    return d.current && (ce(d.current.clientHeight || 480), I(d.current.clientWidth || 760), s || t.observe(d.current)), () => t.disconnect();
   }, [s, h]), pe(() => {
-    typeof g == "string" ? Ke(g).then((a) => {
+    typeof g == "string" ? Ze(g).then((a) => {
       l(a);
     }) : l(g);
   }, [g]);
-  const o = T || (P === "categorical" ? Ze(k, "x") : Qe(
-    k.map((t) => t.x),
+  const o = z || (O === "categorical" ? Qe(b, "x") : et(
+    b.map((t) => t.x),
     x?.length || 4
   ));
   pe(() => {
     const t = setInterval(
       () => {
-        G((a) => a < d.length - 1 ? a + 1 : 0);
+        J((a) => a < m.length - 1 ? a + 1 : 0);
       },
-      (y.speed || 2) * 1e3
+      (u.speed || 2) * 1e3
     );
-    return A || clearInterval(t), () => clearInterval(t);
-  }, [d, A, y.speed]);
-  const n = we(
-    d,
+    return V || clearInterval(t), () => clearInterval(t);
+  }, [m, V, u.speed]);
+  const n = $e(
+    m,
     N,
-    y.showOnlyActiveDate,
-    y.dateFormat || "yyyy"
+    u.showOnlyActiveDate,
+    u.dateFormat || "yyyy"
   );
   return /* @__PURE__ */ e.jsx(
     "div",
     {
-      className: `${D || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
-      dir: K === "he" || K === "ar" ? "rtl" : void 0,
+      className: `${X || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
+      dir: T === "he" || T === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ e.jsx(
         "div",
         {
-          className: je(
-            `${I ? I === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${K || "en"}`,
+          className: we(
+            `${E ? E === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${T || "en"}`,
             s ? "w-fit" : "w-full",
-            $?.graphContainer
+            D?.graphContainer
           ),
           style: {
-            ...S?.graphContainer || {},
-            ...I && I !== !0 ? { backgroundColor: I } : {}
+            ...$?.graphContainer || {},
+            ...E && E !== !0 ? { backgroundColor: E } : {}
           },
-          id: B,
+          id: W,
           ref: i,
-          "aria-label": Z || `${c ? `The graph shows ${c}. ` : ""}This is a choropleth map where geographic areas are colored in proportion to a specific variable.${E ? ` ${E}` : ""}`,
+          "aria-label": B || `${c ? `The graph shows ${c}. ` : ""}This is a choropleth map where geographic areas are colored in proportion to a specific variable.${S ? ` ${S}` : ""}`,
           children: /* @__PURE__ */ e.jsx(
             "div",
             {
               className: "flex grow",
-              style: { padding: I ? Y || "1rem" : Y || 0 },
+              style: { padding: E ? Z || "1rem" : Z || 0 },
               children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                c || E || w || M ? /* @__PURE__ */ e.jsx(
-                  Je,
+                c || S || Q || j ? /* @__PURE__ */ e.jsx(
+                  Ke,
                   {
                     styles: {
-                      title: S?.title,
-                      description: S?.description
-                    },
-                    classNames: {
                       title: $?.title,
                       description: $?.description
                     },
+                    classNames: {
+                      title: D?.title,
+                      description: D?.description
+                    },
                     graphTitle: c,
-                    graphDescription: E,
+                    graphDescription: S,
                     width: s,
-                    graphDownload: w ? i.current : void 0,
-                    dataDownload: M ? k.map((t) => t.data).filter((t) => t !== void 0).length > 0 ? k.map((t) => t.data).filter((t) => t !== void 0) : k.filter((t) => t !== void 0) : null
+                    graphDownload: Q ? i.current : void 0,
+                    dataDownload: j ? b.map((t) => t.data).filter((t) => t !== void 0).length > 0 ? b.map((t) => t.data).filter((t) => t !== void 0) : b.filter((t) => t !== void 0) : null
                   }
                 ) : null,
-                y.enabled && d.length > 0 && n ? /* @__PURE__ */ e.jsxs("div", { className: "flex gap-6 items-center", dir: "ltr", children: [
+                u.enabled && m.length > 0 && n ? /* @__PURE__ */ e.jsxs("div", { className: "flex gap-6 items-center", dir: "ltr", children: [
                   /* @__PURE__ */ e.jsx(
                     "button",
                     {
                       type: "button",
                       onClick: () => {
-                        ve(!A);
+                        be(!V);
                       },
                       className: "p-0 border-0 cursor-pointer bg-transparent",
-                      "aria-label": A ? "Click to pause animation" : "Click to play animation",
-                      children: A ? /* @__PURE__ */ e.jsx(qe, {}) : /* @__PURE__ */ e.jsx(Xe, {})
+                      "aria-label": V ? "Click to pause animation" : "Click to play animation",
+                      children: V ? /* @__PURE__ */ e.jsx(_e, {}) : /* @__PURE__ */ e.jsx(Ue, {})
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    $e,
+                    Ne,
                     {
-                      min: d[0],
-                      max: d[d.length - 1],
+                      min: m[0],
+                      max: m[m.length - 1],
                       marks: n,
                       step: null,
-                      defaultValue: d[d.length - 1],
-                      value: d[N],
+                      defaultValue: m[m.length - 1],
+                      value: m[N],
                       onChangeComplete: (t) => {
-                        G(d.indexOf(t));
+                        J(m.indexOf(t));
                       },
                       onChange: (t) => {
-                        G(d.indexOf(t));
+                        J(m.indexOf(t));
                       },
                       "aria-label": "Time slider. Use arrow keys to adjust selected time period."
                     }
@@ -658,15 +649,15 @@ function Lt(he) {
                   "div",
                   {
                     className: "flex flex-col grow justify-center leading-0",
-                    ref: m,
+                    ref: d,
                     "aria-label": "Map area",
-                    children: (s || u) && (h || re) && r ? /* @__PURE__ */ e.jsx(
-                      at,
+                    children: (s || f) && (h || ae) && r ? /* @__PURE__ */ e.jsx(
+                      ot,
                       {
-                        data: k.filter(
-                          (t) => y.enabled ? t.date === Me(new Date(d[N]), y.dateFormat || "yyyy") : t
+                        data: b.filter(
+                          (t) => u.enabled ? t.date === Me(new Date(m[N]), u.dateFormat || "yyyy") : t
                         ),
-                        mapData: J ? r : {
+                        mapData: P ? r : {
                           ...r,
                           features: r.features.filter(
                             // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -674,63 +665,64 @@ function Lt(he) {
                           )
                         },
                         colorDomain: o,
-                        width: s || u,
+                        width: s || f,
                         height: Math.max(
-                          v,
-                          h || (f ? v ? (s || u) * f > v ? (s || u) * f : v : (s || u) * f : re)
+                          w,
+                          h || (y ? w ? (s || f) * y > w ? (s || f) * y : w : (s || f) * y : ae)
                         ),
-                        scale: F,
-                        centerPoint: R,
-                        colors: x || (P === "categorical" ? me[D].sequentialColors[`neutralColorsx0${o.length}`] : me[D].sequentialColors[`neutralColorsx0${o.length + 1}`]),
-                        colorLegendTitle: ie,
+                        scale: H,
+                        centerPoint: K,
+                        colors: x || (O === "categorical" ? de[X].sequentialColors[`neutralColorsx0${o.length}`] : de[X].sequentialColors[`neutralColorsx0${o.length + 1}`]),
+                        colorLegendTitle: ne,
                         mapBorderWidth: ge,
                         mapNoDataColor: ue,
-                        categorical: P === "categorical",
-                        mapBorderColor: H,
-                        tooltip: q,
+                        categorical: O === "categorical",
+                        mapBorderColor: q,
+                        tooltip: _,
                         onSeriesMouseOver: fe,
                         isWorldMap: C,
                         showColorScale: ye,
                         zoomScaleExtend: xe,
-                        zoomTranslateExtend: X,
-                        onSeriesMouseClick: _,
-                        mapProperty: ne,
-                        highlightedIds: j,
-                        resetSelectionOnDoubleClick: U,
-                        styles: S,
-                        classNames: $,
-                        detailsOnClick: Q,
-                        mapProjection: se || (C ? "naturalEarth" : "mercator"),
-                        zoomInteraction: ee,
-                        dimmedOpacity: te,
-                        animate: L === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : L || { duration: 0, once: !0, amount: 0 },
-                        customLayers: le
+                        zoomTranslateExtend: U,
+                        onSeriesMouseClick: G,
+                        mapProperty: se,
+                        highlightedIds: k,
+                        resetSelectionOnDoubleClick: ee,
+                        styles: $,
+                        classNames: D,
+                        detailsOnClick: Y,
+                        mapProjection: te || (C ? "naturalEarth" : "mercator"),
+                        zoomInteraction: le,
+                        dimmedOpacity: A,
+                        animate: R === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : R || { duration: 0, once: !0, amount: 0 },
+                        customLayers: re,
+                        collapseColorScaleByDefault: ve
                       }
                     ) : /* @__PURE__ */ e.jsx(
                       "div",
                       {
                         style: {
                           height: `${Math.max(
-                            v,
-                            h || (f ? v ? (s || u) * f > v ? (s || u) * f : v : (s || u) * f : re)
+                            w,
+                            h || (y ? w ? (s || f) * y > w ? (s || f) * y : w : (s || f) * y : ae)
                           )}px`
                         },
                         className: "flex items-center justify-center",
-                        children: /* @__PURE__ */ e.jsx(Ne, { "aria-label": "Loading graph" })
+                        children: /* @__PURE__ */ e.jsx(Ce, { "aria-label": "Loading graph" })
                       }
                     )
                   }
                 ),
-                V || oe ? /* @__PURE__ */ e.jsx(
-                  Ye,
+                F || ie ? /* @__PURE__ */ e.jsx(
+                  Je,
                   {
-                    styles: { footnote: S?.footnote, source: S?.source },
+                    styles: { footnote: $?.footnote, source: $?.source },
                     classNames: {
-                      footnote: $?.footnote,
-                      source: $?.source
+                      footnote: D?.footnote,
+                      source: D?.source
                     },
-                    sources: V,
-                    footNote: oe,
+                    sources: F,
+                    footNote: ie,
                     width: s
                   }
                 ) : null
@@ -743,6 +735,6 @@ function Lt(he) {
   );
 }
 export {
-  Lt as ChoroplethMap
+  zt as ChoroplethMap
 };
 //# sourceMappingURL=ChoroplethMap.js.map