@undp/data-viz 1.5.7 → 1.5.9

package/dist/BulletChart.js

@@ -1,36 +1,36 @@
-import { j as e, m as Vi } from "./index-CHPV5EwG-BPSP-7Jg.js";
+import { j as e, m as Vi } from "./index-CHPV5EwG-DBWUSD9b.js";
 import { useRef as ji, useState as gi, useEffect as zi } from "react";
 import { o as ki } from "./index-DvVprvy6.js";
 import { i as Oi } from "./index-Bwrro8-q.js";
-import { X as Ti } from "./Modal-DVVwpKhP.js";
+import { G as Ti } from "./Modal-Cg8daIlV.js";
 import { s as Ci } from "./index-CeVNqhMO.js";
 import { n as Ni } from "./numberFormattingFunction-14YCbkN2.js";
-import { T as $i } from "./Tooltip-CVCGWyzw.js";
+import { T as $i } from "./Tooltip-6LIdPQGC.js";
 import { c } from "./checkIfNullOrUndefined-DmfiKkNw.js";
 import { s as Ai } from "./string2HTML-oFCROsus.js";
-import { X as Xi } from "./XTicksAndGridLines-Bn9u5gOM.js";
-import { Y as Yi } from "./YAxesLabels-DECkMgq8.js";
-import { A as Di } from "./AxisTitle-BmHLMRJZ.js";
-import { A as Li } from "./Axis-Ddg-seDi.js";
-import { a as Ei, R as Gi } from "./ReferenceLine-CfAW3vKJ.js";
+import { X as Xi } from "./XTicksAndGridLines-DuydSnZ_.js";
+import { Y as Yi } from "./YAxesLabels-DlDyLvhi.js";
+import { A as Di } from "./AxisTitle-v6_xcXZ-.js";
+import { A as Li } from "./Axis-4gUOL8B7.js";
+import { a as Ei, R as Gi } from "./ReferenceLine-CPMaAX0r.js";
 import { a as Ii } from "./linear-DUdu7l2G.js";
 import { b as Si } from "./band-BEjh2CHI.js";
-import { u as Ri } from "./use-in-view-yS6jzJAp.js";
-import { m as _ } from "./proxy-CkpFesk1.js";
-import { A as Bi } from "./index-CNvov0eg.js";
+import { u as Ri } from "./use-in-view-DR-UTB96.js";
+import { m as U } from "./proxy-BYIC9BuT.js";
+import { A as Bi } from "./index-Cwgh7i7X.js";
 import { GraphFooter as qi } from "./GraphFooter.js";
 import { GraphHeader as Fi } from "./GraphHeader.js";
 import { Colors as vi } from "./Colors.js";
-import { E as Hi } from "./EmptyState-DdTp-Mdn.js";
+import { E as Hi } from "./EmptyState-36lXXyui.js";
 import { ColorLegend as Pi } from "./ColorLegend.js";
