@undp/data-viz 1.5.9 → 2.0.1

package/dist/ThreeDGlobe.js

@@ -1,547 +1,384 @@
-import { j as o, m as be } from "./index-CHPV5EwG-DBWUSD9b.js";
-import { useState as N, useRef as ye, useEffect as D, useCallback as ge } from "react";
-import { y as ve } from "./Spinner-Bpz70q_g.js";
-import we from "react-globe.gl";
-import { i as Ce } from "./index-Bwrro8-q.js";
-import * as P from "three";
-import { G as je } from "./Modal-Cg8daIlV.js";
-import { u as ue } from "./Typography-LmZ9LEpe.js";
-import { T as Se } from "./Tooltip-6LIdPQGC.js";
-import { n as ke } from "./numberFormattingFunction-14YCbkN2.js";
-import { X as De } from "./index-zZjQEHlm.js";
-import { s as Ne } from "./string2HTML-oFCROsus.js";
-import { g as Le } from "./getCentroidCoordinates-Dfk6IqEG.js";
-import { o as Me } from "./ordinal-w9Lu4Stb.js";
-import { t as ze } from "./threshold-DFfqcDMa.js";
-import { GraphHeader as Oe } from "./GraphHeader.js";
-import { GraphFooter as Pe } from "./GraphFooter.js";
-import { f as Re } from "./fetchAndParseData-sapWbnYk.js";
-import { Colors as A } from "./Colors.js";
-import { g as Te } from "./getUniqValue-DiCh_MOD.js";
-import { g as Ee } from "./getJenks-BbngDoBQ.js";
-function Ae(e) {
-  let a;
-  switch (e.type) {
+import { j as a, m as rt, c as at } from "./index-CHPV5EwG-Curnpaqc.js";
+import { useState as A, useRef as Xe, useEffect as E, useCallback as st, useEffectEvent as it } from "react";
+import { w as nt } from "./Spinner-D7rnnwnA.js";
+import lt from "react-globe.gl";
+import { i as ct } from "./index-Bwrro8-q.js";
+import * as H from "three";
+import { l as dt } from "./Modal-DGcuAHyK.js";
+import { j as Ye } from "./Typography-PxtFcnJb.js";
+import { T as pt } from "./Tooltip-CwWUegPB.js";
+import { n as ht } from "./numberFormattingFunction-14YCbkN2.js";
+import { X as mt } from "./index-D491FEn1.js";
+import { s as ut } from "./string2HTML-DhG75NqA.js";
+import { g as gt } from "./getCentroidCoordinates-D7r34N4w.js";
+import { o as ft } from "./ordinal-P77xw8aL.js";
+import { t as yt } from "./threshold-Bgr20hik.js";
+import { GraphHeader as vt } from "./GraphHeader.js";
+import { GraphFooter as bt } from "./GraphFooter.js";
+import { f as xt } from "./fetchAndParseData-BpqkBPQL.js";
+import { Colors as K } from "./Colors.js";
+import { g as wt } from "./getUniqValue-BKHCm3zE.js";
+import { g as Ct } from "./getJenks-BbngDoBQ.js";
+import { a as St, G as kt } from "./GraphContainer-CRqzdKu2.js";
+function Dt(t) {
+  let e;
+  switch (t.type) {
     case "ambient":
-      a = new P.AmbientLight(e.color, e.intensity);
+      e = new H.AmbientLight(t.color, t.intensity);
       break;
     case "directional":
-      a = new P.DirectionalLight(e.color, e.intensity), e.position && (e.position === "camera" ? a.position.set(0, 0, 0) : a.position.set(e.position.x, e.position.y, e.position.z)), (e.target || e.position === "camera") && a.target.position.set(
-        e.target?.x || 0,
-        e.target?.y || 0,
-        e.target?.z === void 0 ? -1 : e.target.z
-      ), e.castShadow && (a.castShadow = !0, e.shadow && (a.shadow.mapSize.width = e.shadow.mapSize.width, a.shadow.mapSize.height = e.shadow.mapSize.height, a.shadow.camera.near = e.shadow.camera.near, a.shadow.camera.far = e.shadow.camera.far));
+      e = new H.DirectionalLight(t.color, t.intensity), t.position && (t.position === "camera" ? e.position.set(0, 0, 0) : e.position.set(t.position.x, t.position.y, t.position.z)), (t.target || t.position === "camera") && e.target.position.set(t.target?.x || 0, t.target?.y || 0, t.target?.z === void 0 ? -1 : t.target.z), t.castShadow && (e.castShadow = !0, t.shadow && (e.shadow.mapSize.width = t.shadow.mapSize.width, e.shadow.mapSize.height = t.shadow.mapSize.height, e.shadow.camera.near = t.shadow.camera.near, e.shadow.camera.far = t.shadow.camera.far));
       break;
     case "point":
-      a = new P.PointLight(
-        e.color,
-        e.intensity,
-        e.distance || 0,
-        e.decay || 2
-      ), e.position && (e.position === "camera" ? a.position.set(0, 0, 0) : a.position.set(e.position.x, e.position.y, e.position.z));
+      e = new H.PointLight(t.color, t.intensity, t.distance || 0, t.decay || 2), t.position && (t.position === "camera" ? e.position.set(0, 0, 0) : e.position.set(t.position.x, t.position.y, t.position.z));
       break;
     case "spot":
-      a = new P.SpotLight(
-        e.color,
-        e.intensity,
-        e.distance || 0,
-        e.angle || Math.PI / 3,
-        e.penumbra || 0,
-        e.decay || 2
-      ), e.position && (e.position === "camera" ? a.position.set(0, 0, 0) : a.position.set(e.position.x, e.position.y, e.position.z)), (e.target || e.position === "camera") && a.target.position.set(
-        e.target?.x || 0,
-        e.target?.y || 0,
-        e.target?.z || 0
-      ), e.castShadow && (a.castShadow = !0, e.shadow && (a.shadow.mapSize.width = e.shadow.mapSize.width, a.shadow.mapSize.height = e.shadow.mapSize.height, a.shadow.camera.near = e.shadow.camera.near, a.shadow.camera.far = e.shadow.camera.far));
+      e = new H.SpotLight(t.color, t.intensity, t.distance || 0, t.angle || Math.PI / 3, t.penumbra || 0, t.decay || 2), t.position && (t.position === "camera" ? e.position.set(0, 0, 0) : e.position.set(t.position.x, t.position.y, t.position.z)), (t.target || t.position === "camera") && e.target.position.set(t.target?.x || 0, t.target?.y || 0, t.target?.z || 0), t.castShadow && (e.castShadow = !0, t.shadow && (e.shadow.mapSize.width = t.shadow.mapSize.width, e.shadow.mapSize.height = t.shadow.mapSize.height, e.shadow.camera.near = t.shadow.camera.near, e.shadow.camera.far = t.shadow.camera.far));
       break;
     default:
       throw new Error("Unknown light type");
   }
-  return a;
+  return e;
 }
-function He(e) {
+function jt(t) {
   const {
-    width: a,
-    autoRotate: x,
-    data: b,
-    enableZoom: H,
-    categorical: R,
-    colorDomain: p,
-    colors: n,
-    globeMaterial: c,
-    height: V,
-    polygonData: $,
-    mapProperty: d,
-    mapBorderColor: G,
-    atmosphereColor: Z,
-    tooltip: J,
-    styles: C,
-    classNames: re,
-    mapNoDataColor: g,
-    colorLegendTitle: B,
-    showColorScale: ae,
-    hoverStrokeColor: se,
-    detailsOnClick: v,
-    onSeriesMouseClick: L,
-    onSeriesMouseOver: y,
-    resetSelectionOnDoubleClick: T,
-    highlightedIds: X,
-    scale: u,
-    globeOffset: j,
-    polygonAltitude: F,
-    centerLng: I,
+    width: e,
+    autoRotate: c,
+    data: v,
+    enableZoom: b,
+    categorical: C,
+    colorDomain: g,
+    colors: d,
+    globeMaterial: L,
+    height: m,
+    polygonData: B,
+    mapProperty: n,
+    mapBorderColor: Q,
+    atmosphereColor: ye,
+    tooltip: F,
+    styles: ve,
+    classNames: ee,
+    mapNoDataColor: te,
+    colorLegendTitle: u,
+    showColorScale: oe,
+    hoverStrokeColor: re,
+    detailsOnClick: S,
+    onSeriesMouseClick: I,
+    onSeriesMouseOver: be,
+    resetSelectionOnDoubleClick: xe,
+    highlightedIds: ae,
+    scale: O,
+    globeOffset: p,
+    polygonAltitude: h,
+    centerLng: _,
     centerLat: U,
-    atmosphereAltitude: _,
-    globeCurvatureResolution: ie,
+    atmosphereAltitude: se,
+    globeCurvatureResolution: W,
     fogSettings: M,
-    lights: z,
-    highlightedAltitude: Y,
+    lights: P,
+    highlightedAltitude: ie,
     selectedId: f,
-    collapseColorScaleByDefault: K
-  } = e, [Q, le] = N(!1), l = ye(void 0), [S, E] = N(void 0), [ne, ee] = N(
-    K === void 0 ? !(a < 680) : !K
-  ), [te, de] = N({ x: 0, y: 0 }), [k, ce] = N(void 0), W = R ? Me().domain(p).range(n) : ze().domain(p).range(n);
-  D(() => {
-    l.current && (l.current.controls().enableZoom = H);
-  }, [H]), D(() => {
-    l.current && (k || f ? l.current.controls().autoRotate = !1 : (l.current.controls().autoRotate = x !== 0, l.current.controls().autoRotateSpeed = x));
-  }, [k, f, x]), D(() => {
-    if (l.current && f) {
-      const t = $.find(
-        (m) => m.properties[d] === f
-      ), [r, i] = Le(t);
-      l.current.pointOfView({ lat: i, lng: r, altitude: u }, 1e3);
+    collapseColorScaleByDefault: q
+  } = t, [V, Z] = A(!1), i = Xe(void 0), [k, D] = A(void 0), [we, ne] = A(q === void 0 ? !(e < 680) : !q), [le, ce] = A({
+    x: 0,
+    y: 0
+  }), [x, de] = A(void 0), $ = C ? ft().domain(g).range(d) : yt().domain(g).range(d);
+  E(() => {
+    i.current && (i.current.controls().enableZoom = b);
+  }, [b]), E(() => {
+    i.current && (x || f ? i.current.controls().autoRotate = !1 : (i.current.controls().autoRotate = c !== 0, i.current.controls().autoRotateSpeed = c));
+  }, [x, f, c]), E(() => {
+    if (i.current && f) {
+      const o = B.find((y) => y.properties[n] === f), [r, s] = gt(o);
+      i.current.pointOfView({
+        lat: s,
+        lng: r,
+        altitude: O
+      }, 1e3);
     }
-  }, [f, u, $, d]), D(() => {
-    const t = l.current?.renderer().domElement;
-    if (!t) return;
-    const r = (i) => {
-      de({ x: i.clientX, y: i.clientY });
+  }, [f, O, B, n]), E(() => {
+    const o = i.current?.renderer().domElement;
+    if (!o) return;
+    const r = (s) => {
+      ce({
+        x: s.clientX,
+        y: s.clientY
+      });
     };
-    return t.addEventListener("mousemove", r), () => t.removeEventListener("mousemove", r);
-  }, []), D(() => {
-    l.current && l.current.pointOfView({ lat: U, lng: I, altitude: u }, 1e3);
-  }, [u, I, U]);
-  const q = c || new P.MeshBasicMaterial({
+    return o.addEventListener("mousemove", r), () => o.removeEventListener("mousemove", r);
+  }, []), E(() => {
+    i.current && i.current.pointOfView({
+      lat: U,
+      lng: _,
+      altitude: O
+    }, 1e3);
+  }, [O, _, U]);
+  const w = L || new H.MeshBasicMaterial({
     color: "#FFF"
-  }), h = ge(() => {
-    if (!l.current) return;
-    const t = l.current.scene(), r = l.current.camera();
-    let i = [];
-    t.traverse((s) => {
-      s instanceof P.Light && i.push(s);
-    }), i = [...i, ...r.children], i.forEach((s) => s.parent?.remove(s)), z.map((s) => Ae(s)).forEach((s, w) => {
-      z[w].type !== "ambient" && z[w].position === "camera" ? (r.add(s), z[w].type !== "point" && r.add(s.target)) : t.add(s);
-    }), M && (t.fog = new P.Fog(M.color, M.near, M.far));
-  }, [z, M]), oe = ge(() => {
-    le(!0), h();
-  }, [h]);
-  return D(() => {
-    Q && h();
-  }, [Q, h]), /* @__PURE__ */ o.jsxs("div", { className: "relative", children: [
-    /* @__PURE__ */ o.jsx(
-      we,
-      {
-        ref: l,
-        height: V,
-        width: a,
-        globeOffset: j,
-        lineHoverPrecision: 0,
-        polygonsData: $,
-        polygonAltitude: (t) => X.includes(t?.properties?.[d]) || t?.properties?.[d] === f ? Y * (t?.properties?.[d] === f ? 2 : 1) : t?.properties?.[d] === k?.id || t?.properties?.[d] === S?.id ? Y : F,
-        polygonCapColor: (t) => {
-          const r = t?.properties?.[d], i = b.find((m) => m.id === r)?.x;
-          return i != null ? W(i) : g;
-        },
-        polygonSideColor: (t) => {
-          const r = t?.properties?.[d], i = b.find((s) => s.id === r)?.x, m = i != null ? W(i) : g;
-          return X.includes(t?.properties?.[d]) || t?.properties?.[d] === f ? m : "rgba(100,100,100,0)";
-        },
-        polygonStrokeColor: (t) => t?.properties?.[d] === k?.id ? se : G,
-        onGlobeClick: () => {
-          E(void 0);
-        },
-        onPolygonClick: (t) => {
-          const r = t?.properties?.[d] ? b.find((i) => i.id === t?.properties?.[d]) : void 0;
-          (L || v) && (Ce(S, r) && T && r ? (E(void 0), L?.(void 0)) : (E(r), L?.(r)));
-        },
-        onPolygonHover: (t) => {
-          const r = t?.properties?.[d] ? b.find((i) => i.id === t?.properties?.[d]) : void 0;
-          ce(r), y?.(r);
-        },
-        atmosphereColor: Z,
-        atmosphereAltitude: _,
-        globeCurvatureResolution: ie,
-        globeMaterial: q,
-        backgroundColor: "rgba(0, 0, 0, 0)",
-        polygonsTransitionDuration: 100,
-        onGlobeReady: () => {
-          if (l.current) {
-            l.current.pointOfView({
-              lat: U,
-              lng: I
-            });
-            const t = l.current.scene();
-            setTimeout(() => {
-              (t.children[3]?.children[0]?.children[4]?.children || []).forEach((m) => {
-                const s = m.children[1];
-                s.renderOrder = 2;
-              });
-            }, 300);
-            const r = l.current.camera();
-            t.add(r), oe();
-          }
-        }
-      }
-    ),
-    ae === !1 ? null : /* @__PURE__ */ o.jsx("div", { className: "absolute left-4 bottom-4", children: ne ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-      /* @__PURE__ */ o.jsx(
-        "div",
-        {
-          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: () => {
-            ee(!1);
-          },
-          children: /* @__PURE__ */ o.jsx(De, {})
-        }
-      ),
-      /* @__PURE__ */ o.jsxs(
-        "div",
-        {
-          className: "color-legend-box p-2 bg-[rgba(240,240,240,0.7)] dark:bg-[rgba(30,30,30,0.7)]",
-          style: {
-            width: R ? void 0 : "340px"
-          },
-          children: [
-            B && B !== "" ? /* @__PURE__ */ o.jsx(
-              ue,
-              {
-                size: "xs",
-                marginBottom: "xs",
-                className: "p-0 leading-normal overflow-hidden text-primary-gray-700 dark:text-primary-gray-300",
-                style: {
-                  display: "-webkit-box",
-                  WebkitLineClamp: "1",
-                  WebkitBoxOrient: "vertical"
-                },
-                children: B
-              }
-            ) : null,
-            R ? /* @__PURE__ */ o.jsx("div", { className: "flex flex-col gap-3", children: p.map((t, r) => /* @__PURE__ */ o.jsxs("div", { className: "flex gap-2 items-center", children: [
-              /* @__PURE__ */ o.jsx(
-                "div",
-                {
-                  className: "w-2 h-2 rounded-full",
-                  style: { backgroundColor: n[r % n.length] }
-                }
-              ),
-              /* @__PURE__ */ o.jsx(ue, { size: "sm", marginBottom: "none", leading: "none", children: t })
-            ] }, r)) }) : /* @__PURE__ */ o.jsx("svg", { width: "100%", viewBox: "0 0 320 30", direction: "ltr", children: /* @__PURE__ */ o.jsxs("g", { children: [
-              p.map((t, r) => /* @__PURE__ */ o.jsxs("g", { className: "cursor-pointer", children: [
-                /* @__PURE__ */ o.jsx(
-                  "rect",
-                  {
-                    x: r * 320 / n.length + 1,
-                    y: 1,
-                    width: 320 / n.length - 2,
-                    height: 8,
-                    style: {
-                      fill: n[r],
-                      stroke: n[r]
-                    }
-                  }
-                ),
-                /* @__PURE__ */ o.jsx(
-                  "text",
-                  {
-                    x: (r + 1) * 320 / n.length,
-                    y: 25,
-                    className: "fill-primary-gray-700 dark:fill-primary-gray-300 text-xs",
-                    style: { textAnchor: "middle" },
-                    children: ke(t, "NA")
-                  }
-                )
-              ] }, r)),
-              /* @__PURE__ */ o.jsx("g", { children: /* @__PURE__ */ o.jsx(
-                "rect",
-                {
-                  x: p.length * 320 / n.length + 1,
-                  y: 1,
-                  width: 320 / n.length - 2,
-                  height: 8,
-                  style: {
-                    fill: n[p.length],
-                    stroke: n[p.length]
-                  }
-                }
-              ) })
-            ] }) })
-          ]
-        }
-      )
-    ] }) : /* @__PURE__ */ o.jsx(
-      "button",
-      {
-        type: "button",
-        className: "mb-0 border-0 bg-transparent p-0 self-start",
-        onClick: () => {
-          ee(!0);
-        },
-        children: /* @__PURE__ */ o.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" })
-      }
-    ) }),
-    k && J ? /* @__PURE__ */ o.jsx(
-      Se,
-      {
-        data: k,
-        body: J,
-        xPos: te.x,
-        yPos: te.y,
-        backgroundStyle: C?.tooltip,
-        className: re?.tooltip
-      }
-    ) : null,
-    v && S !== void 0 ? /* @__PURE__ */ o.jsx(
-      je,
-      {
-        open: S !== void 0,
-        onClose: () => {
-          E(void 0);
-        },
-        children: /* @__PURE__ */ o.jsx(
-          "div",
-          {
-            className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof v == "string" ? { __html: Ne(v, S) } : void 0,
-            children: typeof v == "function" ? v(S) : null
-          }
-        )
+  }), z = st(() => {
+    if (!i.current) return;
+    const o = i.current.scene(), r = i.current.camera();
+    let s = [];
+    o.traverse((l) => {
+      l instanceof H.Light && s.push(l);
+    }), s = [...s, ...r.children], s.forEach((l) => l.parent?.remove(l)), P.map((l) => Dt(l)).forEach((l, T) => {
+      P[T].type !== "ambient" && P[T].position === "camera" ? (r.add(l), P[T].type !== "point" && r.add(l.target)) : o.add(l);
+    }), M && (o.fog = new H.Fog(M.color, M.near, M.far));
+  }, [P, M]), j = () => {
+    Z(!0), z();
+  };
+  return E(() => {
+    V && z();
+  }, [V, z]), /* @__PURE__ */ a.jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ a.jsx(lt, { ref: i, height: m, width: e, globeOffset: p, lineHoverPrecision: 0, polygonsData: B, polygonAltitude: (o) => ae.includes(o?.properties?.[n]) || o?.properties?.[n] === f ? ie * (o?.properties?.[n] === f ? 2 : 1) : o?.properties?.[n] === x?.id || o?.properties?.[n] === k?.id ? ie : h, polygonCapColor: (o) => {
+      const r = o?.properties?.[n], s = v.find((y) => y.id === r)?.x;
+      return s != null ? $(s) : te;
+    }, polygonSideColor: (o) => {
+      const r = o?.properties?.[n], s = v.find((l) => l.id === r)?.x, y = s != null ? $(s) : te;
+      return ae.includes(o?.properties?.[n]) || o?.properties?.[n] === f ? y : "rgba(100,100,100,0)";
+    }, polygonStrokeColor: (o) => o?.properties?.[n] === x?.id ? re : Q, onGlobeClick: () => {
+      D(void 0);
+    }, onPolygonClick: (o) => {
+      const r = o?.properties?.[n] ? v.find((s) => s.id === o?.properties?.[n]) : void 0;
+      (I || S) && (ct(k, r) && xe && r ? (D(void 0), I?.(void 0)) : (D(r), I?.(r)));
+    }, onPolygonHover: (o) => {
+      const r = o?.properties?.[n] ? v.find((s) => s.id === o?.properties?.[n]) : void 0;
+      de(r), be?.(r);
+    }, atmosphereColor: ye, atmosphereAltitude: se, globeCurvatureResolution: W, globeMaterial: w, backgroundColor: "rgba(0, 0, 0, 0)", polygonsTransitionDuration: 100, onGlobeReady: () => {
+      if (i.current) {
+        i.current.pointOfView({
+          lat: U,
+          lng: _
+        });
+        const o = i.current.scene();
+        setTimeout(() => {
+          (o.children[3]?.children[0]?.children[4]?.children || []).forEach((y) => {
+            const l = y.children[1];
+            l.renderOrder = 2;
+          });
+        }, 300);
+        const r = i.current.camera();
+        o.add(r), j();
       }
-    ) : null
+    } }),
+    oe === !1 ? null : /* @__PURE__ */ a.jsx("div", { className: rt("absolute left-4 bottom-4 map-color-legend", ee?.colorLegend), children: we ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+      /* @__PURE__ */ a.jsx("div", { 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: () => {
+        ne(!1);
+      }, children: /* @__PURE__ */ a.jsx(mt, {}) }),
+      /* @__PURE__ */ a.jsxs("div", { className: "color-legend-box p-2 bg-[rgba(240,240,240,0.7)] dark:bg-[rgba(30,30,30,0.7)]", style: {
+        width: C ? void 0 : "340px"
+      }, children: [
+        u && u !== "" ? /* @__PURE__ */ a.jsx(Ye, { size: "xs", marginBottom: "xs", className: "p-0 leading-normal overflow-hidden text-primary-gray-700 dark:text-primary-gray-300", style: {
+          display: "-webkit-box",
+          WebkitLineClamp: "1",
+          WebkitBoxOrient: "vertical"
+        }, children: u }) : null,
+        C ? /* @__PURE__ */ a.jsx("div", { className: "flex flex-col gap-3", children: g.map((o, r) => /* @__PURE__ */ a.jsxs("div", { className: "flex gap-2 items-center", children: [
+          /* @__PURE__ */ a.jsx("div", { className: "w-2 h-2 rounded-full", style: {
+            backgroundColor: d[r % d.length]
+          } }),
+          /* @__PURE__ */ a.jsx(Ye, { size: "sm", marginBottom: "none", leading: "none", children: o })
+        ] }, r)) }) : /* @__PURE__ */ a.jsx("svg", { width: "100%", viewBox: "0 0 320 30", direction: "ltr", children: /* @__PURE__ */ a.jsxs("g", { children: [
+          g.map((o, r) => /* @__PURE__ */ a.jsxs("g", { className: "cursor-pointer", children: [
+            /* @__PURE__ */ a.jsx("rect", { x: r * 320 / d.length + 1, y: 1, width: 320 / d.length - 2, height: 8, style: {
+              fill: d[r],
+              stroke: d[r]
+            } }),
+            /* @__PURE__ */ a.jsx("text", { x: (r + 1) * 320 / d.length, y: 25, className: "fill-primary-gray-700 dark:fill-primary-gray-300 text-xs", style: {
+              textAnchor: "middle"
+            }, children: ht(o, "NA") })
+          ] }, r)),
+          /* @__PURE__ */ a.jsx("g", { children: /* @__PURE__ */ a.jsx("rect", { x: g.length * 320 / d.length + 1, y: 1, width: 320 / d.length - 2, height: 8, style: {
+            fill: d[g.length],
+            stroke: d[g.length]
+          } }) })
+        ] }) })
+      ] })
+    ] }) : /* @__PURE__ */ a.jsx("button", { type: "button", className: "mb-0 border-0 bg-transparent p-0 self-start", onClick: () => {
+      ne(!0);
+    }, children: /* @__PURE__ */ a.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" }) }) }),
+    x && F ? /* @__PURE__ */ a.jsx(pt, { data: x, body: F, xPos: le.x, yPos: le.y, backgroundStyle: ve?.tooltip, className: ee?.tooltip }) : null,
+    S && k !== void 0 ? /* @__PURE__ */ a.jsx(dt, { open: k !== void 0, onClose: () => {
+      D(void 0);
+    }, children: /* @__PURE__ */ a.jsx("div", { className: "graph-modal-content m-0", dangerouslySetInnerHTML: typeof S == "string" ? {
+      __html: ut(S, k)
+    } : void 0, children: typeof S == "function" ? S(k) : null }) }) : null
   ] });
 }
-function at(e) {
-  const {
-    data: a,
-    mapData: x = "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json",
+function to(t) {
+  const e = at.c(96), {
+    data: c,
+    mapData: v,
     graphTitle: b,
-    colors: H,
-    sources: R,
-    graphDescription: p,
-    height: n,
-    width: c,
-    footNote: V = "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: $,
-    colorLegendTitle: d,
-    scaleType: G = "threshold",
-    padding: Z,
-    mapNoDataColor: J = A.light.graphNoData,
-    backgroundColor: C = !1,
-    mapBorderColor: re = A.light.grays["gray-500"],
-    relativeHeight: g,
-    tooltip: B,
-    graphID: ae,
-    mapProperty: se = "ISO3",
-    dataDownload: v = !1,
-    language: L = "en",
-    minHeight: y = 0,
-    theme: T = "light",
-    ariaLabel: X,
-    styles: u,
-    classNames: j,
-    autoRotate: F = !0,
-    enableZoom: I = !0,
-    globeMaterial: U,
-    centerPoint: _ = [0, 0],
-    atmosphereColor: ie = "#999",
-    showColorScale: M = !0,
-    resetSelectionOnDoubleClick: z = !0,
-    detailsOnClick: Y,
-    onSeriesMouseOver: f,
-    onSeriesMouseClick: K,
-    highlightedIds: Q = [],
-    highlightedAltitude: le = 0.1,
-    scale: l = 1,
-    globeOffset: S = [0, 0],
-    polygonAltitude: E = 0.01,
-    globeCurvatureResolution: ne = 4,
-    atmosphereAltitude: ee = 0.15,
-    fogSettings: te,
-    lights: de = [
-      {
-        type: "ambient",
-        color: 4210752,
-        intensity: 0.4
-      },
-      {
-        type: "directional",
-        color: 16777215,
-        intensity: 1,
-        position: { x: 5, y: 10, z: 5 }
-      }
-    ],
-    selectedId: k,
-    collapseColorScaleByDefault: ce
-  } = e, [W, q] = N(void 0), [h, oe] = N(0), [t, r] = N(0), i = ye(null);
-  D(() => {
-    const s = new ResizeObserver((w) => {
-      oe(c || w[0].target.clientWidth || 760), r(n || w[0].target.clientHeight || 480);
-    });
-    return i.current && (r(i.current.clientHeight || 480), oe(i.current.clientWidth || 760), c || s.observe(i.current)), () => s.disconnect();
-  }, [c, n]), D(() => {
-    typeof x == "string" ? Re(x).then((w) => {
-      if (x === "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json") {
-        const fe = w.features.map((O) => {
-          if (O.geometry.type === "Polygon") {
-            const he = [...O.geometry.coordinates[0]].reverse(), pe = { ...O.geometry, coordinates: [he] };
-            return { ...O, geometry: pe };
-          }
-          const me = [];
-          O.geometry.coordinates.forEach((he) => {
-            const pe = [...he[0]].reverse();
-            me.push([pe]);
-          });
-          const xe = { ...O.geometry, coordinates: me };
-          return { ...O, geometry: xe };
-        });
-        q(fe);
-      } else q(w.features);
-    }) : q(x.features);
-  }, [x]);
-  const m = $ || (G === "categorical" ? Te(a, "x") : Ee(
-    a.map((s) => s.x),
-    H?.length || 4
-  ));
-  return /* @__PURE__ */ o.jsx(
-    "div",
-    {
-      className: `${T || "light"} flex  ${c ? "w-fit grow-0" : "w-full grow"}`,
-      dir: L === "he" || L === "ar" ? "rtl" : void 0,
-      children: /* @__PURE__ */ o.jsx(
-        "div",
-        {
-          className: be(
-            `${C ? C === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${L || "en"}`,
-            c ? "w-fit" : "w-full",
-            j?.graphContainer
-          ),
-          style: {
-            ...u?.graphContainer || {},
-            ...C && C !== !0 ? { backgroundColor: C } : {}
-          },
-          id: ae,
-          "aria-label": X || `${b ? `The graph shows ${b}. ` : ""}This is a map.${p ? ` ${p}` : ""}`,
-          children: /* @__PURE__ */ o.jsx(
-            "div",
-            {
-              className: "flex grow",
-              style: { padding: C ? Z || "1rem" : Z || 0 },
-              children: /* @__PURE__ */ o.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                b || p || v ? /* @__PURE__ */ o.jsx(
-                  Oe,
-                  {
-                    styles: {
-                      title: u?.title,
-                      description: u?.description
-                    },
-                    classNames: {
-                      title: j?.title,
-                      description: j?.description
-                    },
-                    graphTitle: b,
-                    graphDescription: p,
-                    width: c,
-                    graphDownload: void 0,
-                    dataDownload: v ? a.map((s) => s.data).filter((s) => s !== void 0).length > 0 ? a.map((s) => s.data).filter((s) => s !== void 0) : a.filter((s) => s !== void 0) : null
-                  }
-                ) : null,
-                /* @__PURE__ */ o.jsx(
-                  "div",
-                  {
-                    className: "flex flex-col grow justify-center leading-0",
-                    ref: i,
-                    "aria-label": "Map area",
-                    children: (c || h) && (n || t) && W ? /* @__PURE__ */ o.jsx(
-                      He,
-                      {
-                        data: a,
-                        globeOffset: S,
-                        polygonData: W,
-                        colorDomain: m,
-                        width: c || h,
-                        height: Math.max(
-                          y,
-                          n || (g ? y ? (c || h) * g > y ? (c || h) * g : y : (c || h) * g : t)
-                        ),
-                        colors: H || (G === "categorical" ? A[T].sequentialColors[`neutralColorsx0${m.length}`] : A[T].sequentialColors[`neutralColorsx0${m.length + 1}`]),
-                        mapNoDataColor: J,
-                        categorical: G === "categorical",
-                        mapBorderColor: re,
-                        tooltip: B,
-                        mapProperty: se,
-                        styles: u,
-                        classNames: j,
-                        autoRotate: F === !0 ? 1.5 : F === !1 ? 0 : F,
-                        enableZoom: I,
-                        globeMaterial: U,
-                        atmosphereColor: ie,
-                        colorLegendTitle: d,
-                        showColorScale: M,
-                        hoverStrokeColor: T === "light" ? A.light.grays["gray-700"] : A.light.grays["gray-300"],
-                        highlightedIds: Q,
-                        resetSelectionOnDoubleClick: z,
-                        detailsOnClick: Y,
-                        onSeriesMouseOver: f,
-                        onSeriesMouseClick: K,
-                        scale: l,
-                        polygonAltitude: E,
-                        centerLat: _[0],
-                        centerLng: _[1],
-                        atmosphereAltitude: ee,
-                        globeCurvatureResolution: ne,
-                        fogSettings: te,
-                        lights: de,
-                        highlightedAltitude: le,
-                        selectedId: k,
-                        collapseColorScaleByDefault: ce
-                      }
-                    ) : /* @__PURE__ */ o.jsx(
-                      "div",
-                      {
-                        style: {
-                          height: `${Math.max(
-                            y,
-                            n || (g ? y ? (c || h) * g > y ? (c || h) * g : y : (c || h) * g : t)
-                          )}px`
-                        },
-                        className: "flex items-center justify-center",
-                        children: /* @__PURE__ */ o.jsx(ve, { "aria-label": "Loading graph" })
-                      }
-                    )
-                  }
-                ),
-                R || V ? /* @__PURE__ */ o.jsx(
-                  Pe,
-                  {
-                    styles: { footnote: u?.footnote, source: u?.source },
-                    classNames: {
-                      footnote: j?.footnote,
-                      source: j?.source
-                    },
-                    sources: R,
-                    footNote: V,
-                    width: c
-                  }
-                ) : null
-              ] })
-            }
-          )
-        }
-      )
+    colors: C,
+    sources: g,
+    graphDescription: d,
+    height: L,
+    width: m,
+    footNote: B,
+    colorDomain: n,
+    colorLegendTitle: Q,
+    scaleType: ye,
+    padding: F,
+    mapNoDataColor: ve,
+    backgroundColor: ee,
+    mapBorderColor: te,
+    relativeHeight: u,
+    tooltip: oe,
+    graphID: re,
+    mapProperty: S,
+    dataDownload: I,
+    language: be,
+    minHeight: xe,
+    theme: ae,
+    ariaLabel: O,
+    styles: p,
+    classNames: h,
+    autoRotate: _,
+    enableZoom: U,
+    globeMaterial: se,
+    centerPoint: W,
+    atmosphereColor: M,
+    showColorScale: P,
+    resetSelectionOnDoubleClick: ie,
+    detailsOnClick: f,
+    onSeriesMouseOver: q,
+    onSeriesMouseClick: V,
+    highlightedIds: Z,
+    highlightedAltitude: i,
+    scale: k,
+    globeOffset: D,
+    polygonAltitude: we,
+    globeCurvatureResolution: ne,
+    atmosphereAltitude: le,
+    fogSettings: ce,
+    lights: x,
+    selectedId: de,
+    collapseColorScaleByDefault: $
+  } = t, w = v === void 0 ? "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json" : v, z = B === void 0 ? "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." : B, j = ye === void 0 ? "threshold" : ye, o = ve === void 0 ? K.light.graphNoData : ve, r = ee === void 0 ? !1 : ee, s = te === void 0 ? K.light.grays["gray-500"] : te, y = S === void 0 ? "ISO3" : S, l = I === void 0 ? !1 : I, T = be === void 0 ? "en" : be, N = xe === void 0 ? 0 : xe, R = ae === void 0 ? "light" : ae, pe = _ === void 0 ? !0 : _, Ae = U === void 0 ? !0 : U;
+  let Ce;
+  e[0] !== W ? (Ce = W === void 0 ? [0, 0] : W, e[0] = W, e[1] = Ce) : Ce = e[1];
+  const Se = Ce, Te = M === void 0 ? "#999" : M, Ge = P === void 0 ? !0 : P, He = ie === void 0 ? !0 : ie;
+  let ke;
+  e[2] !== Z ? (ke = Z === void 0 ? [] : Z, e[2] = Z, e[3] = ke) : ke = e[3];
+  const Be = ke, Fe = i === void 0 ? 0.1 : i, Ie = k === void 0 ? 1 : k;
+  let De;
+  e[4] !== D ? (De = D === void 0 ? [0, 0] : D, e[4] = D, e[5] = De) : De = e[5];
+  const _e = De, Ue = we === void 0 ? 0.01 : we, We = ne === void 0 ? 4 : ne, qe = le === void 0 ? 0.15 : le;
+  let je;
+  e[6] !== x ? (je = x === void 0 ? [{
+    type: "ambient",
+    color: 4210752,
+    intensity: 0.4
+  }, {
+    type: "directional",
+    color: 16777215,
+    intensity: 1,
+    position: {
+      x: 5,
+      y: 10,
+      z: 5
     }
-  );
+  }] : x, e[6] = x, e[7] = je) : je = e[7];
+  const Ve = je, [Ne, Ke] = A(void 0), [G, Qe] = A(0), [he, et] = A(0), Ze = Xe(null), tt = Xe(null);
+  let Le, Oe;
+  e[8] === Symbol.for("react.memo_cache_sentinel") ? (Le = () => {
+    const ge = new ResizeObserver((fe) => {
+      Qe(fe[0].target.clientWidth || 620), et(fe[0].target.clientHeight || 480);
+    });
+    return Ze.current && ge.observe(Ze.current), () => ge.disconnect();
+  }, Oe = [], e[8] = Le, e[9] = Oe) : (Le = e[8], Oe = e[9]), E(Le, Oe);
+  let Me;
+  e[10] === Symbol.for("react.memo_cache_sentinel") ? (Me = (ge) => {
+    Ke(ge);
+  }, e[10] = Me) : Me = e[10];
+  const me = it(Me);
+  let Pe;
+  e[11] !== w || e[12] !== me ? (Pe = () => {
+    typeof w == "string" ? xt(w).then((fe) => {
+      if (w === "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json") {
+        const ot = fe.features.map(Rt);
+        me(ot);
+      } else
+        me(fe.features);
+    }) : me(w.features);
+  }, e[11] = w, e[12] = me, e[13] = Pe) : Pe = e[13];
+  let ze;
+  e[14] !== w ? (ze = [w], e[14] = w, e[15] = ze) : ze = e[15], E(Pe, ze);
+  let Re;
+  e[16] !== n || e[17] !== C?.length || e[18] !== c || e[19] !== j ? (Re = n || (j === "categorical" ? wt(c, "x") : Ct(c.map(zt), C?.length || 4)), e[16] = n, e[17] = C?.length, e[18] = c, e[19] = j, e[20] = Re) : Re = e[20];
+  const ue = Re, $e = h?.graphContainer, Je = p?.graphContainer;
+  let J;
+  e[21] !== h?.description || e[22] !== h?.title || e[23] !== c || e[24] !== l || e[25] !== d || e[26] !== b || e[27] !== p?.description || e[28] !== p?.title || e[29] !== m ? (J = b || d || l ? /* @__PURE__ */ a.jsx(vt, { styles: {
+    title: p?.title,
+    description: p?.description
+  }, classNames: {
+    title: h?.title,
+    description: h?.description
+  }, graphTitle: b, graphDescription: d, width: m, graphDownload: void 0, dataDownload: l ? c.map(Pt).filter(Mt).length > 0 ? c.map(Ot).filter(Lt) : c.filter(Nt) : null }) : null, e[21] = h?.description, e[22] = h?.title, e[23] = c, e[24] = l, e[25] = d, e[26] = b, e[27] = p?.description, e[28] = p?.title, e[29] = m, e[30] = J) : J = e[30];
+  let X;
+  e[31] !== qe || e[32] !== Te || e[33] !== pe || e[34] !== Se || e[35] !== h || e[36] !== $ || e[37] !== Q || e[38] !== C || e[39] !== c || e[40] !== f || e[41] !== ue || e[42] !== Ae || e[43] !== ce || e[44] !== We || e[45] !== se || e[46] !== _e || e[47] !== L || e[48] !== Fe || e[49] !== Be || e[50] !== Ve || e[51] !== s || e[52] !== o || e[53] !== y || e[54] !== Ne || e[55] !== N || e[56] !== V || e[57] !== q || e[58] !== Ue || e[59] !== u || e[60] !== He || e[61] !== Ie || e[62] !== j || e[63] !== de || e[64] !== Ge || e[65] !== p || e[66] !== he || e[67] !== G || e[68] !== R || e[69] !== oe || e[70] !== m ? (X = /* @__PURE__ */ a.jsx(St, { ref: Ze, children: G && he && Ne ? /* @__PURE__ */ a.jsx(jt, { data: c, globeOffset: _e, polygonData: Ne, colorDomain: ue, width: G, height: he, colors: C || (j === "categorical" ? K[R].sequentialColors[`neutralColorsx0${ue.length}`] : K[R].sequentialColors[`neutralColorsx0${ue.length + 1}`]), mapNoDataColor: o, categorical: j === "categorical", mapBorderColor: s, tooltip: oe, mapProperty: y, styles: p, classNames: h, autoRotate: pe === !0 ? 1.5 : pe === !1 ? 0 : pe, enableZoom: Ae, globeMaterial: se, atmosphereColor: Te, colorLegendTitle: Q, showColorScale: Ge, hoverStrokeColor: R === "light" ? K.light.grays["gray-700"] : K.light.grays["gray-300"], highlightedIds: Be, resetSelectionOnDoubleClick: He, detailsOnClick: f, onSeriesMouseOver: q, onSeriesMouseClick: V, scale: Ie, polygonAltitude: Ue, centerLat: Se[0], centerLng: Se[1], atmosphereAltitude: qe, globeCurvatureResolution: We, fogSettings: ce, lights: Ve, highlightedAltitude: Fe, selectedId: de, collapseColorScaleByDefault: $ }) : /* @__PURE__ */ a.jsx("div", { style: {
+    height: `${Math.max(N, L || (u ? N ? (m || G) * u > N ? (m || G) * u : N : (m || G) * u : he))}px`
+  }, className: "flex items-center justify-center", children: /* @__PURE__ */ a.jsx(nt, { "aria-label": "Loading graph" }) }) }), e[31] = qe, e[32] = Te, e[33] = pe, e[34] = Se, e[35] = h, e[36] = $, e[37] = Q, e[38] = C, e[39] = c, e[40] = f, e[41] = ue, e[42] = Ae, e[43] = ce, e[44] = We, e[45] = se, e[46] = _e, e[47] = L, e[48] = Fe, e[49] = Be, e[50] = Ve, e[51] = s, e[52] = o, e[53] = y, e[54] = Ne, e[55] = N, e[56] = V, e[57] = q, e[58] = Ue, e[59] = u, e[60] = He, e[61] = Ie, e[62] = j, e[63] = de, e[64] = Ge, e[65] = p, e[66] = he, e[67] = G, e[68] = R, e[69] = oe, e[70] = m, e[71] = X) : X = e[71];
+  let Y;
+  e[72] !== h?.footnote || e[73] !== h?.source || e[74] !== z || e[75] !== g || e[76] !== p?.footnote || e[77] !== p?.source || e[78] !== m ? (Y = g || z ? /* @__PURE__ */ a.jsx(bt, { styles: {
+    footnote: p?.footnote,
+    source: p?.source
+  }, classNames: {
+    footnote: h?.footnote,
+    source: h?.source
+  }, sources: g, footNote: z, width: m }) : null, e[72] = h?.footnote, e[73] = h?.source, e[74] = z, e[75] = g, e[76] = p?.footnote, e[77] = p?.source, e[78] = m, e[79] = Y) : Y = e[79];
+  let Ee;
+  return e[80] !== O || e[81] !== r || e[82] !== re || e[83] !== L || e[84] !== T || e[85] !== N || e[86] !== F || e[87] !== u || e[88] !== $e || e[89] !== Je || e[90] !== J || e[91] !== X || e[92] !== Y || e[93] !== R || e[94] !== m ? (Ee = /* @__PURE__ */ a.jsxs(kt, { className: $e, style: Je, id: re, ref: tt, "aria-label": O, backgroundColor: r, theme: R, language: T, minHeight: N, width: m, height: L, relativeHeight: u, padding: F, children: [
+    J,
+    X,
+    Y
+  ] }), e[80] = O, e[81] = r, e[82] = re, e[83] = L, e[84] = T, e[85] = N, e[86] = F, e[87] = u, e[88] = $e, e[89] = Je, e[90] = J, e[91] = X, e[92] = Y, e[93] = R, e[94] = m, e[95] = Ee) : Ee = e[95], Ee;
+}
+function Nt(t) {
+  return t !== void 0;
+}
+function Lt(t) {
+  return t !== void 0;
+}
+function Ot(t) {
+  return t.data;
+}
+function Mt(t) {
+  return t !== void 0;
+}
+function Pt(t) {
+  return t.data;
+}
+function zt(t) {
+  return t.x;
+}
+function Rt(t) {
+  if (t.geometry.type === "Polygon") {
+    const v = [...t.geometry.coordinates[0]].reverse(), b = {
+      ...t.geometry,
+      coordinates: [v]
+    };
+    return {
+      ...t,
+      geometry: b
+    };
+  }
+  const e = [];
+  t.geometry.coordinates.forEach((v) => {
+    const b = [...v[0]].reverse();
+    e.push([b]);
+  });
+  const c = {
+    ...t.geometry,
+    coordinates: e
+  };
+  return {
+    ...t,
+    geometry: c
+  };
 }
 export {
-  at as ThreeDGlobe
+  to as ThreeDGlobe
 };
 //# sourceMappingURL=ThreeDGlobe.js.map