@undp/data-viz 1.2.8 → 1.3.1

package/dist/DotDensityMap.js

@@ -0,0 +1,601 @@
+import { j as r, m as ke } from "./index-CHPV5EwG-BPSP-7Jg.js";
+import { useState as g, useRef as Y, useEffect as pe } from "react";
+import { u as be } from "./index-CaAIPGZo.js";
+import { p as De, f as Ce } from "./parse-DlCRUFh_.js";
+import { s as Ne, g as $e, x as Me } from "./getSliderMarks-C0jptXeP.js";
+import { y as Oe } from "./Spinner-C85UF28E.js";
+import { i as Se } from "./index-27yTRcko.js";
+import { z as Ee, t as Pe, a as Ie, g as Le, b as ze, c as Te, d as Ve, e as We } from "./zoom-_lqdiGoI.js";
+import { X as Ae } from "./Modal-CUU6ZK3U.js";
+import { u as Be } from "./Typography-Ctgfl1J5.js";
+import { T as He } from "./Tooltip-DyM5snqx.js";
+import { Colors as D } from "./Colors.js";
+import { s as Re } from "./string2HTML-CWHGfz_d.js";
+import { X as Xe, P as Fe, f as qe } from "./index-BmCqpO1B.js";
+import { u as Ue } from "./use-in-view-BAHrBy6b.js";
+import { s as _e } from "./pow-e8zx3AQJ.js";
+import { s as ve } from "./select-DKy99ogv.js";
+import { m as me } from "./proxy-DJxJg1kD.js";
+import { A as Ge } from "./index-BxAUvrua.js";
+import { GraphFooter as Ye } from "./GraphFooter.js";
+import { GraphHeader as Ke } from "./GraphHeader.js";
+import { f as Ze } from "./fetchAndParseData-Bcmr659B.js";
+import { c as we } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { c as Je } from "./init-BhZylTFx.js";
+function Qe(ue) {
+  const {
+    data: l,
+    colors: s,
+    mapData: C,
+    colorLegendTitle: S,
+    colorDomain: v,
+    radius: b,
+    height: m,
+    width: o,
+    scale: K,
+    centerPoint: E,
+    tooltip: Z,
+    showLabels: he,
+    mapBorderWidth: J,
+    mapBorderColor: Q,
+    mapNoDataColor: B,
+    onSeriesMouseOver: ee,
+    showColorScale: ge,
+    zoomScaleExtend: N,
+    zoomTranslateExtend: fe,
+    highlightedDataPoints: te,
+    onSeriesMouseClick: H,
+    resetSelectionOnDoubleClick: f,
+    detailsOnClick: $,
+    styles: re,
+    classNames: ye,
+    mapProjection: T,
+    zoomInteraction: P,
+    animate: y,
+    dimmedOpacity: ae,
+    customLayers: oe,
+    maxRadiusValue: ie
+  } = ue, [R, ne] = g(void 0), [X, h] = g(!(o < 680)), V = Y(null), [I, F] = g(void 0), [le, x] = g(void 0), [w, q] = g(void 0), [se, W] = g(void 0), L = Y(null), U = Ue(L, {
+    once: y.once,
+    amount: y.amount
+  }), _ = Y(null), d = l.filter((e) => e.radius === void 0 || e.radius === null).length !== l.length ? _e().domain([0, ie]).range([0.25, b]).nice() : void 0;
+  pe(() => {
+    const e = ve(_.current), u = ve(L.current), a = (i) => {
+      if (P === "noZoom") return !1;
+      if (P === "button") return !i.type.includes("wheel");
+      const t = i.type === "wheel", c = i.type.startsWith("touch"), k = i.type === "mousedown" || i.type === "mousemove";
+      return c ? !0 : t ? P === "scroll" ? !0 : i.ctrlKey : k && !i.button && !i.ctrlKey;
+    }, j = Ee().scaleExtent(N).translateExtent(
+      fe || [
+        [-20, -20],
+        [o + 20, m + 20]
+      ]
+    ).filter(a).on("zoom", ({ transform: i }) => {
+      e.attr("transform", i);
+    });
+    u.call(j), V.current = j;
+  }, [m, o, P]);
+  const p = Pe(C), M = Ie(C), G = p[2] - p[0], ce = p[3] - p[1], z = o * 190 / 960 * 360 / G, xe = m * 190 / 678 * 180 / ce, n = K * Math.min(z, xe), O = T === "mercator" ? Le().rotate([0, 0]).center(E || M.geometry.coordinates).translate([o / 2, m / 2]).scale(n) : T === "equalEarth" ? ze().rotate([0, 0]).center(E || M.geometry.coordinates).translate([o / 2, m / 2]).scale(n) : T === "naturalEarth" ? Te().rotate([0, 0]).center(E || M.geometry.coordinates).translate([o / 2, m / 2]).scale(n) : T === "orthographic" ? Ve().rotate([0, 0]).center(E || M.geometry.coordinates).translate([o / 2, m / 2]).scale(n) : We().rotate([0, 0]).center(E || M.geometry.coordinates).translate([o / 2, m / 2]).scale(n), A = (e) => {
+    if (!L.current || !V.current) return;
+    ve(L.current).call(V.current.scaleBy, e === "in" ? 1.2 : 1 / 1.2);
+  };
+  return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+    /* @__PURE__ */ r.jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ r.jsx(
+        me.svg,
+        {
+          width: `${o}px`,
+          height: `${m}px`,
+          viewBox: `0 0 ${o} ${m}`,
+          ref: L,
+          direction: "ltr",
+          children: /* @__PURE__ */ r.jsxs("g", { ref: _, children: [
+            oe.filter((e) => e.position === "before").map((e) => e.layer),
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            C.features.map((e, u) => /* @__PURE__ */ r.jsx("g", { children: e.geometry.type === "MultiPolygon" ? (
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+              e.geometry.coordinates.map((a, j) => {
+                let i = "";
+                return a.forEach((t) => {
+                  let c = " M";
+                  t.forEach((k, je) => {
+                    const de = O([k[0], k[1]]);
+                    je !== t.length - 1 ? c = `${c}${de[0]} ${de[1]}L` : c = `${c}${de[0]} ${de[1]}`;
+                  }), i += c;
+                }), /* @__PURE__ */ r.jsx(
+                  "path",
+                  {
+                    d: i,
+                    style: {
+                      stroke: Q,
+                      strokeWidth: J,
+                      fill: B
+                    }
+                  },
+                  j
+                );
+              })
+            ) : (
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+              e.geometry.coordinates.map((a, j) => {
+                let i = "M";
+                return a.forEach((t, c) => {
+                  const k = O([t[0], t[1]]);
+                  c !== a.length - 1 ? i = `${i}${k[0]} ${k[1]}L` : i = `${i}${k[0]} ${k[1]}`;
+                }), /* @__PURE__ */ r.jsx(
+                  "path",
+                  {
+                    d: i,
+                    style: {
+                      stroke: Q,
+                      strokeWidth: J,
+                      fill: B
+                    }
+                  },
+                  j
+                );
+              })
+            ) }, u)),
+            /* @__PURE__ */ r.jsx(Ge, { children: l.map((e) => {
+              const u = l.filter((a) => a.color).length === 0 ? s[0] : e.color ? s[v.indexOf(`${e.color}`)] : D.gray;
+              return /* @__PURE__ */ r.jsxs(
+                me.g,
+                {
+                  variants: {
+                    initial: { opacity: 0 },
+                    whileInView: {
+                      opacity: R ? R === u ? 1 : ae : te.length !== 0 ? te.indexOf(e.label || "") !== -1 ? 1 : ae : 1,
+                      transition: { duration: y.duration }
+                    }
+                  },
+                  initial: "initial",
+                  animate: U ? "whileInView" : "initial",
+                  exit: { opacity: 0, transition: { duration: y.duration } },
+                  onMouseEnter: (a) => {
+                    x(e), W(a.clientY), q(a.clientX), ee?.(e);
+                  },
+                  onMouseMove: (a) => {
+                    x(e), W(a.clientY), q(a.clientX);
+                  },
+                  onMouseLeave: () => {
+                    x(void 0), q(void 0), W(void 0), ee?.(void 0);
+                  },
+                  onClick: () => {
+                    (H || $) && (Se(I, e) && f ? (F(void 0), H?.(void 0)) : (F(e), H?.(e)));
+                  },
+                  transform: `translate(${O([e.long, e.lat])[0]},${O([e.long, e.lat])[1]})`,
+                  children: [
+                    /* @__PURE__ */ r.jsx(
+                      me.circle,
+                      {
+                        cx: 0,
+                        cy: 0,
+                        variants: {
+                          initial: {
+                            r: 0,
+                            fill: l.filter((a) => a.color).length === 0 ? s[0] : e.color ? s[v.indexOf(`${e.color}`)] : D.gray,
+                            stroke: l.filter((a) => a.color).length === 0 ? s[0] : e.color ? s[v.indexOf(`${e.color}`)] : D.gray
+                          },
+                          whileInView: {
+                            r: d ? d(e.radius || 0) : b,
+                            fill: l.filter((a) => a.color).length === 0 ? s[0] : e.color ? s[v.indexOf(`${e.color}`)] : D.gray,
+                            stroke: l.filter((a) => a.color).length === 0 ? s[0] : e.color ? s[v.indexOf(`${e.color}`)] : D.gray,
+                            transition: { duration: y.duration }
+                          }
+                        },
+                        initial: "initial",
+                        animate: U ? "whileInView" : "initial",
+                        exit: { r: 0, transition: { duration: y.duration } },
+                        style: {
+                          fillOpacity: 0.8
+                        }
+                      }
+                    ),
+                    he && e.label ? /* @__PURE__ */ r.jsx(
+                      me.text,
+                      {
+                        variants: {
+                          initial: {
+                            opacity: 0,
+                            x: d ? d(e.radius || 0) : b
+                          },
+                          whileInView: {
+                            opacity: 1,
+                            x: d ? d(e.radius || 0) : b,
+                            transition: { duration: y.duration }
+                          }
+                        },
+                        initial: "initial",
+                        animate: U ? "whileInView" : "initial",
+                        exit: { opacity: 0, transition: { duration: y.duration } },
+                        y: 0,
+                        className: "fill-primary-gray-600 dark:fill-primary-gray-300 text-sm",
+                        style: { textAnchor: "start" },
+                        dx: 4,
+                        dy: 5,
+                        children: e.label
+                      }
+                    ) : null
+                  ]
+                },
+                e.label || `${e.lat}-${e.long}`
+              );
+            }) }),
+            oe.filter((e) => e.position === "after").map((e) => e.layer)
+          ] })
+        }
+      ),
+      l.filter((e) => e.color).length === 0 || ge === !1 ? null : /* @__PURE__ */ r.jsx("div", { className: "absolute left-4 bottom-4", children: X ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+        /* @__PURE__ */ r.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"
+            },
+            onClick: () => {
+              h(!1);
+            },
+            children: /* @__PURE__ */ r.jsx(Xe, {})
+          }
+        ),
+        /* @__PURE__ */ r.jsxs("div", { className: "p-2", style: { backgroundColor: "rgba(240,240,240, 0.7)" }, children: [
+          S && S !== "" ? /* @__PURE__ */ r.jsx(
+            "p",
+            {
+              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: S
+            }
+          ) : null,
+          /* @__PURE__ */ r.jsx("div", { className: "flex flex-col gap-3", children: v.map((e, u) => /* @__PURE__ */ r.jsxs(
+            "div",
+            {
+              className: "flex gap-2 items-center",
+              onMouseOver: () => {
+                ne(s[u % s.length]);
+              },
+              onMouseLeave: () => {
+                ne(void 0);
+              },
+              children: [
+                /* @__PURE__ */ r.jsx(
+                  "div",
+                  {
+                    className: "w-2 h-2 rounded-full",
+                    style: { backgroundColor: s[u % s.length] }
+                  }
+                ),
+                /* @__PURE__ */ r.jsx(Be, { size: "sm", marginBottom: "none", leading: "none", children: e })
+              ]
+            },
+            u
+          )) })
+        ] })
+      ] }) : /* @__PURE__ */ r.jsx(
+        "button",
+        {
+          type: "button",
+          className: "mb-0 border-0 bg-transparent p-0 self-start",
+          onClick: () => {
+            h(!0);
+          },
+          children: /* @__PURE__ */ r.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" })
+        }
+      ) }),
+      P === "button" && /* @__PURE__ */ r.jsxs("div", { className: "absolute left-4 top-4 flex flex-col", children: [
+        /* @__PURE__ */ r.jsx(
+          "button",
+          {
+            onClick: () => A("in"),
+            className: "leading-0 px-2 py-3.5 border border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-400 dark:bg-primary-gray-600 dark:text-primary-gray-100",
+            children: "+"
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          "button",
+          {
+            onClick: () => A("out"),
+            className: "leading-0 px-2 py-3.5 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",
+            children: "–"
+          }
+        )
+      ] })
+    ] }),
+    $ && I !== void 0 ? /* @__PURE__ */ r.jsx(
+      Ae,
+      {
+        open: I !== void 0,
+        onClose: () => {
+          F(void 0);
+        },
+        children: /* @__PURE__ */ r.jsx(
+          "div",
+          {
+            className: "graph-modal-content m-0",
+            dangerouslySetInnerHTML: typeof $ == "string" ? { __html: Re($, I) } : void 0,
+            children: typeof $ == "function" ? $(I) : null
+          }
+        )
+      }
+    ) : null,
+    le && Z && w && se ? /* @__PURE__ */ r.jsx(
+      He,
+      {
+        data: le,
+        body: Z,
+        xPos: w,
+        yPos: se,
+        backgroundStyle: re?.tooltip,
+        className: ye?.tooltip
+      }
+    ) : null
+  ] });
+}
+function Dt(ue) {
+  const {
+    data: l,
+    mapData: s = "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap.json",
+    graphTitle: C,
+    colors: S,
+    sources: v,
+    graphDescription: b,
+    height: m,
+    width: o,
+    footNote: K = "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.",
+    colorLegendTitle: E,
+    colorDomain: Z,
+    radius: he = 5,
+    scale: J = 0.95,
+    centerPoint: Q,
+    padding: B,
+    mapBorderWidth: ee = 0.5,
+    mapNoDataColor: ge = D.light.graphNoData,
+    backgroundColor: N = !1,
+    showLabels: fe = !1,
+    mapBorderColor: te = D.light.grays["gray-500"],
+    tooltip: H,
+    relativeHeight: f,
+    onSeriesMouseOver: $,
+    isWorldMap: re = !0,
+    showColorScale: ye = !0,
+    zoomScaleExtend: T = [0.8, 6],
+    zoomTranslateExtend: P,
+    graphID: y,
+    highlightedDataPoints: ae = [],
+    onSeriesMouseClick: oe,
+    graphDownload: ie = !1,
+    dataDownload: R = !1,
+    showAntarctica: ne = !1,
+    language: X = "en",
+    minHeight: h = 0,
+    theme: V = "light",
+    ariaLabel: I,
+    resetSelectionOnDoubleClick: F = !0,
+    detailsOnClick: le,
+    styles: x,
+    classNames: w,
+    mapProjection: q,
+    zoomInteraction: se = "button",
+    animate: W = !1,
+    dimmedOpacity: L = 0.3,
+    customLayers: U = [],
+    maxRadiusValue: _,
+    timeline: d = { enabled: !1, autoplay: !1, showOnlyActiveDate: !0 }
+  } = ue, [p, M] = g(0), [G, ce] = g(0), [z, xe] = g(d.autoplay), n = Ne(
+    be(
+      l.filter((t) => t.date !== void 0 && t.date !== null),
+      (t) => t.date
+    ).map((t) => De(`${t.date}`, d.dateFormat || "yyyy", /* @__PURE__ */ new Date()).getTime()),
+    (t, c) => Je(t, c)
+  ), [O, A] = g(d.autoplay ? 0 : n.length - 1), [e, u] = g(void 0), a = Y(null), j = Y(null);
+  pe(() => {
+    const t = new ResizeObserver((c) => {
+      M(o || c[0].target.clientWidth || 760), ce(m || c[0].target.clientHeight || 480);
+    });
+    return a.current && (ce(a.current.clientHeight || 480), M(a.current.clientWidth || 760), o || t.observe(a.current)), () => t.disconnect();
+  }, [o, m]), pe(() => {
+    typeof s == "string" ? Ze(s).then((c) => {
+      u(c);
+    }) : u(s);
+  }, [s]), pe(() => {
+    const t = setInterval(
+      () => {
+        A((c) => c < n.length - 1 ? c + 1 : 0);
+      },
+      (d.speed || 2) * 1e3
+    );
+    return z || clearInterval(t), () => clearInterval(t);
+  }, [n, z, d.speed]);
+  const i = $e(
+    n,
+    O,
+    d.showOnlyActiveDate,
+    d.dateFormat || "yyyy"
+  );
+  return /* @__PURE__ */ r.jsx(
+    "div",
+    {
+      className: `${V || "light"} flex  ${o ? "w-fit grow-0" : "w-full grow"}`,
+      dir: X === "he" || X === "ar" ? "rtl" : void 0,
+      children: /* @__PURE__ */ r.jsx(
+        "div",
+        {
+          className: ke(
+            `${N ? N === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${X || "en"}`,
+            w?.graphContainer
+          ),
+          style: {
+            ...x?.graphContainer || {},
+            ...N && N !== !0 ? { backgroundColor: N } : {}
+          },
+          id: y,
+          ref: j,
+          "aria-label": I || `${C ? `The graph shows ${C}. ` : ""}This is a dot density map showing the distribution of a variable across a region or world, with each dot representing a data point.${b ? ` ${b}` : ""}`,
+          children: /* @__PURE__ */ r.jsx(
+            "div",
+            {
+              className: "flex grow",
+              style: { padding: N ? B || "1rem" : B || 0 },
+              children: /* @__PURE__ */ r.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
+                C || b || ie || R ? /* @__PURE__ */ r.jsx(
+                  Ke,
+                  {
+                    styles: {
+                      title: x?.title,
+                      description: x?.description
+                    },
+                    classNames: {
+                      title: w?.title,
+                      description: w?.description
+                    },
+                    graphTitle: C,
+                    graphDescription: b,
+                    width: o,
+                    graphDownload: ie ? j.current : void 0,
+                    dataDownload: R ? l.map((t) => t.data).filter((t) => t !== void 0).length > 0 ? l.map((t) => t.data).filter((t) => t !== void 0) : l.filter((t) => t !== void 0) : null
+                  }
+                ) : null,
+                d.enabled && n.length > 0 && i ? /* @__PURE__ */ r.jsxs("div", { className: "flex gap-6 items-center", dir: "ltr", children: [
+                  /* @__PURE__ */ r.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        xe(!z);
+                      },
+                      className: "p-0 border-0 cursor-pointer bg-transparent",
+                      "aria-label": z ? "Click to pause animation" : "Click to play animation",
+                      children: z ? /* @__PURE__ */ r.jsx(Fe, {}) : /* @__PURE__ */ r.jsx(qe, {})
+                    }
+                  ),
+                  /* @__PURE__ */ r.jsx(
+                    Me,
+                    {
+                      min: n[0],
+                      max: n[n.length - 1],
+                      marks: i,
+                      step: null,
+                      defaultValue: n[n.length - 1],
+                      value: n[O],
+                      onChangeComplete: (t) => {
+                        A(n.indexOf(t));
+                      },
+                      onChange: (t) => {
+                        A(n.indexOf(t));
+                      },
+                      "aria-label": "Time slider. Use arrow keys to adjust selected time period."
+                    }
+                  )
+                ] }) : null,
+                /* @__PURE__ */ r.jsx(
+                  "div",
+                  {
+                    className: "flex flex-col grow justify-center leading-0",
+                    ref: a,
+                    "aria-label": "Map area",
+                    children: (o || p) && (m || G) && e ? /* @__PURE__ */ r.jsx(
+                      Qe,
+                      {
+                        data: l.filter(
+                          (t) => d.enabled ? t.date === Ce(new Date(n[O]), d.dateFormat || "yyyy") : t
+                        ),
+                        mapData: ne ? e : {
+                          ...e,
+                          features: e.features.filter(
+                            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                            (t) => t.properties.NAME !== "Antarctica"
+                          )
+                        },
+                        colorDomain: l.filter((t) => t.color).length === 0 ? [] : Z || be(
+                          l.filter((t) => !we(t.color)),
+                          "color"
+                        ).map((t) => `${t.color}`),
+                        width: o || p,
+                        height: Math.max(
+                          h,
+                          m || (f ? h ? (o || p) * f > h ? (o || p) * f : h : (o || p) * f : G)
+                        ),
+                        scale: J,
+                        centerPoint: Q,
+                        colors: l.filter((t) => t.color).length === 0 ? S ? [S] : [D.primaryColors["blue-600"]] : S || D[V].categoricalColors.colors,
+                        colorLegendTitle: E,
+                        radius: he,
+                        mapBorderWidth: ee,
+                        mapNoDataColor: ge,
+                        mapBorderColor: te,
+                        tooltip: H,
+                        onSeriesMouseOver: $,
+                        showLabels: fe,
+                        isWorldMap: re,
+                        showColorScale: ye,
+                        zoomScaleExtend: T,
+                        zoomTranslateExtend: P,
+                        onSeriesMouseClick: oe,
+                        highlightedDataPoints: ae,
+                        resetSelectionOnDoubleClick: F,
+                        styles: x,
+                        classNames: w,
+                        zoomInteraction: se,
+                        detailsOnClick: le,
+                        mapProjection: q || (re ? "naturalEarth" : "mercator"),
+                        animate: W === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : W || { duration: 0, once: !0, amount: 0 },
+                        dimmedOpacity: L,
+                        customLayers: U,
+                        maxRadiusValue: we(_) ? Math.max(
+                          ...l.map((t) => t.radius).filter((t) => t != null)
+                        ) : _
+                      }
+                    ) : /* @__PURE__ */ r.jsx(
+                      "div",
+                      {
+                        style: {
+                          height: `${Math.max(
+                            h,
+                            m || (f ? h ? (o || p) * f > h ? (o || p) * f : h : (o || p) * f : G)
+                          )}px`
+                        },
+                        className: "flex items-center justify-center",
+                        children: /* @__PURE__ */ r.jsx(Oe, { "aria-label": "Loading graph" })
+                      }
+                    )
+                  }
+                ),
+                v || K ? /* @__PURE__ */ r.jsx(
+                  Ye,
+                  {
+                    styles: { footnote: x?.footnote, source: x?.source },
+                    classNames: {
+                      footnote: w?.footnote,
+                      source: w?.source
+                    },
+                    sources: v,
+                    footNote: K,
+                    width: o
+                  }
+                ) : null
+              ] })
+            }
+          )
+        }
+      )
+    }
+  );
+}
+export {
+  Dt as DotDensityMap
+};
+//# sourceMappingURL=DotDensityMap.js.map