-import { X as _i } from "./XAxesLabels-loO78vUO.js";
-import { Y as Ui } from "./YTicksAndGridLines-B6ah7CRf.js";
+import { X as _i } from "./XAxesLabels-SOSmso5J.js";
+import { Y as Ui } from "./YTicksAndGridLines-7t4MKtGw.js";
 function Ji(wi) {
   const {
     data: r,
-    barColor: y,
-    suffix: U,
-    prefix: J,
+    barColor: p,
+    suffix: J,
+    prefix: R,
     barPadding: K,
     showValues: ri,
     showTicks: Q,
@@ -42,15 +42,15 @@ function Ji(wi) {
     topMargin: z,
     bottomMargin: ti,
     showLabels: o,
-    tooltip: R,
+    tooltip: B,
     onSeriesMouseOver: T,
     refValues: A,
     highlightedDataPoints: g,
-    maxValue: B,
+    maxValue: q,
     minValue: b,
-    onSeriesMouseClick: q,
+    onSeriesMouseClick: F,
     labelOrder: ei,
-    rtl: F,
+    rtl: H,
     maxBarThickness: D,
     minBarThickness: di,
     resetSelectionOnDoubleClick: L,
@@ -61,46 +61,46 @@ function Ji(wi) {
     styles: x,
     classNames: C,
     targetStyle: li,
-    targetColor: H,
+    targetColor: P,
     qualitativeRangeColors: I,
     measureBarWidthFactor: h,
     animate: s,
     dimmedOpacity: j,
-    precision: P,
+    precision: W,
     customLayers: S,
-    naLabel: W
-  } = wi, p = ji(null), m = Ri(p, {
+    naLabel: X
+  } = wi, y = ji(null), m = Ri(y, {
     once: s.once,
     amount: s.amount
-  }), [si, X] = gi(void 0), [V, Y] = gi(void 0), [oi, N] = gi(void 0), [f, w] = gi(void 0), u = {
+  }), [si, Y] = gi(void 0), [V, E] = gi(void 0), [oi, N] = gi(void 0), [f, w] = gi(void 0), u = {
     top: ai ? z + 25 : z,
     bottom: ti,
     left: yi,
     right: bi
-  }, E = Z - u.left - u.right, O = ii - u.top - u.bottom, hi = Math.max(...r.filter((i) => !c(i.size)).map((i) => i.size)) < 0 ? 0 : Math.max(...r.filter((i) => !c(i.size)).map((i) => i.size)), G = Math.max(...r.filter((i) => !c(i.target)).map((i) => i.target)) < 0 ? 0 : Math.max(
+  }, G = Z - u.left - u.right, O = ii - u.top - u.bottom, hi = Math.max(...r.filter((i) => !c(i.size)).map((i) => i.size)) < 0 ? 0 : Math.max(...r.filter((i) => !c(i.size)).map((i) => i.size)), _ = Math.max(...r.filter((i) => !c(i.target)).map((i) => i.target)) < 0 ? 0 : Math.max(
     ...r.filter((i) => !c(i.target)).map((i) => i.target)
   ), ci = Math.max(
     ...r.map((i) => Ci((i.qualitativeRange || []).filter((n) => !c(n))) || 0)
-  ), xi = c(B) ? Math.max(...[hi, G, ci].filter(Number.isFinite)) < 0 ? 0 : Math.max(
-    ...[hi, G, ci].filter(Number.isFinite)
-  ) : B, ui = Math.min(...r.filter((i) => !c(i.size)).map((i) => i.size)) >= 0 ? 0 : Math.min(...r.filter((i) => !c(i.size)).map((i) => i.size)), M = Math.min(...r.filter((i) => !c(i.target)).map((i) => i.target)) >= 0 ? 0 : Math.min(
+  ), xi = c(q) ? Math.max(...[hi, _, ci].filter(Number.isFinite)) < 0 ? 0 : Math.max(
+    ...[hi, _, ci].filter(Number.isFinite)
+  ) : q, ui = Math.min(...r.filter((i) => !c(i.size)).map((i) => i.size)) >= 0 ? 0 : Math.min(...r.filter((i) => !c(i.size)).map((i) => i.size)), M = Math.min(...r.filter((i) => !c(i.target)).map((i) => i.target)) >= 0 ? 0 : Math.min(
     ...r.filter((i) => !c(i.target)).map((i) => i.target)
   ), a = c(b) ? Math.min(...[ui, M].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[ui, M].filter(Number.isFinite)) : b, fi = r.map((i, n) => ({
     ...i,
     id: ei ? `${i.label}` : `${n}`
-  })), l = Ii().domain([a, xi]).range([0, E]).nice(), v = ei || fi.map((i) => `${i.id}`), d = Si().domain(v).range([
+  })), l = Ii().domain([a, xi]).range([0, G]).nice(), v = ei || fi.map((i) => `${i.id}`), d = Si().domain(v).range([
     0,
     di ? Math.max(O, di * v.length) : D ? Math.min(O, D * v.length) : O
   ]).paddingInner(K), t = l.ticks(k);
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
-      _.svg,
+      U.svg,
       {
         width: `${Z}px`,
         height: `${ii}px`,
         viewBox: `0 0 ${Z} ${ii}`,
         direction: "ltr",
-        ref: p,
+        ref: y,
         children: /* @__PURE__ */ e.jsxs("g", { transform: `translate(${u.left},${u.top})`, children: [
           Q ? /* @__PURE__ */ e.jsx(
             Xi,
@@ -117,17 +117,17 @@ function Ji(wi) {
                 gridLines: C?.xAxis?.gridLines,
                 labels: C?.xAxis?.labels
               },
-              suffix: U,
-              prefix: J,
+              suffix: J,
+              prefix: R,
               labelType: "secondary",
               showGridLines: !0,
-              precision: P
+              precision: W
             }
           ) : null,
           /* @__PURE__ */ e.jsx(
             Di,
             {
-              x: E / 2,
+              x: G / 2,
               y: 0 - u.top + 15,
               style: x?.xAxis?.title,
               className: C?.xAxis?.title,
@@ -149,20 +149,20 @@ function Ji(wi) {
           /* @__PURE__ */ e.jsxs(Bi, { children: [
             fi.map(
               (i) => c(d(i.id)) ? null : /* @__PURE__ */ e.jsxs(
-                _.g,
+                U.g,
                 {
                   className: "undp-viz-g-with-hover",
                   onMouseEnter: (n) => {
-                    X(i), w(n.clientY), N(n.clientX), T?.(i);
+                    Y(i), w(n.clientY), N(n.clientX), T?.(i);
                   },
                   onClick: () => {
-                    (q || $) && (Oi(V, i) && L ? (Y(void 0), q?.(void 0)) : (Y(i), q?.(i)));
+                    (F || $) && (Oi(V, i) && L ? (E(void 0), F?.(void 0)) : (E(i), F?.(i)));
                   },
                   onMouseMove: (n) => {
-                    X(i), w(n.clientY), N(n.clientX);
+                    Y(i), w(n.clientY), N(n.clientX);
                   },
                   onMouseLeave: () => {
-                    X(void 0), N(void 0), w(void 0), T?.(void 0);
+                    Y(void 0), N(void 0), w(void 0), T?.(void 0);
                   },
                   exit: { opacity: 0, transition: { duration: s.duration } },
                   variants: {
@@ -182,7 +182,7 @@ function Ji(wi) {
                   animate: m ? "whileInView" : "initial",
                   children: [
                     i.qualitativeRange ? i.qualitativeRange.map((n, pi) => /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         exit: {
                           width: 0,
@@ -216,13 +216,13 @@ function Ji(wi) {
                       pi
                     )) : null,
                     i.target && li === "background" ? /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         y: 0,
                         x: i.target >= 0 ? l(0) : l(i.target),
                         height: d.bandwidth(),
                         style: {
-                          fill: H
+                          fill: P
                         },
                         exit: {
                           width: 0,
@@ -245,11 +245,11 @@ function Ji(wi) {
                       }
                     ) : null,
                     i.size ? /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         y: d.bandwidth() * ((1 - h) / 2),
                         style: {
-                          fill: y
+                          fill: p
                         },
                         height: d.bandwidth() * h,
                         exit: {
@@ -273,12 +273,12 @@ function Ji(wi) {
                       }
                     ) : null,
                     i.target && li === "line" ? /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         y: 0,
                         height: d.bandwidth(),
                         style: {
-                          fill: H
+                          fill: P
                         },
                         width: 2,
                         exit: {
@@ -317,17 +317,16 @@ function Ji(wi) {
                       }
                     ) : null,
                     ri ? /* @__PURE__ */ e.jsx(
-                      _.text,
+                      U.text,
                       {
                         y: d.bandwidth() / 2,
                         style: {
-                          ...ni ? { fill: ni } : { fill: y },
                           textAnchor: i.size && i.size < 0 ? "end" : "start",
                           ...x?.graphObjectValues || {}
                         },
                         className: Vi(
                           "graph-value text-sm",
-                          !ni && y.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
+                          !ni && p.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
                           C?.graphObjectValues
                         ),
                         dx: i.size && i.size < 0 ? -5 : 5,
@@ -336,17 +335,19 @@ function Ji(wi) {
                         variants: {
                           initial: {
                             x: l(0),
-                            opacity: 0
+                            opacity: 0,
+                            fill: ni || p
                           },
                           whileInView: {
                             x: i.size ? l(i.size) : l(0),
                             opacity: 1,
+                            fill: ni || p,
                             transition: { duration: s.duration }
                           }
                         },
                         initial: "initial",
                         animate: m ? "whileInView" : "initial",
-                        children: Ni(i.size, W, P, J, U)
+                        children: Ni(i.size, X, W, R, J)
                       }
                     ) : null
                   ]
@@ -362,7 +363,7 @@ function Ji(wi) {
                 x: l(i.value),
                 y1: 0 - u.top,
                 y2: O + u.bottom,
-                textSide: l(i.value) > E * 0.75 || F ? "left" : "right",
+                textSide: l(i.value) > G * 0.75 || H ? "left" : "right",
                 classNames: i.classNames,
                 styles: i.styles,
                 animate: s,
@@ -375,11 +376,11 @@ function Ji(wi) {
         ] })
       }
     ),
-    si && R && oi && f ? /* @__PURE__ */ e.jsx(
+    si && B && oi && f ? /* @__PURE__ */ e.jsx(
       $i,
       {
         data: si,
-        body: R,
+        body: B,
         xPos: oi,
         yPos: f,
         backgroundStyle: x?.tooltip,
@@ -391,7 +392,7 @@ function Ji(wi) {
       {
         open: V !== void 0,
         onClose: () => {
-          Y(void 0);
+          E(void 0);
         },
         children: /* @__PURE__ */ e.jsx(
           "div",
@@ -408,9 +409,9 @@ function Ji(wi) {
 function Ki(wi) {
   const {
     data: r,
-    graphTitle: y,
-    barColor: U = vi.primaryColors["blue-600"],
-    suffix: J = "",
+    graphTitle: p,
+    barColor: J = vi.primaryColors["blue-600"],
+    suffix: R = "",
     sources: K,
     prefix: ri = "",
     graphDescription: Q,
@@ -422,15 +423,15 @@ function Ki(wi) {
     truncateBy: z = 999,
     height: ti,
     width: o,
-    footNote: R,
+    footNote: B,
     colorDomain: T,
     colorLegendTitle: A,
     highlightedDataPoints: g = [],
-    padding: B,
+    padding: q,
     backgroundColor: b = !1,
-    topMargin: q = 25,
+    topMargin: F = 25,
     bottomMargin: ei = 10,
-    showLabels: F = !0,
+    showLabels: H = !0,
     relativeHeight: D,
     tooltip: di,
     onSeriesMouseOver: L,
@@ -441,29 +442,29 @@ function Ki(wi) {
     minValue: x,
     onSeriesMouseClick: C,
     graphDownload: li = !1,
-    dataDownload: H = !1,
+    dataDownload: P = !1,
     sortData: I,
     labelOrder: h,
     language: s = "en",
     minHeight: j = 0,
-    theme: P = "light",
+    theme: W = "light",
     maxBarThickness: S,
-    maxNumberOfBars: W,
-    minBarThickness: p,
+    maxNumberOfBars: X,
+    minBarThickness: y,
     ariaLabel: m,
     resetSelectionOnDoubleClick: si = !0,
-    detailsOnClick: X,
+    detailsOnClick: Y,
     barAxisTitle: V,
-    noOfTicks: Y = 5,
+    noOfTicks: E = 5,
     valueColor: oi,
     styles: N,
     classNames: f,
     filterNA: w = !0,
     targetStyle: u = "line",
-    targetColor: E = vi.light.grays["gray-700"],
+    targetColor: G = vi.light.grays["gray-700"],
     qualitativeRangeColors: O,
     measureBarWidthFactor: hi = 0.4,
-    animate: G = !1,
+    animate: _ = !1,
     dimmedOpacity: ci = 0.3,
     precision: xi = 2,
     customLayers: ui = [],
@@ -477,7 +478,7 @@ function Ki(wi) {
   }, [o, ti]), /* @__PURE__ */ e.jsx(
     "div",
     {
-      className: `${P || "light"} flex ${o ? "w-fit grow-0" : "w-full grow"}`,
+      className: `${W || "light"} flex ${o ? "w-fit grow-0" : "w-full grow"}`,
       dir: s === "he" || s === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ e.jsx(
         "div",
@@ -493,14 +494,14 @@ function Ki(wi) {
           },
           id: ni,
           ref: t,
-          "aria-label": m || `${y ? `The graph shows ${y}. ` : ""}This is a bar chart. ${Q ? ` ${Q}` : ""}`,
+          "aria-label": m || `${p ? `The graph shows ${p}. ` : ""}This is a bar chart. ${Q ? ` ${Q}` : ""}`,
           children: /* @__PURE__ */ e.jsx(
             "div",
             {
               className: "flex grow",
-              style: { padding: b ? B || "1rem" : B || 0 },
+              style: { padding: b ? q || "1rem" : q || 0 },
               children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                y || Q || li || H ? /* @__PURE__ */ e.jsx(
+                p || Q || li || P ? /* @__PURE__ */ e.jsx(
                   Fi,
                   {
                     styles: {
@@ -511,11 +512,11 @@ function Ki(wi) {
                       title: f?.title,
                       description: f?.description
                     },
-                    graphTitle: y,
+                    graphTitle: p,
                     graphDescription: Q,
                     width: o,
                     graphDownload: li ? t.current : void 0,
-                    dataDownload: H ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
+                    dataDownload: P ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
                   }
                 ) : null,
                 /* @__PURE__ */ e.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: r.length === 0 ? /* @__PURE__ */ e.jsx(Hi, {}) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
@@ -524,7 +525,7 @@ function Ki(wi) {
                     {
                       width: o,
                       colorLegendTitle: A,
-                      colors: O || vi[P].sequentialColors.positiveColorsx10,
+                      colors: O || vi[W].sequentialColors.positiveColorsx10,
                       colorDomain: T,
                       showNAColor: !1
                     }
@@ -544,25 +545,25 @@ function Ki(wi) {
                               (i) => i.size === void 0 ? I === "asc" ? -1 / 0 : 1 / 0 : i.size
                             ],
                             [I]
-                          ).filter((i, n) => W ? n < W : !0) : r.filter((i) => w ? !c(i.size) : i).filter((i, n) => W ? n < W : !0),
-                          barColor: U,
-                          targetColor: E,
+                          ).filter((i, n) => X ? n < X : !0) : r.filter((i) => w ? !c(i.size) : i).filter((i, n) => X ? n < X : !0),
+                          barColor: J,
+                          targetColor: G,
                           width: o || a,
                           height: Math.max(
                             j,
                             ti || (D ? j ? (o || a) * D > j ? (o || a) * D : j : (o || a) * D : l)
                           ),
-                          suffix: J,
+                          suffix: R,
                           prefix: ri,
                           barPadding: yi,
                           showValues: mi,
                           showTicks: Z,
                           leftMargin: ii,
                           rightMargin: bi,
-                          topMargin: q,
+                          topMargin: F,
                           bottomMargin: ei,
                           truncateBy: z,
-                          showLabels: F,
+                          showLabels: H,
                           tooltip: di,
                           onSeriesMouseOver: L,
                           refValues: $,
@@ -573,18 +574,18 @@ function Ki(wi) {
                           labelOrder: h,
                           rtl: s === "he" || s === "ar",
                           maxBarThickness: S,
-                          minBarThickness: p,
+                          minBarThickness: y,
                           resetSelectionOnDoubleClick: si,
-                          detailsOnClick: X,
+                          detailsOnClick: Y,
                           barAxisTitle: V,
-                          noOfTicks: Y,
+                          noOfTicks: E,
                           valueColor: oi,
                           classNames: f,
                           styles: N,
                           targetStyle: u,
-                          qualitativeRangeColors: O || vi[P].sequentialColors.positiveColorsx10,
+                          qualitativeRangeColors: O || vi[W].sequentialColors.positiveColorsx10,
                           measureBarWidthFactor: hi,
-                          animate: G === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : G || { duration: 0, once: !0, amount: 0 },
+                          animate: _ === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : _ || { duration: 0, once: !0, amount: 0 },
                           dimmedOpacity: ci,
                           precision: xi,
                           customLayers: ui,
@@ -594,11 +595,11 @@ function Ki(wi) {
                     }
                   )
                 ] }) }),
-                K || R ? /* @__PURE__ */ e.jsx(
+                K || B ? /* @__PURE__ */ e.jsx(
                   qi,
                   {
                     sources: K,
-                    footNote: R,
+                    footNote: B,
                     width: o,
                     styles: { footnote: N?.footnote, source: N?.source },
                     classNames: {
@@ -618,9 +619,9 @@ function Ki(wi) {
 function Qi(wi) {
   const {
     data: r,
-    width: y,
-    height: U,
-    barColor: J,
+    width: p,
+    height: J,
+    barColor: R,
     suffix: K,
     prefix: ri,
     barPadding: Q,
@@ -632,15 +633,15 @@ function Qi(wi) {
     topMargin: z,
     bottomMargin: ti,
     leftMargin: o,
-    tooltip: R,
+    tooltip: B,
     onSeriesMouseOver: T,
     refValues: A,
     maxValue: g,
-    minValue: B,
+    minValue: q,
     highlightedDataPoints: b,
-    onSeriesMouseClick: q,
+    onSeriesMouseClick: F,
     labelOrder: ei,
-    maxBarThickness: F,
+    maxBarThickness: H,
     minBarThickness: D,
     resetSelectionOnDoubleClick: di,
     detailsOnClick: L,
@@ -651,14 +652,14 @@ function Qi(wi) {
     classNames: x,
     targetStyle: C,
     targetColor: li,
-    qualitativeRangeColors: H,
+    qualitativeRangeColors: P,
     measureBarWidthFactor: I,
     animate: h,
     dimmedOpacity: s,
     precision: j,
-    customLayers: P,
+    customLayers: W,
     naLabel: S
-  } = wi, W = ji(null), p = Ri(W, {
+  } = wi, X = ji(null), y = Ri(X, {
     once: h.once,
     amount: h.amount
   }), m = {
@@ -666,28 +667,28 @@ function Qi(wi) {
     bottom: ti,
     left: $ ? o + 30 : o,
     right: bi
-  }, [si, X] = gi(void 0), [V, Y] = gi(void 0), [oi, N] = gi(void 0), [f, w] = gi(void 0), u = y - m.left - m.right, E = U - m.top - m.bottom, O = Math.max(...r.filter((t) => !c(t.size)).map((t) => t.size)) < 0 ? 0 : Math.max(...r.filter((t) => !c(t.size)).map((t) => t.size)), hi = Math.max(...r.filter((t) => !c(t.target)).map((t) => t.target)) < 0 ? 0 : Math.max(...r.filter((t) => !c(t.size)).map((t) => t.target)), G = Math.max(
+  }, [si, Y] = gi(void 0), [V, E] = gi(void 0), [oi, N] = gi(void 0), [f, w] = gi(void 0), u = p - m.left - m.right, G = J - m.top - m.bottom, O = Math.max(...r.filter((t) => !c(t.size)).map((t) => t.size)) < 0 ? 0 : Math.max(...r.filter((t) => !c(t.size)).map((t) => t.size)), hi = Math.max(...r.filter((t) => !c(t.target)).map((t) => t.target)) < 0 ? 0 : Math.max(...r.filter((t) => !c(t.size)).map((t) => t.target)), _ = Math.max(
     ...r.map((t) => Ci((t.qualitativeRange || []).filter((i) => !c(i))) || 0)
-  ), ci = c(g) ? Math.max(...[O, hi, G].filter(Number.isFinite)) < 0 ? 0 : Math.max(
-    ...[O, hi, G].filter(Number.isFinite)
+  ), ci = c(g) ? Math.max(...[O, hi, _].filter(Number.isFinite)) < 0 ? 0 : Math.max(
+    ...[O, hi, _].filter(Number.isFinite)
   ) : g, xi = Math.min(...r.filter((t) => !c(t.size)).map((t) => t.size)) >= 0 ? 0 : Math.min(...r.filter((t) => !c(t.size)).map((t) => t.size)), ui = Math.min(...r.filter((t) => !c(t.target)).map((t) => t.target)) >= 0 ? 0 : Math.min(
     ...r.filter((t) => !c(t.target)).map((t) => t.target)
-  ), M = c(B) ? Math.min(...[xi, ui].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[xi, ui].filter(Number.isFinite)) : B, a = Ii().domain([M, ci]).range([E, 0]).nice(), fi = r.map((t, i) => ({
+  ), M = c(q) ? Math.min(...[xi, ui].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[xi, ui].filter(Number.isFinite)) : q, a = Ii().domain([M, ci]).range([G, 0]).nice(), fi = r.map((t, i) => ({
     ...t,
     id: ei ? `${t.label}` : `${i}`
   })), l = ei || fi.map((t) => `${t.id}`), v = Si().domain(l).range([
     0,
-    D ? Math.max(u, D * l.length) : F ? Math.min(u, F * l.length) : u
+    D ? Math.max(u, D * l.length) : H ? Math.min(u, H * l.length) : u
   ]).paddingInner(Q), d = a.ticks(ni);
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
-      _.svg,
+      U.svg,
       {
-        width: `${y}px`,
-        height: `${U}px`,
-        viewBox: `0 0 ${y} ${U}`,
+        width: `${p}px`,
+        height: `${J}px`,
+        viewBox: `0 0 ${p} ${J}`,
         direction: "ltr",
-        ref: W,
+        ref: X,
         children: /* @__PURE__ */ e.jsxs("g", { transform: `translate(${m.left},${m.top})`, children: [
           /* @__PURE__ */ e.jsx(
             Li,
@@ -743,31 +744,31 @@ function Qi(wi) {
             Di,
             {
               x: 0 - o - 15,
-              y: E / 2,
+              y: G / 2,
               style: k?.yAxis?.title,
               className: x?.yAxis?.title,
               text: $,
               rotate90: !0
             }
           ),
-          P.filter((t) => t.position === "before").map((t) => t.layer),
+          W.filter((t) => t.position === "before").map((t) => t.layer),
           /* @__PURE__ */ e.jsxs(Bi, { children: [
             fi.map(
               (t) => c(v(t.id)) ? null : /* @__PURE__ */ e.jsxs(
-                _.g,
+                U.g,
                 {
                   className: "undp-viz-g-with-hover",
                   onMouseEnter: (i) => {
-                    X(t), w(i.clientY), N(i.clientX), T?.(t);
+                    Y(t), w(i.clientY), N(i.clientX), T?.(t);
                   },
                   onClick: () => {
-                    (q || L) && (Oi(V, t) && di ? (Y(void 0), q?.(void 0)) : (Y(t), q?.(t)));
+                    (F || L) && (Oi(V, t) && di ? (E(void 0), F?.(void 0)) : (E(t), F?.(t)));
                   },
                   onMouseMove: (i) => {
-                    X(t), w(i.clientY), N(i.clientX);
+                    Y(t), w(i.clientY), N(i.clientX);
                   },
                   onMouseLeave: () => {
-                    X(void 0), N(void 0), w(void 0), T?.(void 0);
+                    Y(void 0), N(void 0), w(void 0), T?.(void 0);
                   },
                   exit: { opacity: 0, transition: { duration: h.duration } },
                   variants: {
@@ -784,10 +785,10 @@ function Qi(wi) {
                     }
                   },
                   initial: "initial",
-                  animate: p ? "whileInView" : "initial",
+                  animate: y ? "whileInView" : "initial",
                   children: [
                     t.qualitativeRange ? t.qualitativeRange.map((i, n) => /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         x: 0,
                         exit: {
@@ -799,7 +800,7 @@ function Qi(wi) {
                           initial: {
                             height: 0,
                             y: a(0),
-                            fill: H[n]
+                            fill: P[n]
                           },
                           whileInView: {
                             height: Math.abs(
@@ -824,18 +825,18 @@ function Qi(wi) {
                                 )
                               )
                             ),
-                            fill: H[n],
+                            fill: P[n],
                             transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: p ? "whileInView" : "initial",
+                        animate: y ? "whileInView" : "initial",
                         width: v.bandwidth()
                       },
                       n
                     )) : null,
                     t.target && C === "background" ? /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         x: 0,
                         width: v.bandwidth(),
@@ -859,16 +860,16 @@ function Qi(wi) {
                           }
                         },
                         initial: "initial",
-                        animate: p ? "whileInView" : "initial"
+                        animate: y ? "whileInView" : "initial"
                       }
                     ) : null,
                     t.size ? /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         x: v.bandwidth() * ((1 - I) / 2),
                         width: v.bandwidth() * I,
                         style: {
-                          fill: J
+                          fill: R
                         },
                         exit: {
                           height: 0,
@@ -887,11 +888,11 @@ function Qi(wi) {
                           }
                         },
                         initial: "initial",
-                        animate: p ? "whileInView" : "initial"
+                        animate: y ? "whileInView" : "initial"
                       }
                     ) : null,
                     t.target && C === "line" ? /* @__PURE__ */ e.jsx(
-                      _.rect,
+                      U.rect,
                       {
                         x: 0,
                         width: v.bandwidth(),
@@ -915,7 +916,7 @@ function Qi(wi) {
                           }
                         },
                         initial: "initial",
-                        animate: p ? "whileInView" : "initial",
+                        animate: y ? "whileInView" : "initial",
                         height: 2
                       }
                     ) : null,
@@ -931,21 +932,20 @@ function Qi(wi) {
                         className: x?.xAxis?.labels,
                         alignment: (t.size || 0) < 0 ? "bottom" : "top",
                         animate: h,
-                        isInView: p
+                        isInView: y
                       }
                     ) : null,
                     mi ? /* @__PURE__ */ e.jsx(
-                      _.text,
+                      U.text,
                       {
                         x: v.bandwidth() / 2,
                         style: {
-                          ...ai ? { fill: ai } : { fill: J },
                           textAnchor: "middle",
                           ...k?.graphObjectValues || {}
                         },
                         className: Vi(
                           "graph-value text-sm",
-                          !ai && J.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
+                          !ai && R.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
                           x?.graphObjectValues
                         ),
                         dy: t.size ? t.size >= 0 ? "-5px" : "1em" : "-5px",
@@ -953,16 +953,18 @@ function Qi(wi) {
                         variants: {
                           initial: {
                             y: a(0),
-                            opacity: 0
+                            opacity: 0,
+                            fill: ai || R
                           },
                           whileInView: {
                             y: a(t.size || 0),
                             opacity: 1,
+                            fill: ai || R,
                             transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: p ? "whileInView" : "initial",
+                        animate: y ? "whileInView" : "initial",
                         children: Ni(t.size, S, j, ri, K)
                       }
                     ) : null
@@ -982,20 +984,20 @@ function Qi(wi) {
                 classNames: t.classNames,
                 styles: t.styles,
                 animate: h,
-                isInView: p
+                isInView: y
               },
               i
             )) }) : null
           ] }),
-          P.filter((t) => t.position === "after").map((t) => t.layer)
+          W.filter((t) => t.position === "after").map((t) => t.layer)
         ] })
       }
     ),
-    si && R && oi && f ? /* @__PURE__ */ e.jsx(
+    si && B && oi && f ? /* @__PURE__ */ e.jsx(
       $i,
       {
         data: si,
-        body: R,
+        body: B,
         xPos: oi,
         yPos: f,
         backgroundStyle: k?.tooltip,
@@ -1007,7 +1009,7 @@ function Qi(wi) {
       {
         open: V !== void 0,
         onClose: () => {
-          Y(void 0);
+          E(void 0);
         },
         children: /* @__PURE__ */ e.jsx(
           "div",
@@ -1024,9 +1026,9 @@ function Qi(wi) {
 function Zi(wi) {
   const {
     data: r,
-    graphTitle: y,
-    barColor: U = vi.primaryColors["blue-600"],
-    barPadding: J = 0.25,
+    graphTitle: p,
+    barColor: J = vi.primaryColors["blue-600"],
+    barPadding: R = 0.25,
     showTicks: K = !0,
     leftMargin: ri = 20,
     rightMargin: Q = 20,
@@ -1038,15 +1040,15 @@ function Zi(wi) {
     backgroundColor: z = !1,
     suffix: ti = "",
     prefix: o = "",
-    sources: R,
+    sources: B,
     graphDescription: T,
     height: A,
     width: g,
-    footNote: B,
+    footNote: q,
     colorDomain: b,
-    colorLegendTitle: q,
+    colorLegendTitle: F,
     padding: ei,
-    relativeHeight: F,
+    relativeHeight: H,
     tooltip: D,
     onSeriesMouseOver: di,
     refValues: L,
@@ -1057,29 +1059,29 @@ function Zi(wi) {
     highlightedDataPoints: x = [],
     qualitativeRangeColors: C,
     onSeriesMouseClick: li,
-    graphDownload: H = !1,
+    graphDownload: P = !1,
     dataDownload: I = !1,
     language: h = "en",
     theme: s = "light",
     sortData: j,
-    labelOrder: P,
+    labelOrder: W,
     minHeight: S = 0,
-    maxBarThickness: W,
-    maxNumberOfBars: p,
+    maxBarThickness: X,
+    maxNumberOfBars: y,
     minBarThickness: m,
     ariaLabel: si,
-    resetSelectionOnDoubleClick: X = !0,
+    resetSelectionOnDoubleClick: Y = !0,
     detailsOnClick: V,
-    barAxisTitle: Y,
+    barAxisTitle: E,
     noOfTicks: oi = 5,
     valueColor: N,
     styles: f,
     classNames: w,
     targetColor: u = vi.light.grays["gray-700"],
-    filterNA: E = !0,
+    filterNA: G = !0,
     targetStyle: O = "line",
     measureBarWidthFactor: hi = 0.4,
-    animate: G = !1,
+    animate: _ = !1,
     dimmedOpacity: ci = 0.3,
     precision: xi = 2,
     customLayers: ui = [],
@@ -1109,14 +1111,14 @@ function Zi(wi) {
           },
           id: ai,
           ref: t,
-          "aria-label": si || `${y ? `The graph shows ${y}. ` : ""}This is a grouped bar chart. ${T ? ` ${T}` : ""}`,
+          "aria-label": si || `${p ? `The graph shows ${p}. ` : ""}This is a grouped bar chart. ${T ? ` ${T}` : ""}`,
           children: /* @__PURE__ */ e.jsx(
             "div",
             {
               className: "flex grow",
               style: { padding: z ? ei || "1rem" : ei || 0 },
               children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                y || T || H || I ? /* @__PURE__ */ e.jsx(
+                p || T || P || I ? /* @__PURE__ */ e.jsx(
                   Fi,
                   {
                     styles: {
@@ -1127,10 +1129,10 @@ function Zi(wi) {
                       title: w?.title,
                       description: w?.description
                     },
-                    graphTitle: y,
+                    graphTitle: p,
                     graphDescription: T,
                     width: g,
-                    graphDownload: H ? t.current : void 0,
+                    graphDownload: P ? t.current : void 0,
                     dataDownload: I ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
                   }
                 ) : null,
@@ -1139,7 +1141,7 @@ function Zi(wi) {
                     Pi,
                     {
                       width: g,
-                      colorLegendTitle: q,
+                      colorLegendTitle: F,
                       colors: C || vi[s].sequentialColors.positiveColorsx10,
                       colorDomain: b,
                       showNAColor: !1
@@ -1155,23 +1157,23 @@ function Zi(wi) {
                         Qi,
                         {
                           data: j ? ki(
-                            r.filter((i) => E ? !c(i.size) : i),
+                            r.filter((i) => G ? !c(i.size) : i),
                             [
                               (i) => i.size === void 0 ? j === "asc" ? -1 / 0 : 1 / 0 : i.size
                             ],
                             [j]
-                          ).filter((i, n) => p ? n < p : !0) : r.filter((i) => E ? !c(i.size) : i).filter((i, n) => p ? n < p : !0),
-                          barColor: U,
+                          ).filter((i, n) => y ? n < y : !0) : r.filter((i) => G ? !c(i.size) : i).filter((i, n) => y ? n < y : !0),
+                          barColor: J,
                           targetColor: u,
                           width: g || a,
                           refValues: L,
                           height: Math.max(
                             S,
-                            A || (F ? S ? (g || a) * F > S ? (g || a) * F : S : (g || a) * F : l)
+                            A || (H ? S ? (g || a) * H > S ? (g || a) * H : S : (g || a) * H : l)
                           ),
                           suffix: ti,
                           prefix: o,
-                          barPadding: J,
+                          barPadding: R,
                           showLabels: ii,
                           showValues: bi,
                           showTicks: K,
@@ -1187,12 +1189,12 @@ function Zi(wi) {
                           minValue: k,
                           highlightedDataPoints: x,
                           onSeriesMouseClick: li,
-                          labelOrder: P,
-                          maxBarThickness: W,
+                          labelOrder: W,
+                          maxBarThickness: X,
                           minBarThickness: m,
-                          resetSelectionOnDoubleClick: X,
+                          resetSelectionOnDoubleClick: Y,
                           detailsOnClick: V,
-                          barAxisTitle: Y,
+                          barAxisTitle: E,
                           noOfTicks: oi,
                           valueColor: N,
                           styles: f,
@@ -1200,7 +1202,7 @@ function Zi(wi) {
                           targetStyle: O,
                           dimmedOpacity: ci,
                           measureBarWidthFactor: hi,
-                          animate: G === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : G || { duration: 0, once: !0, amount: 0 },
+                          animate: _ === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : _ || { duration: 0, once: !0, amount: 0 },
                           precision: xi,
                           customLayers: ui,
                           naLabel: M
@@ -1209,7 +1211,7 @@ function Zi(wi) {
                     }
                   )
                 ] }) }),
-                R || B ? /* @__PURE__ */ e.jsx(
+                B || q ? /* @__PURE__ */ e.jsx(
                   qi,
                   {
                     styles: { footnote: f?.footnote, source: f?.source },
@@ -1217,8 +1219,8 @@ function Zi(wi) {
                       footnote: w?.footnote,
                       source: w?.source
                     },
-                    sources: R,
-                    footNote: B,
+                    sources: B,
+                    footNote: q,
                     width: g
                   }
                 ) : null
@@ -1233,9 +1235,9 @@ function Zi(wi) {
 function zt(wi) {
   const {
     data: r,
-    graphTitle: y,
-    barColor: U,
-    barPadding: J,
+    graphTitle: p,
+    barColor: J,
+    barPadding: R,
     showTicks: K,
     leftMargin: ri,
     rightMargin: Q,
@@ -1247,15 +1249,15 @@ function zt(wi) {
     backgroundColor: z,
     suffix: ti,
     prefix: o,
-    sources: R,
+    sources: B,
     graphDescription: T,
     height: A,
     width: g,
-    footNote: B,
+    footNote: q,
     colorDomain: b,
-    colorLegendTitle: q,
+    colorLegendTitle: F,
     padding: ei,
-    relativeHeight: F,
+    relativeHeight: H,
     tooltip: D,
     onSeriesMouseOver: di,
     refValues: L,
@@ -1266,29 +1268,29 @@ function zt(wi) {
     highlightedDataPoints: x,
     onSeriesMouseClick: C,
     graphDownload: li,
-    dataDownload: H,
+    dataDownload: P,
     language: I,
     theme: h,
     sortData: s,
     labelOrder: j,
-    minHeight: P,
+    minHeight: W,
     maxBarThickness: S,
-    maxNumberOfBars: W,
-    minBarThickness: p,
+    maxNumberOfBars: X,
+    minBarThickness: y,
     ariaLabel: m,
     resetSelectionOnDoubleClick: si,
-    detailsOnClick: X,
+    detailsOnClick: Y,
     barAxisTitle: V,
-    noOfTicks: Y,
+    noOfTicks: E,
     valueColor: oi,
     orientation: N = "vertical",
     styles: f,
     classNames: w,
     filterNA: u,
-    targetStyle: E,
+    targetStyle: G,
     targetColor: O,
     qualitativeRangeColors: hi,
-    measureBarWidthFactor: G,
+    measureBarWidthFactor: _,
     animate: ci,
     dimmedOpacity: xi,
     precision: ui,
@@ -1298,9 +1300,9 @@ function zt(wi) {
     Zi,
     {
       data: r,
-      graphTitle: y,
-      barColor: U,
-      barPadding: J,
+      graphTitle: p,
+      barColor: J,
+      barPadding: R,
       showTicks: K,
       leftMargin: ri,
       rightMargin: Q,
@@ -1312,15 +1314,15 @@ function zt(wi) {
       backgroundColor: z,
       suffix: ti,
       prefix: o,
-      sources: R,
+      sources: B,
       graphDescription: T,
       height: A,
       width: g,
-      footNote: B,
+      footNote: q,
       colorDomain: b,
-      colorLegendTitle: q,
+      colorLegendTitle: F,
       padding: ei,
-      relativeHeight: F,
+      relativeHeight: H,
       tooltip: D,
       onSeriesMouseOver: di,
       refValues: L,
@@ -1331,27 +1333,27 @@ function zt(wi) {
       highlightedDataPoints: x,
       onSeriesMouseClick: C,
       graphDownload: li,
-      dataDownload: H,
+      dataDownload: P,
       language: I,
       theme: h,
       sortData: s,
       labelOrder: j,
-      minHeight: P,
+      minHeight: W,
       maxBarThickness: S,
-      maxNumberOfBars: W,
-      minBarThickness: p,
+      maxNumberOfBars: X,
+      minBarThickness: y,
       ariaLabel: m,
       resetSelectionOnDoubleClick: si,
       styles: f,
-      detailsOnClick: X,
+      detailsOnClick: Y,
       barAxisTitle: V,
-      noOfTicks: Y,
+      noOfTicks: E,
       valueColor: oi,
       classNames: w,
       filterNA: u,
-      targetStyle: E,
+      targetStyle: G,
       targetColor: O,
-      measureBarWidthFactor: G,
+      measureBarWidthFactor: _,
       qualitativeRangeColors: hi,
       animate: ci,
       dimmedOpacity: xi,
@@ -1362,9 +1364,9 @@ function zt(wi) {
     Ki,
     {
       data: r,
-      graphTitle: y,
-      barColor: U,
-      barPadding: J,
+      graphTitle: p,
+      barColor: J,
+      barPadding: R,
       showTicks: K,
       leftMargin: ri,
       rightMargin: Q,
@@ -1376,15 +1378,15 @@ function zt(wi) {
       backgroundColor: z,
       suffix: ti,
       prefix: o,
-      sources: R,
+      sources: B,
       graphDescription: T,
       height: A,
       width: g,
-      footNote: B,
+      footNote: q,
       colorDomain: b,
-      colorLegendTitle: q,
+      colorLegendTitle: F,
       padding: ei,
-      relativeHeight: F,
+      relativeHeight: H,
       tooltip: D,
       onSeriesMouseOver: di,
       refValues: L,
@@ -1395,27 +1397,27 @@ function zt(wi) {
       highlightedDataPoints: x,
       onSeriesMouseClick: C,
       graphDownload: li,
-      dataDownload: H,
+      dataDownload: P,
       language: I,
       theme: h,
       sortData: s,
       labelOrder: j,
-      minHeight: P,
+      minHeight: W,
       maxBarThickness: S,
-      maxNumberOfBars: W,
-      minBarThickness: p,
+      maxNumberOfBars: X,
+      minBarThickness: y,
       ariaLabel: m,
       resetSelectionOnDoubleClick: si,
       styles: f,
-      detailsOnClick: X,
+      detailsOnClick: Y,
       barAxisTitle: V,
-      noOfTicks: Y,
+      noOfTicks: E,
       valueColor: oi,
       classNames: w,
       filterNA: u,
-      targetStyle: E,
+      targetStyle: G,
       targetColor: O,
-      measureBarWidthFactor: G,
+      measureBarWidthFactor: _,
       qualitativeRangeColors: hi,
       animate: ci,
       dimmedOpacity: xi,