@undp/data-viz 1.5.9 → 2.0.1

package/dist/HeatMap.js

@@ -1,453 +1,285 @@
-import { j as e, m as ue } from "./index-CHPV5EwG-DBWUSD9b.js";
-import { useRef as ae, useState as O, useEffect as me } from "react";
-import { i as he } from "./index-Bwrro8-q.js";
-import { G as ge } from "./Modal-Cg8daIlV.js";
-import { n as de } from "./numberFormattingFunction-14YCbkN2.js";
-import { T as pe } from "./Tooltip-6LIdPQGC.js";
-import { g as fe } from "./getTextColorBasedOnBgColor-B6Nk2WBf.js";
-import { c as re } from "./checkIfNullOrUndefined-DmfiKkNw.js";
-import { s as xe } from "./string2HTML-oFCROsus.js";
-import { X as ye } from "./XAxesLabels-SOSmso5J.js";
-import { Y as ve } from "./YAxesLabels-DlDyLvhi.js";
-import { u as ne } from "./uniqBy-BHy4I8PK.js";
-import { b as ce } from "./band-BEjh2CHI.js";
-import { o as we } from "./ordinal-w9Lu4Stb.js";
-import { t as Ce } from "./threshold-DFfqcDMa.js";
-import { a as be } from "./linear-DUdu7l2G.js";
-import { u as je } from "./use-in-view-DR-UTB96.js";
-import { m as ie } from "./proxy-BYIC9BuT.js";
-import { GraphHeader as $e } from "./GraphHeader.js";
-import { GraphFooter as ke } from "./GraphFooter.js";
-import { ColorLegendWithMouseOver as Me } from "./ColorLegendWithMouseOver.js";
-import { LinearColorLegend as Ne } from "./LinearColorLegend.js";
-import { ThresholdColorLegendWithMouseOver as De } from "./ThresholdColorLegendWithMouseOver.js";
-import { Colors as a } from "./Colors.js";
-import { E as Oe } from "./EmptyState-36lXXyui.js";
-function Le(z) {
-  const {
-    data: d,
-    showColumnLabels: L,
-    leftMargin: S,
-    rightMargin: X,
-    truncateBy: p,
-    width: I,
-    height: W,
-    topMargin: _,
-    bottomMargin: U,
-    tooltip: k,
-    onSeriesMouseOver: r,
-    suffix: J,
-    prefix: i,
-    showValues: Y,
-    colorDomain: M,
-    colors: q,
-    noDataColor: f,
-    scaleType: F,
-    showRowLabels: K,
-    selectedColor: G,
-    onSeriesMouseClick: A,
-    resetSelectionOnDoubleClick: Q,
-    detailsOnClick: v,
-    styles: T,
-    classNames: x,
-    animate: w,
-    precision: Z
-  } = z, E = ae(null), H = je(E, {
-    once: w.once,
-    amount: w.amount
-  }), s = {
-    top: _,
-    bottom: U,
-    left: S,
-    right: X
-  }, [C, V] = O(void 0), [n, N] = O(void 0), [R, b] = O(void 0), [o, B] = O(void 0), ee = I - s.left - s.right, te = W - s.top - s.bottom, m = ne(d, "column", !0), h = ne(d, "row", !0), j = ce().domain(h).range([0, te]), D = j.bandwidth(), c = ce().domain(m).range([0, ee]), $ = c.bandwidth(), P = F === "categorical" ? we().domain(M).range(q) : F === "threshold" ? Ce().domain(M).range(q) : be().domain(M).range(q);
-  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsxs(
-      ie.svg,
-      {
-        width: `${I}px`,
-        height: `${W}px`,
-        viewBox: `0 0 ${I} ${W}`,
-        style: { marginLeft: "auto", marginRight: "auto" },
-        direction: "ltr",
-        ref: E,
-        children: [
-          /* @__PURE__ */ e.jsx("g", { transform: `translate(${s.left},0)`, children: L ? m.map((t, y) => /* @__PURE__ */ e.jsx(
-            ye,
-            {
-              y: 0,
-              x: c(t),
-              width: $,
-              height: s.top - 5,
-              value: `${t}`.length < p ? `${t}` : `${`${t}`.substring(0, p)}...`,
-              style: T?.xAxis?.labels,
-              className: x?.xAxis?.labels,
-              alignment: "bottom",
-              animate: { duration: 0, once: !0, amount: 0 },
-              isInView: H
-            },
-            y
-          )) : null }),
-          /* @__PURE__ */ e.jsx("g", { transform: `translate(0,${s.top})`, children: K ? h.map((t, y) => /* @__PURE__ */ e.jsx(
-            ve,
-            {
-              value: `${t}`.length < p ? `${t}` : `${`${t}`.substring(0, p)}...`,
-              y: j(t),
-              x: 0,
-              width: s.left,
-              height: D,
-              alignment: "right",
-              style: T?.yAxis?.labels,
-              className: x?.yAxis?.labels,
-              animate: { duration: 0, once: !0, amount: 0 },
-              isInView: H
-            },
-            y
-          )) : null }),
-          /* @__PURE__ */ e.jsxs("g", { transform: `translate(${s.left},${s.top})`, children: [
-            h.map((t, y) => /* @__PURE__ */ e.jsx("g", { transform: `translate(0,${j(t)})`, children: m.map((g) => /* @__PURE__ */ e.jsx(
-              "rect",
-              {
-                x: c(g),
-                y: 0,
-                width: $,
-                height: D,
-                style: { fill: f },
-                className: "stroke-1 stroke-primary-white dark:stroke-primary-gray-700"
-              },
-              `${t}-${g}`
-            )) }, y)),
-            d.filter((t) => !re(t.value)).map((t, y) => {
-              const g = re(t.value) ? f : (
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                P(t.value)
-              );
-              return /* @__PURE__ */ e.jsxs(
-                "g",
-                {
-                  transform: `translate(${c(t.column)},${j(t.row)})`,
-                  onMouseEnter: (u) => {
-                    N(t), B(u.clientY), b(u.clientX), r?.(t);
-                  },
-                  onClick: () => {
-                    (A || v) && (he(C, t) && Q ? (V(void 0), A?.(void 0)) : (V(t), A?.(t)));
-                  },
-                  onMouseMove: (u) => {
-                    N(t), B(u.clientY), b(u.clientX);
-                  },
-                  onMouseLeave: () => {
-                    N(void 0), b(void 0), B(void 0), r?.(void 0);
-                  },
-                  opacity: G ? G === g ? 1 : 0.3 : 1,
-                  children: [
-                    /* @__PURE__ */ e.jsx(
-                      ie.rect,
-                      {
-                        x: 0,
-                        y: 0,
-                        width: $,
-                        height: D,
-                        className: "stroke-1 stroke-primary-white dark:stroke-primary-gray-700",
-                        exit: { opacity: 0, transition: { duration: w.duration } },
-                        variants: {
-                          initial: { fill: g, opacity: 0 },
-                          whileInView: {
-                            fill: g,
-                            opacity: 1,
-                            transition: { duration: w.duration }
-                          }
-                        },
-                        initial: "initial",
-                        animate: H ? "whileInView" : "initial"
-                      }
-                    ),
-                    Y && !re(t.value) ? /* @__PURE__ */ e.jsx(
-                      ie.g,
-                      {
-                        variants: {
-                          initial: { opacity: 0 },
-                          whileInView: { opacity: 1, transition: { duration: w.duration } }
-                        },
-                        initial: "initial",
-                        animate: H ? "whileInView" : "initial",
-                        exit: { opacity: 0, transition: { duration: w.duration } },
-                        children: /* @__PURE__ */ e.jsx("foreignObject", { y: 0, x: 0, width: $, height: D, children: /* @__PURE__ */ e.jsx("div", { className: "flex flex-col justify-center items-center h-inherit p-1", children: /* @__PURE__ */ e.jsx(
-                          "p",
-                          {
-                            className: ue(
-                              "text-xs text-center m-0 leading-[1.25] graph-value",
-                              x?.graphObjectValues
-                            ),
-                            style: {
-                              color: fe(g),
-                              ...T?.graphObjectValues || {}
-                            },
-                            children: de(t.value, "NA", Z, i, J)
-                          }
-                        ) }) }, y)
-                      }
-                    ) : null
-                  ]
-                },
-                `${t.column}-${t.row}`
-              );
-            }),
-            n ? /* @__PURE__ */ e.jsx(
-              "rect",
-              {
-                x: c(n.column),
-                y: j(n.row),
-                width: $,
-                height: D,
-                style: {
-                  fill: "none",
-                  fillOpacity: 0,
-                  strokeWidth: 1.5
-                },
-                className: "stroke-primary-gray-700 dark:stroke-primary-gray-300"
-              }
-            ) : null
-          ] })
-        ]
-      }
-    ),
-    n && k && R && o ? /* @__PURE__ */ e.jsx(
-      pe,
-      {
-        data: n,
-        body: k,
-        xPos: R,
-        yPos: o,
-        backgroundStyle: T?.tooltip,
-        className: x?.tooltip
-      }
-    ) : null,
-    v && C !== void 0 ? /* @__PURE__ */ e.jsx(
-      ge,
-      {
-        open: C !== void 0,
-        onClose: () => {
-          V(void 0);
-        },
-        children: /* @__PURE__ */ e.jsx(
-          "div",
-          {
-            className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof v == "string" ? { __html: xe(v, C) } : void 0,
-            children: typeof v == "function" ? v(C) : null
+import { c as Gt, j as o, m as Xt } from "./index-CHPV5EwG-Curnpaqc.js";
+import { useRef as qt, useState as dt, useEffect as Yt } from "react";
+import { i as Ft } from "./index-Bwrro8-q.js";
+import { l as Pt } from "./Modal-DGcuAHyK.js";
+import { n as zt } from "./numberFormattingFunction-14YCbkN2.js";
+import { T as Ut } from "./Tooltip-CwWUegPB.js";
+import { g as Jt } from "./getTextColorBasedOnBgColor-CDY808zi.js";
+import { c as Ht } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { s as Kt } from "./string2HTML-DhG75NqA.js";
+import { X as Qt } from "./XAxesLabels-DNO0KmjL.js";
+import { Y as Zt } from "./YAxesLabels-Dnnng49-.js";
+import { u as Wt } from "./uniqBy-BHy4I8PK.js";
+import { b as Bt } from "./band-CyHaVft5.js";
+import { o as _t } from "./ordinal-P77xw8aL.js";
+import { t as to } from "./threshold-Bgr20hik.js";
+import { a as oo } from "./linear-BwnDd9KF.js";
+import { u as eo } from "./use-in-view-Cxa7y1TH.js";
+import { m as Vt } from "./proxy-BxkFHwUw.js";
+import { GraphHeader as io } from "./GraphHeader.js";
+import { GraphFooter as ro } from "./GraphFooter.js";
+import { ColorLegendWithMouseOver as lo } from "./ColorLegendWithMouseOver.js";
+import { LinearColorLegend as so } from "./LinearColorLegend.js";
+import { ThresholdColorLegendWithMouseOver as no } from "./ThresholdColorLegendWithMouseOver.js";
+import { Colors as g } from "./Colors.js";
+import { E as ao } from "./EmptyState-BZo1BbAn.js";
+import { a as co, G as uo } from "./GraphContainer-CRqzdKu2.js";
+function mo(a) {
+  const t = Gt.c(85), {
+    data: h,
+    showColumnLabels: z,
+    leftMargin: M,
+    rightMargin: U,
+    truncateBy: b,
+    width: J,
+    height: K,
+    topMargin: gt,
+    bottomMargin: pt,
+    tooltip: Q,
+    onSeriesMouseOver: s,
+    suffix: jt,
+    prefix: l,
+    showValues: Z,
+    colorDomain: w,
+    colors: R,
+    noDataColor: it,
+    scaleType: rt,
+    showRowLabels: ft,
+    selectedColor: _,
+    onSeriesMouseClick: W,
+    resetSelectionOnDoubleClick: xt,
+    detailsOnClick: f,
+    styles: d,
+    classNames: u,
+    animate: m,
+    precision: lt
+  } = a, $t = qt(null);
+  let st;
+  t[0] !== m.amount || t[1] !== m.once ? (st = {
+    once: m.once,
+    amount: m.amount
+  }, t[0] = m.amount, t[1] = m.once, t[2] = st) : st = t[2];
+  const k = eo($t, st);
+  let nt;
+  t[3] !== pt || t[4] !== M || t[5] !== U || t[6] !== gt ? (nt = {
+    top: gt,
+    bottom: pt,
+    left: M,
+    right: U
+  }, t[3] = pt, t[4] = M, t[5] = U, t[6] = gt, t[7] = nt) : nt = t[7];
+  const c = nt, [v, vt] = dt(void 0), [y, yt] = dt(void 0), [at, ct] = dt(void 0), [ut, mt] = dt(void 0), n = J - c.left - c.right, r = K - c.top - c.bottom;
+  let B, G, D, O, N, L, S, A, V, q, H, T, x;
+  if (t[8] !== m.duration || t[9] !== u?.graphObjectValues || t[10] !== u?.xAxis?.labels || t[11] !== u?.yAxis?.labels || t[12] !== w || t[13] !== R || t[14] !== h || t[15] !== f || t[16] !== r || t[17] !== n || t[18] !== K || t[19] !== k || t[20] !== c.left || t[21] !== c.top || t[22] !== v || t[23] !== y || t[24] !== it || t[25] !== W || t[26] !== s || t[27] !== lt || t[28] !== l || t[29] !== xt || t[30] !== rt || t[31] !== _ || t[32] !== z || t[33] !== ft || t[34] !== Z || t[35] !== d?.graphObjectValues || t[36] !== d?.xAxis?.labels || t[37] !== d?.yAxis?.labels || t[38] !== jt || t[39] !== b || t[40] !== J) {
+    const ot = Wt(h, "column", !0), ht = Wt(h, "row", !0), i = Bt().domain(ht).range([0, r]), X = i.bandwidth(), I = Bt().domain(ot).range([0, n]), Y = I.bandwidth(), et = rt === "categorical" ? _t().domain(w).range(R) : rt === "threshold" ? to().domain(w).range(R) : oo().domain(w).range(R);
+    B = Vt.svg, q = `${J}px`, H = `${K}px`, T = `0 0 ${J} ${K}`, t[54] === Symbol.for("react.memo_cache_sentinel") ? (x = {
+      marginLeft: "auto",
+      marginRight: "auto"
+    }, t[54] = x) : x = t[54], G = "ltr", D = $t, O = /* @__PURE__ */ o.jsx("g", { transform: `translate(${c.left},0)`, children: z ? ot.map((e, C) => /* @__PURE__ */ o.jsx(Qt, { y: 0, x: I(e), width: Y, height: c.top - 5, value: `${e}`.length < b ? `${e}` : `${`${e}`.substring(0, b)}...`, style: d?.xAxis?.labels, className: u?.xAxis?.labels, alignment: "bottom", animate: {
+      duration: 0,
+      once: !0,
+      amount: 0
+    }, isInView: k }, C)) : null }), N = /* @__PURE__ */ o.jsx("g", { transform: `translate(0,${c.top})`, children: ft ? ht.map((e, C) => /* @__PURE__ */ o.jsx(Zt, { value: `${e}`.length < b ? `${e}` : `${`${e}`.substring(0, b)}...`, y: i(e), x: 0, width: c.left, height: X, alignment: "right", style: d?.yAxis?.labels, className: u?.yAxis?.labels, animate: {
+      duration: 0,
+      once: !0,
+      amount: 0
+    }, isInView: k }, C)) : null }), L = `translate(${c.left},${c.top})`, S = ht.map((e, C) => /* @__PURE__ */ o.jsx("g", { transform: `translate(0,${i(e)})`, children: ot.map((F) => /* @__PURE__ */ o.jsx("rect", { x: I(F), y: 0, width: Y, height: X, style: {
+      fill: it
+    }, className: "stroke-1 stroke-primary-white dark:stroke-primary-gray-700" }, `${e}-${F}`)) }, C)), A = h.filter(ho).map((e, C) => {
+      const F = Ht(e.value) ? it : et(e.value);
+      return /* @__PURE__ */ o.jsxs("g", { transform: `translate(${I(e.column)},${i(e.row)})`, onMouseEnter: (P) => {
+        yt(e), mt(P.clientY), ct(P.clientX), s?.(e);
+      }, onClick: () => {
+        (W || f) && (Ft(v, e) && xt ? (vt(void 0), W?.(void 0)) : (vt(e), W?.(e)));
+      }, onMouseMove: (P) => {
+        yt(e), mt(P.clientY), ct(P.clientX);
+      }, onMouseLeave: () => {
+        yt(void 0), ct(void 0), mt(void 0), s?.(void 0);
+      }, opacity: _ ? _ === F ? 1 : 0.3 : 1, children: [
+        /* @__PURE__ */ o.jsx(Vt.rect, { x: 0, y: 0, width: Y, height: X, className: "stroke-1 stroke-primary-white dark:stroke-primary-gray-700", exit: {
+          opacity: 0,
+          transition: {
+            duration: m.duration
           }
-        )
-      }
-    ) : null
-  ] });
-}
-function ot(z) {
-  const {
-    data: d,
-    graphTitle: L,
-    colors: S,
-    sources: X,
-    graphDescription: p,
-    showColumnLabels: I = !0,
-    leftMargin: W = 100,
-    rightMargin: _ = 10,
-    truncateBy: U = 999,
-    height: k,
-    width: r,
-    scaleType: J,
-    colorDomain: i,
-    footNote: Y,
-    colorLegendTitle: M,
-    padding: q,
-    backgroundColor: f = !1,
-    topMargin: F = 30,
-    bottomMargin: K = 10,
-    tooltip: G,
-    onSeriesMouseOver: A,
-    suffix: Q = "",
-    prefix: v = "",
-    showRowLabels: T = !0,
-    relativeHeight: x,
-    showValues: w,
-    graphID: Z,
-    noDataColor: E = a.gray,
-    showColorScale: H = !0,
-    onSeriesMouseClick: s,
-    graphDownload: C = !1,
-    dataDownload: V = !1,
-    fillContainer: n = !0,
-    language: N = "en",
-    showNAColor: R = !0,
-    minHeight: b = 0,
-    theme: o = "light",
-    ariaLabel: B,
-    resetSelectionOnDoubleClick: ee = !0,
-    detailsOnClick: te,
-    styles: m,
-    classNames: h,
-    animate: j = !1,
-    precision: D = 2
-  } = z, [c, $] = O(0), [P, t] = O(0), [y, g] = O(void 0), u = ae(null), le = ae(null);
-  me(() => {
-    const l = new ResizeObserver((se) => {
-      $(r || se[0].target.clientWidth || 620), t(k || se[0].target.clientHeight || 480);
-    });
-    return u.current && (t(u.current.clientHeight || 480), $(u.current.clientWidth || 620), r || l.observe(u.current)), () => l.disconnect();
-  }, [r, k]);
-  const oe = J || (typeof i[0] == "string" ? "categorical" : i.length === 2 ? "linear" : "threshold");
-  return /* @__PURE__ */ e.jsx(
-    "div",
-    {
-      className: `${o || "light"} flex ${r ? "grow-0" : "grow"} ${n ? "w-full" : "w-fit"}`,
-      dir: N === "he" || N === "ar" ? "rtl" : void 0,
-      children: /* @__PURE__ */ e.jsx(
-        "div",
-        {
-          className: ue(
-            `${f ? f === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${N || "en"}`,
-            n ? "w-full" : "w-fit",
-            h?.graphContainer
-          ),
-          style: {
-            ...m?.graphContainer || {},
-            ...f && f !== !0 ? { backgroundColor: f } : {}
+        }, variants: {
+          initial: {
+            fill: F,
+            opacity: 0
+          },
+          whileInView: {
+            fill: F,
+            opacity: 1,
+            transition: {
+              duration: m.duration
+            }
+          }
+        }, initial: "initial", animate: k ? "whileInView" : "initial" }),
+        Z && !Ht(e.value) ? /* @__PURE__ */ o.jsx(Vt.g, { variants: {
+          initial: {
+            opacity: 0
           },
-          id: Z,
-          ref: le,
-          "aria-label": B || `${L ? `The graph shows ${L}. ` : ""}This is a heatmap. ${p ? ` ${p}` : ""}`,
-          children: /* @__PURE__ */ e.jsx(
-            "div",
-            {
-              className: "flex grow",
-              style: { padding: f ? q || "1rem" : q || 0 },
-              children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                L || p || C || V ? /* @__PURE__ */ e.jsx(
-                  $e,
-                  {
-                    styles: {
-                      title: m?.title,
-                      description: m?.description
-                    },
-                    classNames: {
-                      title: h?.title,
-                      description: h?.description
-                    },
-                    graphTitle: L,
-                    graphDescription: p,
-                    width: r,
-                    graphDownload: C ? le.current : void 0,
-                    dataDownload: V ? d.map((l) => l.data).filter((l) => l !== void 0).length > 0 ? d.map((l) => l.data).filter((l) => l !== void 0) : d.filter((l) => l !== void 0) : null
-                  }
-                ) : null,
-                /* @__PURE__ */ e.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: d.length === 0 ? /* @__PURE__ */ e.jsx(Oe, {}) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-                  H ? oe === "categorical" ? /* @__PURE__ */ e.jsx(
-                    Me,
-                    {
-                      width: n ? void 0 : r,
-                      colorLegendTitle: M,
-                      colors: S || (typeof i[0] == "string" ? a[o].categoricalColors.colors : i.length === 2 ? [
-                        a[o].sequentialColors.neutralColorsx09[0],
-                        a[o].sequentialColors.neutralColorsx09[8]
-                      ] : a[o].sequentialColors[`neutralColorsx0${i.length + 1}`]),
-                      colorDomain: i.map((l) => `${l}`),
-                      setSelectedColor: g,
-                      showNAColor: R
-                    }
-                  ) : oe === "threshold" ? /* @__PURE__ */ e.jsx(
-                    De,
-                    {
-                      width: n ? void 0 : r,
-                      colorLegendTitle: M,
-                      colors: S || (typeof i[0] == "string" ? a[o].categoricalColors.colors : i.length === 2 ? [
-                        a[o].sequentialColors.neutralColorsx09[0],
-                        a[o].sequentialColors.neutralColorsx09[8]
-                      ] : a[o].sequentialColors[`neutralColorsx0${i.length + 1}`]),
-                      colorDomain: i,
-                      setSelectedColor: g,
-                      naColor: E,
-                      showNAColor: R
-                    }
-                  ) : /* @__PURE__ */ e.jsx(
-                    Ne,
-                    {
-                      width: n ? void 0 : r,
-                      colorLegendTitle: M,
-                      colors: S || [
-                        a[o].sequentialColors.neutralColorsx09[0],
-                        a[o].sequentialColors.neutralColorsx09[8]
-                      ],
-                      colorDomain: i
-                    }
-                  ) : null,
-                  /* @__PURE__ */ e.jsx(
-                    "div",
-                    {
-                      className: "flex grow flex-col justify-center w-full leading-0",
-                      ref: u,
-                      "aria-label": "Graph area",
-                      children: (r || c) && (k || P) ? /* @__PURE__ */ e.jsx(
-                        Le,
-                        {
-                          data: d,
-                          colorDomain: i,
-                          width: r || c,
-                          colors: S || (typeof i[0] == "string" ? a[o].categoricalColors.colors : i.length === 2 ? [
-                            a[o].sequentialColors.neutralColorsx09[0],
-                            a[o].sequentialColors.neutralColorsx09[8]
-                          ] : a[o].sequentialColors[`neutralColorsx0${i.length + 1}`]),
-                          noDataColor: E,
-                          scaleType: oe,
-                          height: Math.max(
-                            b,
-                            k || (x ? b ? (r || c) * x > b ? (r || c) * x : b : (r || c) * x : P)
-                          ),
-                          showColumnLabels: I,
-                          leftMargin: W,
-                          rightMargin: _,
-                          topMargin: F,
-                          bottomMargin: K,
-                          selectedColor: y,
-                          truncateBy: U,
-                          showRowLabels: T,
-                          tooltip: G,
-                          onSeriesMouseOver: A,
-                          showValues: w,
-                          suffix: Q,
-                          prefix: v,
-                          onSeriesMouseClick: s,
-                          resetSelectionOnDoubleClick: ee,
-                          detailsOnClick: te,
-                          styles: m,
-                          classNames: h,
-                          animate: j === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : j || { duration: 0, once: !0, amount: 0 },
-                          precision: D
-                        }
-                      ) : null
-                    }
-                  )
-                ] }) }),
-                X || Y ? /* @__PURE__ */ e.jsx(
-                  ke,
-                  {
-                    styles: { footnote: m?.footnote, source: m?.source },
-                    classNames: {
-                      footnote: h?.footnote,
-                      source: h?.source
-                    },
-                    sources: X,
-                    footNote: Y,
-                    width: r
-                  }
-                ) : null
-              ] })
+          whileInView: {
+            opacity: 1,
+            transition: {
+              duration: m.duration
             }
-          )
-        }
-      )
-    }
-  );
+          }
+        }, initial: "initial", animate: k ? "whileInView" : "initial", exit: {
+          opacity: 0,
+          transition: {
+            duration: m.duration
+          }
+        }, children: /* @__PURE__ */ o.jsx("foreignObject", { y: 0, x: 0, width: Y, height: X, children: /* @__PURE__ */ o.jsx("div", { className: "flex flex-col justify-center items-center h-inherit p-1", children: /* @__PURE__ */ o.jsx("p", { className: Xt("text-xs text-center m-0 leading-[1.25] graph-value", u?.graphObjectValues), style: {
+          color: Jt(F),
+          ...d?.graphObjectValues || {}
+        }, children: zt(e.value, "NA", lt, l, jt) }) }) }, C) }) : null
+      ] }, `${e.column}-${e.row}`);
+    }), V = y ? /* @__PURE__ */ o.jsx("rect", { x: I(y.column), y: i(y.row), width: Y, height: X, style: {
+      fill: "none",
+      fillOpacity: 0,
+      strokeWidth: 1.5
+    }, className: "stroke-primary-gray-700 dark:stroke-primary-gray-300" }) : null, t[8] = m.duration, t[9] = u?.graphObjectValues, t[10] = u?.xAxis?.labels, t[11] = u?.yAxis?.labels, t[12] = w, t[13] = R, t[14] = h, t[15] = f, t[16] = r, t[17] = n, t[18] = K, t[19] = k, t[20] = c.left, t[21] = c.top, t[22] = v, t[23] = y, t[24] = it, t[25] = W, t[26] = s, t[27] = lt, t[28] = l, t[29] = xt, t[30] = rt, t[31] = _, t[32] = z, t[33] = ft, t[34] = Z, t[35] = d?.graphObjectValues, t[36] = d?.xAxis?.labels, t[37] = d?.yAxis?.labels, t[38] = jt, t[39] = b, t[40] = J, t[41] = B, t[42] = G, t[43] = D, t[44] = O, t[45] = N, t[46] = L, t[47] = S, t[48] = A, t[49] = V, t[50] = q, t[51] = H, t[52] = T, t[53] = x;
+  } else
+    B = t[41], G = t[42], D = t[43], O = t[44], N = t[45], L = t[46], S = t[47], A = t[48], V = t[49], q = t[50], H = t[51], T = t[52], x = t[53];
+  let E;
+  t[55] !== L || t[56] !== S || t[57] !== A || t[58] !== V ? (E = /* @__PURE__ */ o.jsxs("g", { transform: L, children: [
+    S,
+    A,
+    V
+  ] }), t[55] = L, t[56] = S, t[57] = A, t[58] = V, t[59] = E) : E = t[59];
+  let j;
+  t[60] !== B || t[61] !== G || t[62] !== D || t[63] !== O || t[64] !== N || t[65] !== E || t[66] !== q || t[67] !== H || t[68] !== T || t[69] !== x ? (j = /* @__PURE__ */ o.jsxs(B, { width: q, height: H, viewBox: T, style: x, direction: G, ref: D, children: [
+    O,
+    N,
+    E
+  ] }), t[60] = B, t[61] = G, t[62] = D, t[63] = O, t[64] = N, t[65] = E, t[66] = q, t[67] = H, t[68] = T, t[69] = x, t[70] = j) : j = t[70];
+  let $;
+  t[71] !== u?.tooltip || t[72] !== at || t[73] !== ut || t[74] !== y || t[75] !== d?.tooltip || t[76] !== Q ? ($ = y && Q && at && ut ? /* @__PURE__ */ o.jsx(Ut, { data: y, body: Q, xPos: at, yPos: ut, backgroundStyle: d?.tooltip, className: u?.tooltip }) : null, t[71] = u?.tooltip, t[72] = at, t[73] = ut, t[74] = y, t[75] = d?.tooltip, t[76] = Q, t[77] = $) : $ = t[77];
+  let p;
+  t[78] !== f || t[79] !== v ? (p = f && v !== void 0 ? /* @__PURE__ */ o.jsx(Pt, { open: v !== void 0, onClose: () => {
+    vt(void 0);
+  }, children: /* @__PURE__ */ o.jsx("div", { className: "graph-modal-content m-0", dangerouslySetInnerHTML: typeof f == "string" ? {
+    __html: Kt(f, v)
+  } : void 0, children: typeof f == "function" ? f(v) : null }) }) : null, t[78] = f, t[79] = v, t[80] = p) : p = t[80];
+  let tt;
+  return t[81] !== j || t[82] !== $ || t[83] !== p ? (tt = /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    j,
+    $,
+    p
+  ] }), t[81] = j, t[82] = $, t[83] = p, t[84] = tt) : tt = t[84], tt;
+}
+function ho(a) {
+  return !Ht(a.value);
+}
+function Po(a) {
+  const t = Gt.c(71), {
+    data: h,
+    graphTitle: z,
+    colors: M,
+    sources: U,
+    graphDescription: b,
+    showColumnLabels: J,
+    leftMargin: K,
+    rightMargin: gt,
+    truncateBy: pt,
+    height: Q,
+    width: s,
+    scaleType: jt,
+    colorDomain: l,
+    footNote: Z,
+    colorLegendTitle: w,
+    padding: R,
+    backgroundColor: it,
+    topMargin: rt,
+    bottomMargin: ft,
+    tooltip: _,
+    onSeriesMouseOver: W,
+    suffix: xt,
+    prefix: f,
+    showRowLabels: d,
+    relativeHeight: u,
+    showValues: m,
+    graphID: lt,
+    noDataColor: $t,
+    showColorScale: st,
+    onSeriesMouseClick: k,
+    graphDownload: nt,
+    dataDownload: c,
+    fillContainer: v,
+    language: vt,
+    showNAColor: y,
+    minHeight: yt,
+    theme: at,
+    ariaLabel: ct,
+    resetSelectionOnDoubleClick: ut,
+    detailsOnClick: mt,
+    styles: n,
+    classNames: r,
+    animate: B,
+    precision: G
+  } = a, D = J === void 0 ? !0 : J, O = K === void 0 ? 100 : K, N = gt === void 0 ? 10 : gt, L = pt === void 0 ? 999 : pt, S = it === void 0 ? !1 : it, A = rt === void 0 ? 30 : rt, V = ft === void 0 ? 10 : ft, q = xt === void 0 ? "" : xt, H = f === void 0 ? "" : f, T = d === void 0 ? !0 : d, x = $t === void 0 ? g.gray : $t, E = st === void 0 ? !0 : st, j = nt === void 0 ? !1 : nt, $ = c === void 0 ? !1 : c, p = v === void 0 ? !0 : v, tt = vt === void 0 ? "en" : vt, ot = y === void 0 ? !0 : y, ht = yt === void 0 ? 0 : yt, i = at === void 0 ? "light" : at, X = ut === void 0 ? !0 : ut, I = B === void 0 ? !1 : B, Y = G === void 0 ? 2 : G, [et, e] = dt(0), [C, F] = dt(0), [P, Tt] = dt(void 0), Nt = qt(null), Et = qt(null);
+  let kt, Dt;
+  t[0] === Symbol.for("react.memo_cache_sentinel") ? (kt = () => {
+    const It = new ResizeObserver((Rt) => {
+      e(Rt[0].target.clientWidth || 620), F(Rt[0].target.clientHeight || 480);
+    });
+    return Nt.current && It.observe(Nt.current), () => It.disconnect();
+  }, Dt = [], t[0] = kt, t[1] = Dt) : (kt = t[0], Dt = t[1]), Yt(kt, Dt);
+  const Mt = jt || (typeof l[0] == "string" ? "categorical" : l.length === 2 ? "linear" : "threshold"), Lt = r?.graphContainer, St = n?.graphContainer, At = p ? void 0 : s;
+  let Ct;
+  t[2] !== r?.description || t[3] !== r?.title || t[4] !== h || t[5] !== $ || t[6] !== b || t[7] !== j || t[8] !== z || t[9] !== n?.description || t[10] !== n?.title || t[11] !== s ? (Ct = z || b || j || $ ? /* @__PURE__ */ o.jsx(io, { styles: {
+    title: n?.title,
+    description: n?.description
+  }, classNames: {
+    title: r?.title,
+    description: r?.description
+  }, graphTitle: z, graphDescription: b, width: s, graphDownload: j ? Et : void 0, dataDownload: $ ? h.map(yo).filter(vo).length > 0 ? h.map(xo).filter(fo) : h.filter(po) : null }) : null, t[2] = r?.description, t[3] = r?.title, t[4] = h, t[5] = $, t[6] = b, t[7] = j, t[8] = z, t[9] = n?.description, t[10] = n?.title, t[11] = s, t[12] = Ct) : Ct = t[12];
+  let bt;
+  t[13] !== I || t[14] !== V || t[15] !== r || t[16] !== l || t[17] !== w || t[18] !== M || t[19] !== h || t[20] !== mt || t[21] !== p || t[22] !== O || t[23] !== x || t[24] !== k || t[25] !== W || t[26] !== Y || t[27] !== H || t[28] !== X || t[29] !== N || t[30] !== Mt || t[31] !== P || t[32] !== E || t[33] !== D || t[34] !== ot || t[35] !== T || t[36] !== m || t[37] !== n || t[38] !== q || t[39] !== C || t[40] !== et || t[41] !== i || t[42] !== _ || t[43] !== A || t[44] !== L || t[45] !== s ? (bt = h.length === 0 ? /* @__PURE__ */ o.jsx(ao, {}) : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    E ? Mt === "categorical" ? /* @__PURE__ */ o.jsx(lo, { width: p ? void 0 : s, colorLegendTitle: w, colors: M || (typeof l[0] == "string" ? g[i].categoricalColors.colors : l.length === 2 ? [g[i].sequentialColors.neutralColorsx09[0], g[i].sequentialColors.neutralColorsx09[8]] : g[i].sequentialColors[`neutralColorsx0${l.length + 1}`]), colorDomain: l.map(go), setSelectedColor: Tt, showNAColor: ot, className: r?.colorLegend }) : Mt === "threshold" ? /* @__PURE__ */ o.jsx(no, { width: p ? void 0 : s, colorLegendTitle: w, colors: M || (typeof l[0] == "string" ? g[i].categoricalColors.colors : l.length === 2 ? [g[i].sequentialColors.neutralColorsx09[0], g[i].sequentialColors.neutralColorsx09[8]] : g[i].sequentialColors[`neutralColorsx0${l.length + 1}`]), colorDomain: l, setSelectedColor: Tt, naColor: x, showNAColor: ot }) : /* @__PURE__ */ o.jsx(so, { width: p ? void 0 : s, colorLegendTitle: w, colors: M || [g[i].sequentialColors.neutralColorsx09[0], g[i].sequentialColors.neutralColorsx09[8]], colorDomain: l, className: r?.colorLegend }) : null,
+    /* @__PURE__ */ o.jsx(co, { ref: Nt, children: et && C ? /* @__PURE__ */ o.jsx(mo, { data: h, colorDomain: l, width: p || !s || et < s ? et : s, height: C, colors: M || (typeof l[0] == "string" ? g[i].categoricalColors.colors : l.length === 2 ? [g[i].sequentialColors.neutralColorsx09[0], g[i].sequentialColors.neutralColorsx09[8]] : g[i].sequentialColors[`neutralColorsx0${l.length + 1}`]), noDataColor: x, scaleType: Mt, showColumnLabels: D, leftMargin: O, rightMargin: N, topMargin: A, bottomMargin: V, selectedColor: P, truncateBy: L, showRowLabels: T, tooltip: _, onSeriesMouseOver: W, showValues: m, suffix: q, prefix: H, onSeriesMouseClick: k, resetSelectionOnDoubleClick: X, detailsOnClick: mt, styles: n, classNames: r, animate: I === !0 ? {
+      duration: 0.5,
+      once: !0,
+      amount: 0.5
+    } : I || {
+      duration: 0,
+      once: !0,
+      amount: 0
+    }, precision: Y }) : null })
+  ] }), t[13] = I, t[14] = V, t[15] = r, t[16] = l, t[17] = w, t[18] = M, t[19] = h, t[20] = mt, t[21] = p, t[22] = O, t[23] = x, t[24] = k, t[25] = W, t[26] = Y, t[27] = H, t[28] = X, t[29] = N, t[30] = Mt, t[31] = P, t[32] = E, t[33] = D, t[34] = ot, t[35] = T, t[36] = m, t[37] = n, t[38] = q, t[39] = C, t[40] = et, t[41] = i, t[42] = _, t[43] = A, t[44] = L, t[45] = s, t[46] = bt) : bt = t[46];
+  let wt;
+  t[47] !== r?.footnote || t[48] !== r?.source || t[49] !== Z || t[50] !== U || t[51] !== n?.footnote || t[52] !== n?.source || t[53] !== s ? (wt = U || Z ? /* @__PURE__ */ o.jsx(ro, { styles: {
+    footnote: n?.footnote,
+    source: n?.source
+  }, classNames: {
+    footnote: r?.footnote,
+    source: r?.source
+  }, sources: U, footNote: Z, width: s }) : null, t[47] = r?.footnote, t[48] = r?.source, t[49] = Z, t[50] = U, t[51] = n?.footnote, t[52] = n?.source, t[53] = s, t[54] = wt) : wt = t[54];
+  let Ot;
+  return t[55] !== ct || t[56] !== S || t[57] !== lt || t[58] !== Q || t[59] !== tt || t[60] !== ht || t[61] !== R || t[62] !== u || t[63] !== Lt || t[64] !== St || t[65] !== At || t[66] !== Ct || t[67] !== bt || t[68] !== wt || t[69] !== i ? (Ot = /* @__PURE__ */ o.jsxs(uo, { className: Lt, style: St, id: lt, ref: Et, "aria-label": ct, backgroundColor: S, theme: i, language: tt, minHeight: ht, width: At, height: Q, relativeHeight: u, padding: R, children: [
+    Ct,
+    bt,
+    wt
+  ] }), t[55] = ct, t[56] = S, t[57] = lt, t[58] = Q, t[59] = tt, t[60] = ht, t[61] = R, t[62] = u, t[63] = Lt, t[64] = St, t[65] = At, t[66] = Ct, t[67] = bt, t[68] = wt, t[69] = i, t[70] = Ot) : Ot = t[70], Ot;
+}
+function go(a) {
+  return `${a}`;
+}
+function po(a) {
+  return a !== void 0;
+}
+function fo(a) {
+  return a !== void 0;
+}
+function xo(a) {
+  return a.data;
+}
+function vo(a) {
+  return a !== void 0;
+}
+function yo(a) {
+  return a.data;
 }
 export {
-  ot as HeatMap
+  Po as HeatMap
 };
 //# sourceMappingURL=HeatMap.js.map